如何修复我在加载 Facebook javascript-sdk 时遇到的错误？

Question

我正在使用以下代码将 Facebook javascript sdk 加载到我的页面中：-

           (function() {
            console.log('Hello World! From self executing function.'); 
            var e = document.createElement('script');
            e.async = true;
            e.type = 'text/javascript';
            e.src = document.location.protocol +  '//connect.facebook.net/en_US/all.js';
            document.getElementById('fb-root').appendChild(e);
            console.log('javascript sdk is appended into the fb-root element of the page.');
        }());

它已正确加载，但我在控制台中收到以下错误：-

  Error: Permission denied to access property 'toString'
  [Break On This Error]     

   ...5(i(ca.getElementsByTagName('*')),'forEach',true,function(ka){if(!ea&&ka.getAttr...

如何解决这个问题？

谢天谢地，会收到任何帮助吗？

Answer 1

Facebook javascript SDK 通常会导致跨浏览器问题。为了解决这个问题，facebook 本身已经集成了一个方法，即通过在 FB.init() 函数中添加频道 url。

window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
  appId      : 'YOUR_APP_ID', // App ID from the App Dashboard
  channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File for x-domain communication
  status     : true, // check the login status upon init?
  cookie     : true, // set sessions cookies to allow your server to access the session?
  xfbml      : true  // parse XFBML tags on this page?
});

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

 };

添加频道文件可解决跨浏览器问题。

channel.html 文件的内容应该只是一行：

<script src="//connect.facebook.net/en_US/all.js"></script>

FB.init() 中的 channelUrl 参数是可选的，但强烈推荐。提供频道文件有助于解决三个特定的已知问题。

• 包含跨帧通信代码的页面可能会导致社交插件在没有 channelUrl 的情况下显示为空白。
• 如果没有提供 channelUrl 并且页面包含自动播放的音频或视频，则用户可能会听到两个音频流，因为页面已在后台第二次加载以进行跨域通信。
• 频道文件将防止在您的服务器端日志中包含额外的点击。如果未指定 channelUrl，则应从日志中删除包含 fb_xd_bust 或 fb_xd_fragment 参数的页面浏览量以确保正确计数。

channelUrl 必须是与包含 SDK 的页面匹配的完全限定 URL。换句话说，如果您的站点使用 www 提供服务，则频道文件域必须包含 www，并且如果您修改页面上的 document.domain，您也必须在 channel.html 文件中进行相同的 document.domain 更改。

https://developers.facebook.com/docs/reference/javascript/