Facebook登录按钮不会调用回调函数

Question

我不确定我是否理解应该怎么做。

首先是FB按钮，它出现在屏幕上并带我到FB登录页面进行确认。

即使这个按钮没有onclick，它也会带我到登录窗口，但我添加了onclick并定义了一个函数：

<div onclick="login();" class="fb-login-button" data-width="300" data-size="large" data-button-type="continue_with" data-auto-logout-link="false" data-use-continue-as="false" ></div>

该函数位于js文件中，并且是：

  function login()
      {
          console.log("connecting...."); 
                 FB.login(function(response) {
                    if (response.status === 'connected') {
                      console.log("connected");
                      testAPI();
                    } else {
                      console.log("not connected");
                    }
                  });

      }

即使我单击FB按钮，即使我成功登录，也不会打印任何内容，甚至不会“连接......”。没有错误。

怎么做？我想登录他，打电话给一个批准他的功能，并提取他的详细信息。

Answer 1

您混合了两个不同的概念，您可以使用官方登录按钮或使用JavaScript SDK的FB.login。登录按钮只需要“onlogin”并自动处理其他所有内容，如文档中所示：https://developers.facebook.com/docs/facebook-login/web/login-button/

如果您想使用FB.login，请使用随机div（或任何HTML标记）：

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

更多信息：https://www.devils-heaven.com/facebook-javascript-sdk-login/

Answer 2

使用内联代码是不好的做法，你需要为div分配一个ID或类，并对它调用函数，例如：

<div class="test">Click me!</div>

$('div.test').click(function(){
    login();
});

希望这可以帮助。