Facebook登录按钮onligin＝“;函数“;给出ReferenceError

Facebook login button onlogin="function" gives ReferenceError

本文关键字：函数 给出 ReferenceError 登录 按钮 onligin Facebook      更新时间：2023-10-31

到目前为止，我已经在我的页面上实现了一个facebook登录按钮。登录运行良好，但我想在登录成功后调用login.js代码中的一个函数。

我正在使用这个链接中的onligin，它将触发我的userLogin（）函数。

我的问题是，当我登录到应用程序时，我会得到这个ReferenceError:

[ReferenceError:userLogin未定义---sdk.js:1:1]

我不知道我为什么会犯这个错误。

我所有的javascript代码都放在一个.js文件中，并包含在的顶部。

相关代码：

userLogin（），它位于$（document）.ready（function（）｛…｝）中；

// This function is called when someone finishes with the Login Button.
function userLogin () {
    console.log("it worked");
    FB.getLoginStatus(function(response) {
        statusChangeCallback(response);
    });
}

HTML代码，将触发功能的按钮：

<body>
 <div id="fb-root"></div>
  <script src="login.js" type="text/javascript"></script>
  <div class="loginButton">
    <fb:login-button scope="public_profile,email" onlogin="userLogin();">
</fb:login-button>
  </div>

您的函数是在$(document).ready()的范围内定义的，而不是在外部定义的。

要使其在全球范围内可用，您可以在login.js:中执行此操作

var userLogin;
$(document).ready(function(){
    userLogin = function(){ /* ... */ };
});

注意：userLogin是一个可能会干扰另一个库的名称，如果该库是全局定义的，则该库可能会使用相同的名称。为了避免这种问题，我建议您给它一个更"自定义"的名称，比如myUserLogin。

函数必须在窗口上定义。解决方案是：

// somewhere before the button is rendered
window.loginCallback = res => {
    // handle response logic
}
    <div
      className="fb-login-button"
      data-max-rows="1"
      data-size="large"
      data-button-type="continue_with"
      data-onlogin="loginCallback();"
    ></div>
相关文章：