使用facebook api，但得到fb未定义错误

尝试在Facebook上发布点击事件并获得FB未定义错误。下面是代码。我如何在Fb方法之外使用Fb。我研究了一下，发现FB是异步初始化的，这意味着它可以在文档准备好之前或之后加载。我如何修复我的代码，使我可以调用FB变量时，我需要它已经初始化。

<!DOCTYPE HTML>
<html>
    <head>
        <title></title>
    </head>
    <body>
        <script src="jquery-1.11.1.min.js"></script>
    <script>
        window.fbAsyncInit = function() {
            FB.init({
              appId      : '1521775134725984',
              xfbml      : true,
              status     : true,
              cookie     : true,
              version    : 'v2.1'
            });
        };
        $("#message").on("click",function(){
            FB.getLoginStatus(function(response) {
                if (response.status === 'connected') {
                    var body = 'Reading JS SDK documentation';
                    FB.api('/me/feed', 'post', { message: body }, function(response) {
                        if (!response || response.error) {
                            alert('Error occured');
                        } else {
                            alert('Post ID: ' + response.id);
                        }
                    });
                }
                else {
                    FB.login(function(){
                    }, {scope: 'publish_actions'});
                }
            });
        });
    (function(d, s, id){
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) {return;}
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/en_US/sdk.js";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
</script>
    </body>
</html>

使用以下代码。如果在文档准备好时加载了facebook，则init FB;另一方面，设置fbAsyncInit函数在加载facebook时使用。如果愿意，可以将getLoginStatus调用包装在循环中。这个答案是使用以下源代码开发的:使用异步加载的javascript

<!DOCTYPE HTML>
<html>
    <head>
        <title></title>
        <script src="jquery-1.11.1.min.js"></script>
    </head>
    <body>
        <input type="text" id="message" />
        <input type="button" id="send" value="Send" />
    <script>
        $(document).ready(function(){
            function facebookReady() {
                FB.init({
                    appId      : '1521775134725984',
                    xfbml      : true,
                    status   : true,
                    cookie     : true,
                    version    : 'v2.1'
                });
                $(document).trigger("facebook:ready");
            }
            if(window.FB) {
                facebookReady();
            } else {
                window.fbAsyncInit = facebookReady;
            }
        });
        $(document).on("facebook:ready", function() {
            $("#send").on("click", function() {
                FB.getLoginStatus(function(response) {
                    if (response.status === 'connected') {
                        var body = $("#message").val();
                        FB.api('/me/feed', 'post', { message: body }, function(response) {
                            if (!response || response.error) {
                                alert('Error occured');
                            } else {
                                alert('Post ID: ' + response.id);
                            }
                        });
                    }
                    else {
                        FB.login(function(){
                        }, {scope: 'publish_actions'});
                    }
                });
            });
        });
    (function(d, s, id){
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) {return;}
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/en_US/sdk.js";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
</script>
    </body>
</html>

相关内容

最新更新

热门标签：