Социальный плагин Facebook Like Box не работает с Turbolinks

Я использую социальный плагин Like Box (https://developers.facebook.com/docs/reference/plugins/like-box/), и он отлично работает.

Проблема в том, что я использую его в приложении Rails 4 с Turbolinks. Всякий раз, когда я перезагружаю страницу, появляется окно лайка. Если я нажму на любую ссылку, загрузится следующая страница, а поле «Нравится» не появится.

Я уже пробовал это, но не сработало =/

http://reed.github.io/turbolinks-compatibility/facebook.html

Любые идеи о том, как решить эту проблему?


turbolinks ruby-on-rails-4 facebook-javascript-sdk facebook-likebox
person renatojf    schedule 05.08.2013    source источник
comment
Я заставил это работать только сегодня. Я могу помочь, если вы можете вставить какой-нибудь JS, который вы используете.   -  person Nerve    schedule 08.08.2013

Ответы (2)


arrow_upward
4
arrow_downward

Ссылка, которую вы разместили в исходном вопросе, довольно хороша. Он просит нас создать три функции:

1) saveFacebookRoot: это необходимо, чтобы div#fb-root можно было восстановить позже. Это называется page:fetch. page:fetch вызывается, пока DoM все еще находится на старой странице. то есть: новая страница не заменила старую страницу

2) restoreFacebookRoot: это необходимо для того, чтобы div#fb-root можно было добавить обратно на страницу. Он называется page:change. page:change вызывается, когда доступен новый DoM.

3) Там небольшая опечатка. Нам нужно вызвать это в page:load

FB.XFBML.parse() // Correct

Вместо :

FB?.XFBML.parse() // InCorrect

Помните, что при первой перезагрузке страницы из этих трех вызывается только page:change.

Хитрость здесь заключается в использовании глобальных переменных fb_root и fb_events_bound. Они должны быть доступны на всех других страницах, но именно поэтому мы в первую очередь ненавидим турбоссылки.

Ссылки: http://reed.github.io/turbolinks-compatibility/facebook.html

person Nerve    schedule 07.08.2013
comment
Я скопировал скрипт в заголовок моего application.html.erb, кроме опечатки (и идентификатора приложения) есть ли что-то еще, что мне нужно сделать? Я все еще могу получить подобную коробку, чтобы показать. - person marimaf; 25.05.2014
comment
То же самое здесь. Вставил в голову, исправил опечатку. Разница только в том, что теперь FB не загружается при перезагрузке. - person JosephK; 15.08.2014
comment
Кажется, это не работает для меня. Требуется ли для этого SDK? Кнопки не должны этого требовать. Интересно, что случилось? - person ahnbizcad; 29.09.2014

arrow_upward
0
arrow_downward

Установите наблюдения:

gem 'observejs'

Затем добавьте тег к виджету:

<div as="FB" class="fb-comments" data-href="<%= request.original_url %>"></div>

Затем создайте новый скрипт в папке javascripts (в моем примере это fb.coffee):

ObserveJS.bind 'FB', class
  root: document.createElement('div')
  @::root.id = 'fb-root'

  loaded: =>
    if !document.body.contains(@root)
      document.body.appendChild(@root)

    if FB?
      FB.XFBML.parse()
    else
      @initialize()

  initialize: =>
    js = document.createElement('script')

    script = document.getElementsByTagName('script')[0]
    js = document.createElement('script')
    js.id = 'facebook-jssdk'
    js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=YOUR_APP_ID&version=VERSION_OF_API"
    script.parentNode.insertBefore(js, script)

Включите файлы js в ваш application.js

//= require observejs
//= require fb
person Sergey Metelin    schedule 18.07.2016