javascript - 如何修复我在加载 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() 函数中添加一个 channel 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 文件解决了跨浏览器问题。

channel.html 文件的内容应该只有一行:

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

FB.init() 中的 channelUrl 参数是可选的，但强烈建议使用。提供 channel 文件有助于解决三个特定的已知问题。

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

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

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