Facebook喜欢按钮空白页面

时间:2015-12-22 15:53:44

标签: javascript facebook sdk

我在我自己的页面中测试了facebook like按钮的集成,但似乎没有通过,这是我的代码:

console

div { border: 1px solid; text-align: center; line-height: 100px; /* acts the same with or without height:100px */ }中没有任何内容,页面保持空白。

2 个答案:

答案 0 :(得分:1)

这是一个工作代码段

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Example Like</title>
    </head>
    <body>
        <div id="fb-root"></div>
        <script>(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#xfbml=1&version=v2.5&appId=692966564061436";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

        <div class="container">
            <div class="fb-like" data-href="http://example.com" data-layout="standard" data-action="like" data-show-faces="true" data-share="true"></div>
        </div>
    </body>
</html>

答案 1 :(得分:0)

我做了一些额外的研究并且能够解决这个问题,首先我需要更改facebook sdk url,因为我只在本地机器上进行测试:

// from
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5&appId=613335972130771";
 fjs.parentNode.insertBefore(js, fjs);
// to
js.src = "https//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5&appId=613335972130771";
 fjs.parentNode.insertBefore(js, fjs);

然后我开始收到一个非常明确的错误,指示我在我正在使用的facebook开发者应用程序(613335972130771)中更改我的域名,以便成为我正在测试的确切域名(local.app

  

应用程序配置不允许使用URL:应用程序的设置不允许使用一个或多个给定的URL。它必须与网站网址或Canvas网址匹配,或者该网域必须是某个应用网域的子网域。

更改了域名后,链接运行良好。