加载页面时，FB.login弹出窗口被阻止

FB.login pop up is blocked when page on load

本文关键字：窗口 login FB 加载      更新时间：2023-09-26

页面加载时调用FB.login时遇到问题，FB.login弹出窗口被浏览器阻止。目前我知道我必须在用户点击事件后调用FB.login，但由于客户端的业务逻辑，我不得不这样做。

FB.api('/me/permissions', function(response2) {
    var permsArray = response2.data[0];
    var permsNeeded = ["user_events"]; 
    var permsToPrompt = [];
    for (var i in permsNeeded) {
       if (permsArray[permsNeeded[i]] == null) { 
        permsToPrompt.push(permsNeeded[i]);
      }
    }   
    if (permsToPrompt.length > 0) {
      promptForPerms(permsToPrompt);
    }
});

var promptForPerms = function(perms) {
    FB.login(function(response) {
    }, {scope: perms.join(',')});
};

有没有任何解决方案可以在没有用户点击事件的情况下调用FB.login（）？或者对此有什么调整吗？感谢您的帮助。

不幸的是，您将无法通过代码绕过弹出窗口阻止程序。

解决此问题的方法是在页面加载时将用户重定向到Facebook权限对话框，如手动构建登录流的文档中所述。

您首先需要检测用户是否已经通过身份验证/连接到您的应用程序，并且仅在未连接时重定向。这最好在window.fbAsyncInit函数中完成，如下所示：

window.fbAsyncInit = function() {
    var myAppID = 'YOUR APPLICATION ID';
    FB.init({ appId: myAppID });
    FB.getLoginStatus(function(response) {
        if ('connected' != response.status) {
            window.location.href = 'https://www.facebook.com/dialog/oauth' +
                '?client_id=' + myAppID +
                '&scope=user_events' +
                '&redirect_uri=' + encodeURIComponent(document.URL);
        } else {
            alert('welcome to my app');
        }
    });
};

另一种选择是稍微调整您的用户旅程；也许如果用户没有连接，那么你可以显示一个覆盖层，其中包含一条消息，要求他们进行身份验证，以及一个按钮，点击后会调用FB.login.

相关文章：