fb登錄彈出塊

Question

我正在使用fb登錄功能，但問題是，每當我在頁面媒體加載完成之前單擊fb登錄按鈕時，它會阻止fb登錄的彈出窗口，但如果我在第二次傳遞給加載事件后點擊fblogin它作品

這是我正在使用的功能：

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/它打開彈出窗口總是永遠不會阻止彈出窗口。

Answer 1

你不能從FB.login的回調中調用FB.getLoginStatus 。

瀏覽器傾向於阻止彈出窗口彈出窗口不是由用戶的單擊操作立即產生的。

因為FB.getLoginStatus執行ajax調用並且在它的響應上調用FB.login ，所以將阻止因此調用而打開的彈出窗口。

解決問題的方法是在頁面加載時調用FB.getLoginStatus並使用fb_login()方法中的響應。

Answer 2

這是完全正常的打電話FB.login從回調FB.getLoginStatus ，只要你有信心，登錄狀態已經在內部裝載 。 為此，請使用以下方法之一：

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

從技術上講，所有這些選項都使用FB.ui 異步過程必須完成，這可能需要幾秒鍾。 只要您已經使用上述方法之一與FB進行跨域調用，並且異步進程已完成，獲取登錄狀態將不會進行異步調用，並且不會阻止彈出窗口。

您還應確保不為第二個參數指定true ，如FB.getLoginStatus(..., true); 。

Answer 3

確保將狀態設置為true ，這將修復彈出窗口阻止程序問題。

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
  });

Answer 4

我有同樣的問題，它開了我的頭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);

            });
        }