Facebook javascript SDK FB.login无法在Facebook iFrame中运行

Question

我们正在使用Facebook JavaScript SDK来验证我们的Facebook应用程序。 该应用程序使用Canvas URL配置为http://facebook.elgifto.com/Home/Index/ 。 以下是我们用于验证Facebook用户的代码。

    <script type="text/javascript">
          window.fbAsyncInit = function() {
              debugger;
                  FB.init({
                      appId: '<%= ViewData["AppId"].ToString() %>', // App ID
                      channelUrl: '<%= ViewData["ChannelUrl"].ToString() %>', // Channel File
                      status: true, // check login status          
                      cookie: true, // enable cookies to allow the server to access the session
                      xfbml: true,  // parse XFBML
                      oauth: true
                  });

              FB.Event.subscribe('auth.login', function(response) {
                  if (response.status === 'connected') {
                      // the user is logged in and connected to your
                      // app, and response.authResponse supplies
                      // the user’s ID, a valid access token, a signed
                      // request, and the time the access token 
                      // and signed request each expire
                      var uid = response.authResponse.userID;
                      var accessToken = response.authResponse.accessToken;
                      startApp(uid, accessToken);
                  }

              });

          };

          // Load the SDK Asynchronously
          (function(d) {    
              var js, id = 'facebook-jssdk'; if (d.getElementById(id)) { return; }
              js = d.createElement('script'); js.id = id; js.async = true;
              js.src = "//connect.facebook.net/en_US/all.js";
              d.getElementsByTagName('head')[0].appendChild(js);
          } (document));




          function startApp(uid, accessToken) {                 
              var baseUrl = '<%= ViewData["AppBaseURL"].ToString() %>';
              var redirectUrl = baseUrl + '?uid=' + uid + '&accessToken=' + accessToken;
              window.top.location.href = redirectUrl;
              //document.location = redirectUrl;
          }          
       </script>
<fb:login-button onlogin="initiateLogin()" perms="email,user_about_me,user_birthday,friends_about_me,friends_birthday">Login with Facebook</fb:login-button>

当访问http://apps.facebook.com/giftguru时，上面的代码在Facebook中不起作用。 但是我们可以通过http://facebook.elgifto.com/Home/Index访问它

Answer 1

该问题与浏览器弹出窗口阻止有关。 （在Facebook之外为你工作的事实可能是因为有时你被允许这样做，对我来说它被阻止以及在应用程序内）。

你不应该在没有用户交互的情况下调用FB.login （比如元素click或表单submit ），以确保浏览器不会阻止登录窗口。

更新：
你在这里混合很多东西：

1. http://facebook.elgifto.com/Home/Index上的页面正在使用应用程序＃316853928368079 （此应用程序并且没有namespace ！）
2. 您的OAuth对话框的URL在client_id周围有' （撇号），这是错误的！
3. OAuth Dialog无法正常工作（也可能是应用程序设置， App Domain ？）
4. 位于http://apps.facebook.com/giftguru上的应用程序是应用程序＃83808922524，并且有错误的Canvas URL！ 证明 ：
   

Answer 2

我希望这对你有所帮助

  <body>
      <div id="fb-root"></div>
      <script>
        window.fbAsyncInit = function() {
          FB.init({
            appId      : 'xxxxxxx',
            status     : true, 
            cookie     : true,
            xfbml      : true,
            oauth      : true,
          });
        };
        (function(d){
           var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
           js = d.createElement('script'); js.id = id; js.async = true;
           js.src = "//connect.facebook.net/en_US/all.js";
           d.getElementsByTagName('head')[0].appendChild(js);
         }(document));

       //LOGIN FUNCTION 
       function login() {
        FB.login(function(response) {
            if (response.authResponse) {
                alert('Success!');
            }else{
                alert('Login Failed!');
            }
        }, {scope: 'email'});
     }
      </script>
      <div onclick="login();">Login with Facebook</div>
    </body>

Answer 3

还要检查deveopers.facebook.com上的应用是否未处于沙盒模式。 我有一个问题登录与我的主帐户（这是应用程序管理员）工作正常，但不与其他Facebook帐户。 后来我意识到fb app仍处于沙盒模式，我不得不添加每个正在测试Tester或Developer的帐户或禁用沙盒模式。

也许这会对某人有所帮助，我花了一个小时才搞清楚。 :)

Answer 4

Facebook突然从使用他们的Facebook对话框方法切换到今天的老式弹出窗口显示身份验证窗口。 到目前为止，只有在Facebook标签/画布外运行应用程序时才会使用弹出窗口。 这意味着您无法再在加载时运行FB.login并使用click事件来避免弹出窗口FB.login 。

我们在Facebook上找到的唯一文档是https://developers.facebook.com/docs/concepts/login/permissions-login-dialog/ ，但很明显，这个弹出窗口方法可用于游戏好几个星期了。