关于Facebook：仅Firefox：在FB.init()之前调用FB.login()


Firefox Only: FB.login() called before FB.init()

使用Facebook SDK，尝试将用户连接到我的网站时出现以下控制台错误。除Firefox外，"与Facebook连接"按钮在所有其他浏览器中都可以正常使用。

我在innit配置中有一个Channel URL，并且我已经确认在没有Firebug的Firefox安装中会发生此问题。以下是我的代码：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<script type="text/javascript">
  window.fbAsyncInit = function() {
  FB.init({
     appId :  'my_real_app_id',
     channelUrl : 'MYURL.com/channel.php',
     status:  true,
     cookie:  true,
     xfbml :  false
  });
};

(function(d) {
  var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
  if (d.getElementById(id)) { return; }
  js = d.createElement('script'); js.id = id; js.async = true;
  js.src ="//connect.facebook.net/en_US/all.js";
  ref.parentNode.insertBefore(js, ref);
}(document));

$(document).ready(function() {
  $('a#login-fb').click(function(event) {
     event.preventDefault();
     FB.login(function(response) {
        if (response.authResponse) {
           console.log('Welcome! Fetching your information...');
           FB.api('/me', function(response) {
              handleFacebookLogin(response);
           });
        } else {
           console.log('User cancelled login or did not fully authorize');
        }
     }, {scope: 'email, offline_access, user_birthday, publish_stream, publish_actions' });
  });
相关讨论

我通过将#fb-root下面的上面的javascript更改为以下内容来解决此问题：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<script type="text/javascript">
$(document).ready(function() {
  window.fbAsyncInit = function() {
     FB.init({
        appId :  'my_id',
        status:  true,
        cookie:  true,
        xfbml :  false
     });
  };

  (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);
  }());

  //rest of code here

对于浏览器平台，该插件似乎正在使用post prepare插件填充APP_ID。假定这是在项目根目录的config.xml中指定的。我不确定为什么-但这在我的配置中丢失了生成错误的信息。

将此行添加到config.xml，似乎可以解决问题

1
[cc]

注意：该实现似乎基于对几个文件中特殊令牌APP_ID的内联替换(请参见plugins/cordova-plugin-facebook4/scripts/after_prepare.js)。

在我的情况下，它已设置为null(大概是它第一次运行时没有config.xml中的上述条目)。为解决此问题，我重新安装了插件和浏览器平台。

1
2
3
4
$ ionic cordova plugin remove cordova-plugin-facebook4
$ ionic cordova platform remove browser
$ ionic cordova plugin add cordova-plugin-facebook4 --save --variable APP_ID="0123456789" --variable APP_NAME="myApp"
$ ionic cordova platform add browser

我在Rails项目中遇到了类似的问题，这有助于带来

1
2
3
4
5
6
7
    window.fbAsyncInit = function() {
    FB.init({
        appId:my_real_app_id,
        cookie:true,
        status:true,
        xfbml:true
    });

标头之外的内容，并将其放在主体中下方的标记中。