为什么这个简单的Facebook Javascript SDK代码会失败?

时间:2012-02-07 16:19:16

标签: javascript facebook facebook-authentication

我尝试使用文档中的一些代码,但它一直给我一个错误:An error occurred. Please try again later.我的代码出了什么问题?

相关的JSFiddle:http://jsfiddle.net/AHkXS/

相关HTML:

    <html>
    <head>
      <title>My Facebook Login Page</title>
    </head>
    <body>
      <div id="fb-root"></div>
      <script>
        window.fbAsyncInit = function() {
          FB.init({
            appId      : 'YOUR_APP_ID', //I changed this
            status     : true, 
            cookie     : true,
            xfbml      : true,
            oauth      : true,
          });
        };
        (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));
      </script>
      <div class="fb-login-button" data-scope="email,user_checkins">
        Login with Facebook
      </div>
    </body>
 </html>    

2 个答案:

答案 0 :(得分:2)

我想每当我遇到这个问题时,都是因为我在我的APP ID有效的域之外测试它。

答案 1 :(得分:2)

以下是您的问题的解决方案一步一步:) 因为我猜您的代码无效,因为您没有正确使用javascript

您可以通过4个步骤解决问题

第1步

使用link创建一个新的Facebook应用,并记下其应用ID / API密钥

第2步

使用您在第1步

中记下的应用ID / API密钥

以下代码将使用所有常用选项加载和初始化JavaScript SDK。将 YOUR_APP_ID WWW.YOUR_DOMAIN.COM 替换为适当的值。放置此代码的最佳位置就在打开<body>标记之后。

<div id="fb-root"></div>
<script>
  window.fbAsyncInit = function() {
FB.init({
  appId      : 'YOUR_APP_ID', // App ID
  channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
  status     : true, // check login status
  cookie     : true, // enable cookies to allow the server to access the session
  xfbml      : true  // parse XFBML
  oauth      : true,
});

// Additional initialization code here
  };

  // Load the SDK Asynchronously
  (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));
</script>

第3步

使用以下代码

创建channel.html文件
  <?php
    $cache_expire = 60*60*24*365;
    header("Pragma: public");
    header("Cache-Control: max-age=".$cache_expire);
    header('Expires: ' . gmdate('D, d M Y H:i:s', time()+$cache_expire) . ' GMT');
  ?>
  <script src="//connect.facebook.net/en_US/all.js"></script>

第4步
将XML命名空间添加到文档的<html>标记中。这对于XFBML在早期版本的Internet Explorer中工作是必要的。

<html xmlns:fb="http://ogp.me/ns/fb#">

您可以详细阅读以上所有信息,其中几乎所有信息均来自链接

  1. here you can get javascript, channel file details and other details
  2. 谢谢...