Javascript Rails Turbolinks中的Facebook插件页面不'；t载荷

在我的Rails应用程序中，我正在加载Facebook插件页面，但由于turbolinks，它不会加载每个页面（只是有时）。我试过了，但现在再也装不下了。我做了什么

我用以下脚本创建了facebook.coffee：

$ ->
  loadFacebookSDK()
  bindFacebookEvents() unless window.fbEventsBound

bindFacebookEvents = ->
  $(document)
    .on('page:fetch', saveFacebookRoot)
    .on('page:change', restoreFacebookRoot)
    .on('page:load', ->
      FB?.XFBML.parse()
    )
  @fbEventsBound = true

saveFacebookRoot = ->
  if $('#fb-root').length
    @fbRoot = $('#fb-root').detach()

restoreFacebookRoot = ->
  if @fbRoot?
    if $('#fb-root').length
      $('#fb-root').replaceWith @fbRoot
    else
      $('body').append @fbRoot

loadFacebookSDK = ->
  window.fbAsyncInit = initializeFacebookSDK
  $.getScript("//connect.facebook.net/cs_CZ/sdk.js#xfbml=1&version=v2.6")

initializeFacebookSDK = ->
  FB.init
    appId  : 'YOUR_APP_ID'
    status : true
    cookie : true
    xfbml  : true

然后在我的application.js中，我只需要它

鉴于此，我有以下代码：

<div id="fb-root"></div>
<div class="fb-page" data-href="https://www.facebook.com/mypage/" data-tabs="timeline" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/mypage/"><a href="https://www.facebook.com/mypage/">MyPage</a></blockquote></div></div>

---

Facebook插件页面未加载。你不知道为什么吗？我正在查看appId，但插件页面中没有包含它。

这对我很有用。。。Facebook的文档和你链接页面上的脚本之间的某种组合

$ ->
  loadFacebookSDK()
  bindFacebookEvents() unless window.fbEventsBound

bindFacebookEvents = ->
  $(document)
    .on('page:fetch', saveFacebookRoot)
    .on('page:change', restoreFacebookRoot)
    .on('page:load', ->
      FB.XFBML.parse()
    )
  @fbEventsBound = true

saveFacebookRoot = ->
  if $('#fb-root').length
    @fbRoot = $('#fb-root').detach()

restoreFacebookRoot = ->
  if @fbRoot?
    if $('#fb-root').length
      $('#fb-root').replaceWith @fbRoot
    else
      $('body').append @fbRoot

loadFacebookSDK = ->
  ((d, s, id) ->
    js = d.getElementsByTagName(s)[0]
    fjs = d.getElementsByTagName(s)[0]
    return if d.getElementById(id)
    js = d.createElement(s)
    js.id = id
    js.src = "https://connect.facebook.net/es_LA/sdk.js#xfbml=1&version=v2.5"
    fjs.parentNode.insertBefore(js, fjs)
  )(document, 'script', 'facebook-jssdk')

initializeFacebookSDK = ->
  FB.init
    # appId : 'YOUR_APP_ID'
    status : true
    cookie : true
    xfbml : true

---

不同之处在于loadFacebookSDK函数。请注意，正如我在问题中所评论的，$.getScript（）删除了请求中的查询/参数部分。

对于其他发现此问题的人，我找到了以下要点，解决了问题：

---

在turbolink 5中，您只需要将数据turbolink永久添加到容器中

我对该脚本也有同样的问题。到目前为止，我所知道的是，$.getScript（）删除了URL的查询部分，并将其替换为时间戳，这就是为什么我们从Facebook的API中得到一个无效的版本错误。谢谢，它可以工作。但我已经从我的应用程序中删除了TurboLink，因为所有其他JS代码都不能正常工作。

// FacebookSDK
// https://developers.facebook.com/docs/plugins/page-plugin/
(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.8";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk')); // Replace 'facebook-jssdk' with your page id.

// Compatibility with Turbolinks 5
(function($) {
  var fbRoot;

  function saveFacebookRoot() {
    if ($('#fb-root').length) {
      fbRoot = $('#fb-root').detach();
    }
  };

  function restoreFacebookRoot() {
    if (fbRoot != null) {
      if ($('#fb-root').length) {
        $('#fb-root').replaceWith(fbRoot);
      } else {
        $('body').append(fbRoot);
      }
    }

    if (typeof FB !== "undefined" && FB !== null) { // Instance of FacebookSDK
      FB.XFBML.parse();
    }
  };

  document.addEventListener('turbolinks:request-start', saveFacebookRoot)
  document.addEventListener('turbolinks:load', restoreFacebookRoot)
}(jQuery));

<div data-turbolinks-permanent id="fb-root"></div>