logo标签列表

JavaScript：我的fbAsyncInit（）方法从未被调用

javascriptfacebookfbconnectfbjs
13
我直接从Facebook的开发者网站此页面复制代码，但fbAsyncInit()方法从未触发。我还阅读了此页面，尝试了多种不同的代码调整方式，但无法让该方法触发。你有什么想法吗？
另外值得一提的是，当我在Mac上的Chrome浏览器中运行此代码并运行Firebug Lite时，会出现错误，显示"无法在此页面加载Firebug Lite"。
以下是代码...
<html>
<head>
</head>
<body>
<div id="fb-root"></div>
<script type="text/javascript">
  window.fbAsyncInit = function() {
    FB.init({
      appId      : '1234567890', // App ID
      channelUrl : '//localhost/test.html', // Channel File
      status     : true, // check login status
      cookie     : true, // enable cookies to allow the server to access the session
      xfbml      : true  // parse XFBML
    });

    alert("this statement never gets called either");
  };

  // Load the SDK Asynchronously
  (function(d){
     var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook.net/en_US/all.js";
     d.getElementsByTagName('head')[0].appendChild(js);
   }(document));
</script>
</script>
</body>
</html>
你的文件叫做test.html吗？ - DMCS
1
是的，这有问题吗？ - BeachRunnerFred
有任何JS错误吗？ - Mikey G
你正在测试哪个浏览器？尝试更改一些不存在的src并在此之后检查浏览器中的错误日志。 - Cheery
6个回答
9
我遇到了同样的问题。似乎在异步加载之前，我在其他地方加载了JavaScript库//connect.facebook.net/en_US/all.js。
这可能会让事情变得混淆不清。
我删除了提前加载标签的定义，现在一切都好了。
这是问题的解决方案！ - Brane
我刚刚把window.fbAsyncInit回调函数从FB.init中移除了，这对我起作用了。不知道为什么，但是这种方法每次都有效。任何其他解决方法只有部分时间有效。 - HartleySan
6

你应该更改为：

 js.src = "//connect.facebook.net/en_US/all.js";

to:

 js.src = "http://connect.facebook.net/en_US/all.js";
1
什么鬼？？如果没有 Stack Overflow，我不知道该怎样解决这个问题。 - Scott Selby
32
如果您从HTTPS加载，这样做会破坏您的应用程序，不好。如果您必须强制使用任何协议，请确保使用HTTPS。 - maskedbacon
最好不要使用协议，否则像@maskedbacon所说，使用https。 - magikMaker
这也解决了我的问题。有趣的是，在添加协议并重新加载页面后，控制台（Firefox）中显示了大量类似于Facebook初始化消息的内容。我刚刚创建了它所引用的FB应用程序。 - Mark
对我来说有效，只是将 http 改为 https。 - leonardofmed
@leonardofmed，您能否看一下https://stackoverflow.com/questions/66654709/facebook-sdk-send-method-in-reactjs？ - Asking
5

您是否遇到同步加载的问题？

    <script src="//connect.facebook.net/en_US/all.js"></script>
<script>
  FB.init({
    appId      : 'YOUR_APP_ID',
    channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
    status     : true, // check login status
    cookie     : true, // enable cookies to allow the server to access the session
    xfbml      : true  // parse XFBML
  });
</script>
我不知道...这个人正在异步加载，而且似乎对他有效：http://facebook.stackoverflow.com/questions/2855784/facebook-graph-api-fb-login-called-before-calling-fb-init 如果你阅读答案，顶部的代码是有效的，他只是忘记输入正确的appid。 - Mikey G
@BeachRunnerJoe 看起来他是将下面的脚本附加到 fb-root div 上，而不是头部。 - Mikey G
@MikeyG 这个脚本是从 Facebook http://developers.facebook.com/docs/reference/javascript/ 的示例。 - Cheery
谢谢，Mikey G，我正在尝试使用AppID。我仍然不明白为什么警报语句没有被调用。即使init方法因为AppID不正确而失败，警报方法似乎仍然应该被调用，不是吗？ - BeachRunnerFred
应该是这样的，我认为你可以理解为 window.fbAsyncInit 没有被调用。 - Mikey G
显示剩余5条评论
2

这个答案可能太晚了，在许多情况下不会有所帮助，但是我发现我的Firefox浏览器在一些正常工作后似乎变得有点疯狂，并导致了那个确切的错误...只需重新启动它就行了。

好的，我刚刚找到了问题的确切来源。我使用FF进行开发，并且不时地使用Scratchpad（工具->Web Developer->Scratchpad）……出于某种原因，即使我只是在那里执行一个简单的alert()，它也会导致这个问题。希望能帮助到其他人。 - Nimrod Yonatan Ben-Nes
好的，忽略上面的“即使”，当从Scratchpad发出alert（）时会造成问题。 - Nimrod Yonatan Ben-Nes
1
哇！我现在非常讨厌 Chrome！！！！！！！什么鬼东西！！！谢谢！ - ihor.eth
0

由于您的文件名都叫test.html，而channelUrl也应该是test.html，这样就会创建一个循环引用。正确的channelUrl只需要包含一行即可：

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

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

通道文件解决了某些浏览器中跨域通信的一些问题。channel.html文件的内容可以只有一行：<script src = "//connect.facebook.net/en_US/all.js"></script>。为了让通道文件被尽可能长时间地缓存，非常重要。在提供此文件时，必须发送有效的过期头，并设置长时间的过期时间。这将确保浏览器缓存通道文件，这对于平稳的用户体验非常重要。如果没有适当的缓存，跨域通信将变得非常缓慢，用户将遭受严重的降级体验。在PHP中执行此操作的简单方法是：
 <?php  $cache_expire = 60*60*24*365;  header("Pragma: public");  header("Cache-Control: max-age=".$cache_expire);  header('Expires: ' . gmdate('D, d M Y H:i:s', time()+$cache_expire) . ' GMT');  ?>  <script src="//connect.facebook.net/en_US/all.js"></script>

channelUrl参数是可选的，但建议提供。提供一个频道文件可以帮助解决三个特定已知问题。首先，包含用于跨框架通信的代码的页面可能会导致社交插件显示为空白，而没有channelUrl。其次，如果未提供channelUrl并且页面包括自动播放音频或视频，则用户可能会听到两个音频流，因为页面已在后台加载了第二次以进行跨域通信。第三，频道文件将防止在服务器端日志中包含额外的点击量。如果您未指定channelUrl，则可以从日志中删除包含fb_xd_bust或fb_xd_fragment参数的页面视图，以确保正确计数。
channelUrl必须是完全限定的URL，与您包含SDK的页面匹配。换句话说，如果您的网站使用www进行服务，则频道文件域必须包括www，并且如果您在页面上修改document.domain，则必须在channel.html文件中进行相同的document.domain更改。协议也必须匹配。如果您的页面通过https提供服务，则您的channelUrl也必须是https。记得对于脚本src也使用匹配的协议。上面的示例代码使用协议相对URL，应该可以正确处理大多数https情况。
谢谢，DMCS。我已经删除了可选的channelUrl参数，但这个方法仍然没有触发。你有什么想法吗？ - BeachRunnerFred
尝试移除其中一个结尾的 </script> 标签，因为它是多余的，可能导致您的浏览器不喜欢它。 - DMCS
是的，我修复了那个问题，但它并没有起到帮助作用。 - BeachRunnerFred
你确定你所拥有的仅仅是你发布的那个HTML文件吗？你的浏览器是否关闭了JavaScript？ - DMCS
-3
请更改您的应用程序ID，然后开始工作。
  <script>
  window.fbAsyncInit = function() {
    FB.init({
      appId            : 'your-app-id',
      autoLogAppEvents : true,
      xfbml            : true,
      version          : 'v2.11'
    });
  };

  (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/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接