2

Это, казалось, произошло без каких-либо изменений с моей стороны. Внезапно любой браузер, кроме Chrome, не обрабатывал тег fb: login-button, он просто показывал любой текст в теге как обычный текст.fb: login-button не отображается в Firefox, IE или Opera, но отлично работает в Chrome

После чистки сети в течение нескольких часов, ища возможные причины/решения, я не нашел ничего, что касалось этого конкретного поведения.

Таким образом, я создал самый основной пример, который я мог бы проиллюстрировать эту проблему, и поставить его здесь: http://silverbucket.net/examples/fblogin/welcome.htm

Приведенный выше пример показывает окно фб-входа в Chrome, но не в Firefox, IE или Opera.

В заключение, что на странице в указанной выше ссылке, первый есть HTML-тег в верхней части у меня есть:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" xmlns:fb="http://www.facebook.com/2008/fbml" xmlns:og="http://opengraphprotocol.org/schema/" lang="en"> 

В голове у меня есть:

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

В тело, чуть ниже заголовка у меня есть:

<div id="fb-root"></div> 

Тогда есть фактический фб-Логин-кнопка:

<fb:login-button scope="email, user_interests, user_likes, publish_stream">log in with facebook</fb:login-button> 

И, в нижней части страницы, непосредственно перед закрытием тега тела, у меня есть FB JavaScript:

<script> 
    $(document).ready(function() { 
    window.fbAsyncInit = function() { 
     FB.init({ 
     appId : '153787078069017', 
     cookie : true, // enable cookies to allow the server to access the session 
     xfbml : true, // parse XFBML 
     //channelUrl : '/channel.html', // channel.html file 
     oauth : true, // enable OAuth 2.0 
     status : false 
     }); 

     // whenever the user logs in, we refresh the page 
     FB.Event.subscribe('auth.login', function(response) { 
     if (response.authResponse) { 
      window.location.href="http://example.com/fblogin"; 
     } 
     }); 
    }; 

    (function() { 
     var e = document.createElement('script'); e.async = true; 
     e.src = document.location.protocol + 
     '//connect.facebook.net/en_US/all.js'; 
     document.getElementById('fb-root').appendChild(e); 
    }()); 

    }); 
</script> 

Ничего сложного ... и это не только что происходит на моем Firefox, но каждый коллега, с которым я тоже проверил.

ответ

5

Я предлагаю перемещение window.fbAsyncInit = function() { наружу $(document).ready(function() {. Это должно обеспечить браузер с более последовательными результатами браузера.

+0

Большое спасибо за ваше предложение, это сделал трюк. Интересно, почему он так долго работал, а потом решил сломаться. –

+0

Все зависит от того, как браузер загружает различные ресурсы независимо от того, загружаются они или нет параллельно или параллельно. А также в каком порядке они загружаются. Также следует отметить, какие файлы браузеру не нужно загружать, а скорее извлекать из локального кеша. Лучше всего определить window.fbAsyncInit как можно раньше, чтобы он мог запускаться при окончательной загрузке SDK. :) Счастливое кодирование! – DMCS

+0

А, я вижу. Это странно, потому что есть много примеров и писем от людей, которые говорят, что их не следует инициализировать до тех пор, пока весь документ не будет полностью завершен. –

0

Это выстрел в темноте, но попробуйте добавить свой fb-root div до фактического кода, включая кнопку входа в систему, если это возможно.

Это позволило решить некоторые из причуд fb, с которыми я столкнулся раньше.

+0

Я обновил ссылку на пример с div-корнем fb чуть ниже заголовка страницы. похоже, не имеет никакого эффекта. –

Смежные вопросы