点击即可加载Facebook SDK

时间:2015-01-11 15:51:24

标签: javascript facebook

显然,有些人对使用Facebook插件的网站不满意,因为他们不想跟踪他们不在Facebook上时所做的事情。有Shariff,这看起来是一个公平的方法:在用户点击Facebook按钮(此处为demo)之前,Facebook插件不会被加载。

我尝试做同样的事情(使用JavaScript SDK)。但是,我公然无法动态加载SDK。我也没有收到任何错误消息(是的,我确实插入了应用ID)。

有什么想法吗?以下代码取自API docs

<html>
<body>

<script type="text/javascript">
    window.onload = function() {
        var e = document.getElementById('share_on_fb_link');
        e.onclick = share_on_fb;

        function share_on_fb() {
            // Code from https://developers.facebook.com/docs/javascript/quickstart/v2.2

            // Basic Setup
            window.fbAsyncInit = function() {
                FB.init({
                  appId      : 'your-app-id',
                  xfbml      : true,
                  version    : 'v2.1'
                });
            };

            (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'));

            // Using the SDK to trigger a Share dialog
            FB.ui({
                method: 'share',
                href: 'https://developers.facebook.com/docs/'
            }, function(response){});

          return false;
        }
    }
</script>

<a id="share_on_fb_link" href="#">Link</a>

</body>
</html>

1 个答案:

答案 0 :(得分:1)

我终于想出了一个有效的解决方案。首先,您必须在FB.ui之后致电FB.init。但根据https://stackoverflow.com/a/3549043/745266,这不能完全解决问题 - FB.init正在向facebook发出异步请求,因此必须延迟调用FB.ui,直到完全设置Facebook。以下代码应该有效:

window.onload = function() {
    var e = document.getElementById('share_on_fb_link');
    e.onclick = share_on_fb;

    function share_on_fb() {
        // Code from https://developers.facebook.com/docs/javascript/quickstart/v2.2

        // Basic Setup
        window.fbAsyncInit = function() {
            FB.init({
              appId      : 'your-app-id',
              xfbml      : true,
              version    : 'v2.1'
            });

          // Delay FB.ui code until Facebook is fully initialized
          FB.getLoginStatus(function(response){
              // Using the SDK to trigger a Share dialog
              FB.ui({
                  method: 'share',
                  href: 'https://developers.facebook.com/docs/'
              }, function(response){});
          });
        };

        (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'));

      return false;
    }
}