被浏览器阻止的Facebook登录弹出窗口

Question

我对javascript很陌生，真的不知道该怎么做，Facebook登录仍然在任何浏览器中被弹出窗口阻止程序阻止

我将此代码放在文件 fbapp1 中.php

<script>
window.fbAsyncInit = function() {
    FB.init({
        appId      : 'myappid', // App ID
        channelUrl : '//example.com/fbapp1.php', // Channel File
        status     : true, // check login status
        cookie     : true, // enable cookies to allow the server to access the session
        xfbml      : true  // parse XFBML
    });
    // this shouldn't be called directly, but instead should be initiated with a user click event
    FB.login(function(response) {
        if (response.authResponse) {
            // document.write ('Access Token: ' + response.authResponse.accessToken);
            window.location = 'https://example.com/fbapp2.php?access_token=' + response.authResponse.accessToken;
        } else {
            alert ('User cancelled login or did not fully authorize.');
        }
    });
};
// Load the SDK Asynchronously
(function(d){
    var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
    if (d.getElementById(id)) {return;}
    js = d.createElement('script'); js.id = id; js.async = true;
    js.src = "//connect.facebook.net/en_US/all.js";
    ref.parentNode.insertBefore(js, ref);
}(document));
</script>

为了打开这个文件，我在另一个页面中使用了简单的html href代码

<a href="https://example.com/fbapp1.php" target="_blank">"Pulsa Fortune App"</a>

但是Facebook登录弹出窗口总是被浏览器阻止。上面的代码已经告诉了这个东西，但我不知道它是什么意思？

这不应该直接调用，而应该被启动 使用用户点击事件

请告诉我我的代码应该如何？

Answer 1

不要在异步回调函数中调用FB.login - fbAsyncInit是异步的。您必须在用户交互时调用它，否则浏览器将有充分的理由阻止它。

例：

document.getElementById('loginBtn').addEventListener('click', function() {
    //do the login
    FB.login(function(response) {
        if (response.authResponse) {
            //user just authorized your app
            document.getElementById('loginBtn').style.display = 'none';
            getUserData();
        }
    }, {scope: 'email,public_profile', return_scopes: true});
}, false);

来源： http://www.devils-heaven.com/facebook-javascript-sdk-login/