Facebook JavaScript SDK登录

问题描述：

这是我的代码。它完美的Facebook的JavaScript SDK测试控制台上，而不是在这里：http://www.booktrolley.in/beta/fblogin.php Facebook JavaScript SDK登录

<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>

嗨再次:)我仍然认为，从其他的一个它原本指向不同的域调用您的应用程序是问题。尝试在您的应用程序域名“www.booktrolley.in”上创建“pedurology.org”上的相同页面，并查看结果。 – ifaour

@ifaour嗨：D我所有的数据都在pedurology.org上，我的我的应用程序域更改为pedurology.org，正如您所建议的那样，上一个问题已经解决。但不是这一个。感谢您的回复：D – Anant

或者您可以将您的网站，域名网址在您的应用设置中更改为“pedurology.org”并尝试使用。 – ifaour

答

，我在下面的代码得到一个“日志是未定义”错误：

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

你想利用一个存在于FB页面上的记录器，但不是你自己的？

对不起，我不太了解代码。什么是 - 记录器在这里？ – Anant

日志是一些自定义记录器Facebook内置到他们的测试页面。将调试信息写入浏览器的控制台或页面上的一些隐藏的div。无论哪种方式，记录器都没有在您的页面上定义，所以您的脚本在它有机会做任何事情之前就会中断。取出Log.info（'onStatus'，响应）;线路，你应该很好去。 –

它的工作！感谢您的帮助。我真的很感激：D – Anant

答

试试这个代码：

<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>

现在让我们来解释一下我们做了什么：

我们正在使用异步加载，以确保FB.getLoginStatus()将被解雇，只有当库加载成功
由于您将oauth设置为true，因此您需要更改代码以使用新的响应（请参阅此post）（您可能需要更改应用程序设置）
基于＃2，当前用户ID在使用showAccountInfo()将使用可访问response.authResponse.userID

Facebook JavaScript SDK登录

相关推荐