Facebook Javascript SDK проблема: "FB не определен"
следующий код, скопированный из документации Facebook здесь, не работает для меня в Chrome.
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId : 'YOUR APP ID',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
</script>
в консоли Javascript я получаю:
Uncaught ReferenceError: FB is not defined
у меня нет проблем с SDK в Firefox или Safari, просто Chrome.
19 ответов
Я видел случай, когда Chrome установил WidgetBlock, который блокировал скрипт Facebook. Результатом было именно это сообщение об ошибке. Убедитесь, что вы отключили все расширения, которые могут помешать.
таким образом, проблема заключается в том, что вы не ждете завершения инициализации. Это приведет к случайным результатам. Вот что я использую.
window.fbAsyncInit = function () {
FB.init({ appId: 'your-app-id', cookie: true, xfbml: true, oauth: true });
// *** here is my code ***
if (typeof facebookInit == 'function') {
facebookInit();
}
};
(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));
Это гарантирует, что как только все будет загружено, функция facebookInit будет доступна и выполнена. Таким образом, вам не нужно дублировать код инициализации каждый раз, когда вы хотите его использовать.
function facebookInit() {
// do what you would like here
}
эта ошибка также появится, если вы опустите точку с запятой после определения fbAsyncInit.
window.fbAsyncInit = function() {
FB.init({
appId: 'YOUR APP ID',
status: true,
cookie: true,
xfbml: true
});
//do stuff
}; //<-- semicolon required!
без точки с запятой ситуация такая же, как в этом более коротком примере:
var x = function () {
console.log('This is never called. Or is it?');
}
('bar');
функция вызывается, потому что без точки с запятой часть ('bar') рассматривается как вызов только что определенной функции.
Я тоже столкнулся с этой проблемой, и то, что она решила, не имеет ничего общего с Facebook, но предыдущий скрипт, который я включил, был в плохом состоянии
<script type="text/javascript" src="js/my_script.js" />
Я изменил его на
<script type="text/javascript" src="js/my_script.js"></script>
и это работает...
Weew... надеюсь, мой опыт может помочь другим застрять в этом, что сделало почти все, но все еще не может заставить его работать...
О Боже... ^^
Попробуйте Асинхронную Загрузку:http://developers.facebook.com/docs/reference/javascript/fb.init/
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR APP ID',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
У меня был очень грязный код, который загрузил javascript facebook через AJAX, и я должен был убедиться, что файл js был полностью загружен перед вызовом FB.в этом это, кажется, работает для меня
$jQuery.load( document.location.protocol + '//connect.facebook.net/en_US/all.js',
function (obj) {
FB.init({
appId : 'YOUR APP ID',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
//ANy other FB.related javascript here
});
этот код использует jquery для загрузки javascript и выполнения функции обратного вызова при загрузке javascript. это намного менее беспорядочно, чем создание onload eventlistener для блока, который в конце концов не очень хорошо работал на IE6, 7 и 8
AdBlock блокирует скрипты api facebook JS, потому что это связано с facebook connect, который часто раздражает.
Не уверен, что у вас все еще есть эта проблема, но у меня была та же проблема, оказалось, что у меня было расширение, которое блокировало Facebook со всех сайтов, которые не являются Facebook. Отключил его, работал!
используйте setTimeout, потому что иногда FB.init занимает некоторое время, чтобы получить объявлено
function testAPI() {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Good to see you, ' + response.name + '.');
});
}
function login() {
FB.login(function(response) {
if (response.authResponse) {
testAPI();
} else {
// cancelled
}
});
}
setTimeout(function() {
login();
},2000);
попробуйте загрузить свои скрипты в разделе Head.
Более того, будет лучше, если вы определите свои скрипты под некоторым вызовом, например:document.ready
, Если вы определили эти скрипты в разделе тела
У меня была та же проблема, и единственным решением, которое я нашел, было поместить все, что использовало оператор FB внутри сценария init, я также использовал асинхронную загрузку, поэтому функция обратного вызова после всего, что нужно FB. У меня есть общая страница, dinamycally загруженная php, поэтому многим частям нужны разные функции facebook, контролируемые PHP if, которые делают все немного грязным, но работают!. если я попытаюсь взять любую декларацию FB из сценария загрузки, то firefox покажет " FB не определено" сообщение. Надеюсь, это поможет во всем.
чтобы проверить предложения Mattys о том, что FB не заканчивается, я поместил предупреждение в сценарий. Это вызывает задержку, которую я могу контролировать. Конечно... это был вопрос времени.
$("document").ready(function () {
// Wait...
alert('Click ok to init');
try {
FB.init({
appId: '###', // App ID
status: true, // check login status
cookie: true, // enable cookies to allow the server to access the session
xfbml: true // parse XFBML
});
}
catch (err) {
txt = "There was an error on this page.\n\n";
txt += "Error description: " + err.message + "\n\n";
txt += "Click OK to continue.\n\n";
alert(txt);
}
FB.Event.subscribe('auth.statusChange', OnLogin);
});
У меня была такая же проблема и я нашел причину.
У меня есть avast! антивирус установлен на моем компьютере, и он попросил установить обновление для плагина Chrome. Новый avast! plugin for chrome
имеет функциональность для блокировки рекламы и отслеживания, и, по умолчанию, блокирует доступ к facebook. Я решил свою проблему, просто разрешив facebook в avast! плагин chrome для веб-сайта, который мне нужен.
Так как этот вопрос очень старый, я думаю, что некоторые люди могут иметь то же самое потому что, как я, новый avast! плагин хром.
есть решение для вас :)
вы должны запустить скрипт после загрузки окна
Если вы используете jQuery, вы можете использовать простой способ:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'your-app-id',
xfbml : true,
status : true,
version : 'v2.5'
});
};
(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";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<script>
$(window).load(function() {
var comment_callback = function(response) {
console.log("comment_callback");
console.log(response);
}
FB.Event.subscribe('comment.create', comment_callback);
FB.Event.subscribe('comment.remove', comment_callback);
});
</script>
Facebook предпочитает, чтобы вы загружали свой SDK асинхронно, чтобы он не блокировал любые другие скрипты, которые вам нужны для вашей страницы, но из-за iframe
существует вероятность того, что консоль попытается вызвать метод на объекте FB до того, как объект FB будет полностью создан, даже если FB вызывается только в на <script>
в теге <head>
вашей страницы. Если вы должны загрузить их SDK асинхронно, проверьте, не будет ли создан FB перед вызовом
У меня была аналогичная проблема, и это оказалось Adblocker Pro. Убедитесь, что этот или другие блокирующие расширения отключены. Из-за этого я потерял около 1hr 30 минут. Почувствуйте себя таким нубом;)
Если вы используете JQuery, попробуйте поместить FB withing jQuery call
например
$(document).ready(function(){
FB.Event.subscribe('auth.login', function(){
alert('logged in!');
});
});
это сработало для меня