fb登录弹出块

问题描述:

我正在使用fb登录功能,但问题是我每次在页面媒体加载完成之前单击fb登录按钮时,它会阻止fb登录弹出窗口,但如果在点击fblogin之后第二个传递给加载事件它的工作原理fb登录弹出块

这里是我使用的功能:

function fb_login() { 
var email=''; 
console.log(loginClassbackQueue); 
// console.log('user wants to login with fb'); 
FB.getLoginStatus(function(response) { 
    if(response.status!='connected'){ 
     FB.login(function(response) { 
      // console.log(response); 
      if (response.authResponse) { 
       // console.log('user logged in successfully'); 
       // console.log(response); 
       email = update_f_data_login(response); 
       $('#fb_login_popup, #popup_overlay').hide(); 
       // loginme(email); 
       } 
      else { 
        loginClassbackQueue = []; 
       // console.log('user failed to login'); 
       } 
       // console.log('fb login completed successfully'); 
      }, {scope:"email,user_birthday,user_likes,user_location,friends_likes,publish_actions"} 
     ); 
     } 
    else{ 
    // console.log('logged in and connected'); 
    email = update_f_data_login(response); 
    $('#fb_login_popup, #popup_overlay').hide(); 
    } 

}); 

} 

,当我在这个网站http://fab.com/做同样的动作也打开弹出式窗口始终不曾阻止弹出窗口。

FB.getLoginStatus的回调中您不能拨打FB.login

浏览器倾向于阻止弹出窗口的弹出窗口不会产生为用户的单击操作的直接结果。

因为FB.getLoginStatus做一个ajax呼叫,调用它的响应,这将打开,因为这调用的结果是受阻弹出FB.login

解决您的问题的方法是在页面加载中调用FB.getLoginStatus并使用fb_login()方法中的响应。

+0

它似乎是合乎逻辑,让我来试试吧..感谢 –

+0

烨其工作真棒现在感谢:) –

+1

这种解决方案仅适用如果用户在页面加载时登录到Facebook。否则失败。 –

这是完全正常的调用FB.loginFB.getLoginStatus回调,只要你有信心,登录状态已已经加载内部。为此,请使用以下其中一种:

  • FB.init({..., status: true, ... })
  • FB.getLoginStatus(...)
  • FB.login(...)
  • FB.ui(...)

技术上所有这些选项使用FB.ui。异步过程必须完成,这可能需要几秒钟。只要您已经使用上述方法之一与FB进行跨域调用,并且异步过程已完成,获取登录状态将不会进行异步调用,并且不会阻止弹出窗口。

你也应该确保为第二个参数指定true,为FB.getLoginStatus(..., true);

+6

我认为这应该被标记为正确的解决方案。 –

+0

谢谢@AndrewF拯救了我的生活 –

+0

将FB.getLoginStatus(...,true)第二个参数设置为true将调用桌面Chrome中的弹出窗口阻止程序;只有在使用URL回调登录强制缓存的特殊情况下才能使用它(例如:用于在Chrome iOS中登录Facebook)。 – morph85

确保您设置状态真正,这将固定的弹出窗口拦截器的问题。

window.fbAsyncInit = function() { 
    FB.init({ 
    appId  : '{your-app-id}', 
    cookie  : true, // enable cookies to allow the server to access 
         // the session 
    xfbml  : true, // parse social plugins on this page 
    version : 'v2.5', // use graph api version 2.5 
    status  : true // set this status to true, this will fixed popup blocker issue 
    }); 
+1

这对我有效......状态选项的文档说明它确定用户的当前登录状态每次页面加载时都会重新检索。如果禁用,则必须使用.getLoginStatus()手动检索该状态。默认为false。 虽然我对它的实际操作有一点点想法......无论用户是否登录了fb,它都可以工作...... – Rishabh

我有同样的问题,并踢我的头3天。我偶然发现了上面提到的解决方案,他们在Firefox和Edge上工作,但是在Chrome中无所谓,我仍然被拦截到左边和右边。其他问题是当我从按钮按下事件调用函数时,登录对话框没有阻止,但在登录对话框关闭后没有得到任何响应,以便进一步操作,所以我卡住了。因此,我的解决方案如下,但不需要按按钮登录,它将重定向到FB登录页面而无需按下按钮事件,并返回所有其他sdk步骤。只需添加到您的代码,看看是否有帮助,从那里根据您的需要调整

function statusChangeCallback(response) { 
      console.log('statusChangeCallback'); 
      console.log(response); 


      // The response object is returned with a status field that lets the 
      // app know the current login status of the person. 
      // Full docs on the response object can be found in the documentation 
      // for FB.getLoginStatus(). 
      if (response.status === 'connected') { 
       // Logged into your app and Facebook. 
       document.getElementById('Image2').style.display = "none"; 
       document.getElementById('mail').style.display = "in-line"; 

       testAPI(); 
      } else { 
       // The person is not logged into your app or we are unable to tell. 
       window.alert("Faça login no facebook antes de continuar - Obrigado"); 
       window.location.href = 'https://www.facebook.com/dialog/oauth' + 
       '?client_id=55215442252214521548' + 
       '&scope=public_profile,email,user_friends' + 
       '&redirect_uri=' + encodeURIComponent(document.URL); 
       document.getElementById('Image2').style.visibility = "hidden"; 
       document.getElementById('mail').style.display = "in-line"; 

      } 
     } 

     // This function is called when someone finishes with the Login 
     // Button. See the onlogin handler attached to it in the sample 
     // code below. 
     function checkLoginState() { 
      FB.getLoginStatus(function (response) { 
       statusChangeCallback(response); 

      }); 
     }