Facebook的JavaScript SDK

Question

我正在嘗試開始使用Facebook的JavaScript SDK，但是當我嘗試在我的wamp服務器中運行html文件時，我總是遇到以下錯誤：

Uncaught SecurityError: Blocked a frame with origin "http://static.ak.facebook.com" from accessing a frame with origin "http://localhost:9000". Protocols, domains, and ports must match. VM631:1
Uncaught SecurityError: Blocked a frame with origin "https://s-static.ak.facebook.com" from accessing a frame with origin "http://localhost:9000".  The frame requesting access has a protocol of "https", the frame being accessed has a protocol of "http". Protocols must match.
 VM638:1
Uncaught SecurityError: Blocked a frame with origin "http://static.ak.facebook.com" from accessing a frame with origin "http://localhost:9000". Protocols, domains, and ports must match. 

這是我的測試代碼：

<div id="fb-root"></div>
<script>
    window.fbAsyncInit = function() {
        // init the FB JS SDK
        FB.init({
            appId      : 'APP_ID',                     // App ID from the app dashboard
            status     : true,                                 // Check Facebook Login status
            xfbml      : true                                  // Look for social plugins on the page
        });

        // Additional initialization code such as adding Event Listeners goes here
    };

    // Load the SDK asynchronously
    (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 = "https://connect.facebook.net/en_US/all.js";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));

</script>
</body>
</html>

Answer 1

你有沒有嘗試過基於jQuery的Facebook SDK？ 以下片段可能會對您有所幫助

$(document).ready(function() {
      $.ajaxSetup({ cache: true });
      $.getScript('//connect.facebook.net/en_UK/all.js', function(){
        FB.init({
          appId: 'YOUR_APP_ID',
        });     
        $('#loginbutton,#feedbutton').removeAttr('disabled');
        FB.getLoginStatus(updateStatusCallback);
      });
    })

注意：此示例使用jQuery，因此您需要包含它

Answer 2

試試吧.. :)

    <div id="fb-root"></div>
    <script>
        window.fbAsyncInit = function() {               
            FB.init({
                appId      : '**appId**',
                channelUrl : '//local.facebook-test/channel.html',
                status     : true,
                xfbml      : true,
                oauth      : true
            });
            FB.login(function(response)
            {
                if (response.authResponse)
                {
                    console.log(response.authResponse.accessToken);
                     var opts = {
                        message : '**message**',
                        name : '**name**',
                        link : 'https://developers.facebook.com/docs/reference/dialogs/'                                                        
                     };
                    FB.api('/me/feed', 'post', opts, function(response)
                     {
                        if (!response || response.error)
                        {
                            console.log(response.error);
                            alert('Posting error occured');
                        }else{
                            alert('Success - Post ID: ' + response.id);
                        }
                     });
                } else {
                    alert('Not logged in');
                }
            }, { scope: 'manage_pages, publish_actions, user_photos' });

        };
        (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/all.js";
            fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));
    </script>
</body>