Facebook Canvas,无法在移动设备上从Facebook登录

Jon*_*y-Y 8 javascript facebook canvas facebook-graph-api angularjs

我有一个canvas facebook应用程序,它有一个网页和一个指定的移动页面.网页工作正常,当使用控制台模拟浏览器移动时,一切正常.

但是,当我尝试从Facebook移动应用程序运行应用程序时,画布应用程序加载(这是正确的),但它不登录.

我正在使用FB.login函数.

login: function () {
        var deferred = $q.defer();
        FB.login(function (response) {
            if (!response || response.error) {
                deferred.reject('Error occured');
            } else {
                deferred.resolve(response);
            }
        }, {
            scope: 'email, user_friends'
        });
        return deferred.promise;
    },
Run Code Online (Sandbox Code Playgroud)

并在设置>高级 - 我有:客户端OAuth登录,Web OAuth登录,嵌入式浏览器OAuth登录,有效的OAuth重定向URI和正确填写的设备登录.

但仍然从Facebook移动应用程序,画布应用程序不会预先登录.

我一直试图让这一整天都在工作.我无法在任何地方找到解决方案.我也无法调试移动Facebook应用程序.

任何想法如何处理这个问题?

编辑

还查看了我的节点服务器日志,我发现甚至没有调用FB.login.

编辑2

我最终用getLoginStatus替换了登录,这对我来说没有任何问题,因为它是一个Facebook画布应用程序...但问题仍然是如何登录.

编辑3 11/26/2015

那么getLoginStatus并没有完全解决我的问题,因为它实际上并没有记录用户所以对于画布游戏你可能需要登录第一个条目,如果你需要权限...我的解决方案是添加登录如果getLoginStatus像这样返回not_autorized:

        /**
     * [getLoginStatus get the FB login status]
     * @return {[type]} [description]
     */
    getLoginStatus: function () {
        var deferred = $q.defer();
        FB.getLoginStatus(function (response) {
            if (response.status === 'connected') {
                deferred.resolve(response);
            } else if (response.status === 'not_authorized') {
                _fbFactory.login().then(function (fbLoginResponse) {
                    deferred.resolve(fbLoginResponse);
                });
            } else {
                deferred.reject('Error occured');
            }
        });
        return deferred.promise;
    },
Run Code Online (Sandbox Code Playgroud)

但是等等,还有更多... FB.login功能在移动画布游戏中不能很好地工作(不确定它是否刚刚触发或者浏览器博客弹出窗口或两者兼而有之).无论如何你需要通过按钮主动调用它...所以对于移动画布游戏我必须添加一个开始播放按钮,然后登录确实工作..

编辑4(最后)

最后我注意到FB.login()没有被触发,除非它是一个触发它的外部事件,所以我不得不对Mobile canvas进行更改,如果getLoginStatus没有返回连接,那么我会显示一个登录按钮来登录. ..其余的都保持不变.我为移动设备做的事情与接受的答案类似,只是为了满足我的需求......

我希望这可以帮助除了我以外的人......

Pro*_*Guy 1

确保您使用用户触发的事件(例如按钮上的 onclick)调用 FB.login(),因为浏览器可能会阻止直接调用的潜在不安全/危险的 javascript。这为最终用户提供了额外的安全保障。有两种方法可以创建登录按钮:

  1. 使用 facebook 登录按钮生成器生成登录按钮: https://developers.facebook.com/docs/facebook-login/web/login-button

生成的登录按钮将类似于以下内容:

<fb:login-button scope="public_profile,email" onlogin="checkLoginState();">
</fb:login-button>
Run Code Online (Sandbox Code Playgroud)
  1. 创建您自己的 html 并使用 onclick 事件调用 FB.init():
    <button onclick="FB.init()">Login</button>
    
    Run Code Online (Sandbox Code Playgroud)

Facebook 开发者网站的注释:

正如此函数的参考文档中所述,它会生成一个显示“登录”对话框的弹出窗口,因此只能在有人单击 HTML 按钮时调用(以便浏览器不会阻止弹出窗口)。

https://developers.facebook.com/docs/facebook-login/web

此外,FB.getLoginStatus 是登录检查您的用户是否登录 facebook 和您的应用程序的正确第一步。

您需要执行几个步骤才能将 Facebook Login 集成到您的 Web 应用程序中,其中大部分都包含在本页顶部的快速入门示例中。从高层次来看,这些是:

  1. 检查登录状态以查看是否有人已经登录到您的应用程序。在此步骤中,您还应该检查是否有人之前登录过您的应用程序,但当前尚未登录。
  2. 如果他们未登录,则调用登录对话框并请求一组数据权限。
  3. 验证他们的身份。
  4. 存储生成的访问令牌。
  5. 进行 API 调用。
  6. 登出。

我发现您的游戏不再需要登录,但也许其他人会发现这个答案很有用。:)