简体   繁体   English

Facebook JavaScript SDK登录

[英]Facebook JavaScript SDK Login

Here's my code. 这是我的代码。 It works perfectly on Facebook's JavaScript SDK test console, but not here : http://www.booktrolley.in/beta/fblogin.php 它在Facebook的JavaScript SDK测试控制台上运行完美,但不在此处: http//www.booktrolley.in/beta/fblogin.php

<html xmlns:fb="http://www.facebook.com/2008/fbml"> 
<head></head> 
<body> 
<div id="fb-root"></div> 
<script src="http://connect.facebook.net/en_US/all.js"></script> 
<script> 
FB.init({
  appId  : '270423476307006',
 status : true, // check login status
 cookie : true, // enable cookies to allow the server to access the session
 xfbml  : true, // parse XFBML
channelUrl : 'http://pedurology.org/booktrolley/beta/channel.html', // channel.html file
oauth  : true // enable OAuth 2.0
});
</script> 

<h1>Login, Logout, Name and Profile Picture</h1> 
<div id="account-info"></div> 

<script> 
/**
 * This assumes the user is logged in and renders their profile picture,
 * name and a logout link.
*/
  function showAccountInfo() {
  FB.api(
 {
   method: 'fql.query',
  query: 'SELECT name,uid,pic_square FROM user WHERE uid='+FB.getSession().uid
 },
 function(response) {
 alert(FB.getSession().uid);
  Log.info('API Callback', response);
  document.getElementById('account-info').innerHTML = (

    '<img src="' + response[0].pic_square + '"> ' +
    response[0].name +
    ' <img onclick="FB.logout()" style="cursor: pointer;"' +
        'src="https://s-static.ak.fbcdn.net/rsrc.php/z2Y31/hash/cxrz4k7j.gif">'
   );
  }
  );
}

/**
 * This assumes the user is logged out, and renders a login button.
 */
 function showLoginButton() {
   document.getElementById('account-info').innerHTML = (
 '<img onclick="FB.login()" style="cursor: pointer;"' +
     'src="https://s-static.ak.fbcdn.net/rsrc.php/zB6N8/hash/4li2k73z.gif">'
  );
}

/**
* This will be called once on page load, and every time the status changes.
*/
function onStatus(response) {
Log.info('onStatus', response);
if (response.session) {
 showAccountInfo();
  } else {
  showLoginButton();
 }
 }
 FB.getLoginStatus(function(response) {
  onStatus(response); // once on page load
 FB.Event.subscribe('auth.statusChange', onStatus); // every status change
 });
 </script> 
  </body> 
 </html> 

I'm getting a "Log is undefined" error in the following code: 我在以下代码中收到“Log is undefined”错误:

function onStatus(response) {
Log.info('onStatus', response);
if (response.session) {
 showAccountInfo();
  } else {
  showLoginButton();
 }
 }
 FB.getLoginStatus(function(response) {
  onStatus(response); // once on page load
 FB.Event.subscribe('auth.statusChange', onStatus); // every status change
 });

you trying to make use of a logger that exists on FB's page, but not on your own? 你试图利用FB页面上存在的记录器,但不是你自己的?

Try this code: 试试这段代码:

<html xmlns:fb="http://www.facebook.com/2008/fbml">
<head></head>
<body>

<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
    FB.init({
        appId: '270423476307006',
        status: true,
        cookie: true,
        xfbml: true,
        oauth: true
    });

    FB.getLoginStatus(function(response) {
        onStatus(response); // once on page load
        FB.Event.subscribe('auth.statusChange', onStatus); // every status change
    });
};
(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>

<h1>Login, Logout, Name and Profile Picture</h1>
<div id="account-info"></div>

<script>
/**
 * This assumes the user is logged in and renders their profile picture,
 * name and a logout link.
 */
function showAccountInfo(resp) {
    if( !resp.userID ) {
        // we shouldn't be here
        return;
    }
    FB.api(
    {
      method: 'fql.query',
      query: 'SELECT name,uid,pic_square FROM user WHERE uid='+resp.userID
    },
    function(response) {
      document.getElementById('account-info').innerHTML = (

        '<img src="' + response[0].pic_square + '"> ' +
        response[0].name +
        ' <img onclick="FB.logout()" style="cursor: pointer;"' +
            'src="https://s-static.ak.fbcdn.net/rsrc.php/z2Y31/hash/cxrz4k7j.gif">'
      );
    }
    );
}

/**
 * This assumes the user is logged out, and renders a login button.
 */
function showLoginButton() {
  document.getElementById('account-info').innerHTML = (
    '<img onclick="FB.login()" style="cursor: pointer;"' +
         'src="https://s-static.ak.fbcdn.net/rsrc.php/zB6N8/hash/4li2k73z.gif">'
  );
}

/**
 * This will be called once on page load, and every time the status changes.
 */
function onStatus(response) {
  if (response.authResponse) {
    showAccountInfo(response.authResponse);
  } else {
    showLoginButton();
  }
}
</script>
</body>

Now let's explain what we've done: 现在让我们来解释一下我们做了什么:

  1. We are using Asynchronous loading to insure that FB.getLoginStatus() will get fired ONLY when the library is successfully loaded 我们正在使用异步加载来确保只有在成功加载库时才会触发FB.getLoginStatus()
  2. Since you are setting oauth to true then you need to change your code to work with the new responses (refer to this post ) (you may need to change your app settings) 由于您将oauth设置为true,因此您需要更改代码以使用新响应(请参阅此帖子 )(您可能需要更改应用程序设置)
  3. Based on #2, the current user ID to use in your showAccountInfo() will be accessible using response.authResponse.userID 基于#2,可以使用response.authResponse.userID访问showAccountInfo()使用的当前用户ID。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM