自定义登录按钮与Facebook Java Script SDK不工作

Custom login button with Facebook Java Script SDK not working

本文关键字:Script SDK 工作 Java Facebook 登录 按钮 自定义      更新时间:2023-09-26

我试图通过使用FB JS SDK实现Facebook登录的自定义按钮。问题是-当我调用函数fb_login()控制台说,函数是未定义的。我该如何更改此代码?JS:

<script>
        $(document).ready(function () {
            window.fbAsyncInit = function () {
                FB.init({
                    appId: 'APP_ID',
                    status: true,
                    cookie: true,
                    xfbml: true,
                    version: 'v2.0'
                });
            }
            function fb_login() {
                FB.login(function (response) {
                    if (response.status === 'connected') {
                        var uid = response.authResponse.userID;
                        var url = "http://graph.facebook.com/" + uid + "/picture?type=large";
                        var accessToken = response.authResponse.accessToken;
                        var form = document.createElement("form");
                        form.setAttribute("method", 'post');
                        form.setAttribute("action", 'FacebookLogin.ashx');
                        var field = document.createElement("input");
                        field.setAttribute("type", "hidden");
                        field.setAttribute("name", 'accessToken');
                        field.setAttribute("value", accessToken);
                        var field1 = document.createElement("input");
                        field1.setAttribute("type", "hidden");
                        field1.setAttribute("name", 'img');
                        field1.setAttribute("value", url);
                        form.appendChild(field);
                        form.appendChild(field1);
                        document.body.appendChild(form);
                        form.submit();
                    }
                    else if (response.status === 'not_authorized') {
                        FB.login();
                    } else {
                        FB.login();
                    }
                });
            }
            (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/ru_RU/all.js";
                ref.parentNode.insertBefore(js, ref);
            }(document));
        });
    </script>

这是HTML部分:

<div id="fb-root"></div>
    <div class="lvl2 b-visible">
            <a class="btn-fc" onclick="return fb_login();" href="#">Authorize using FB</a>
        </div>

注:我已经看过类似问题的答案了(比如这个)。解决方案与我的问题完全相似,但它不起作用。

您的fb_login()函数定义在作用域之外,您的按钮可以调用它。如果您希望fb_login()$(document).ready(function(){});内部,并且仍然从<a>调用它,则需要使用以下内容将该函数附加到全局变量范围:

$(document).ready(function () {
  // window.fbAsyncInit code here
  window.fb_login = function fb_login() {
     // Your existing fb_login() code here
  }
  // Code here
});

你可以在这里看到一个类似的问题/答案:在jQuery文档中调用函数ready

你可以在这里阅读更多关于JavaScript变量作用域的内容:http://msdn.microsoft.com/en-us/library/ie/bzt2dkta(v=vs.94).aspx