提示fb登录而不只是显示登录按钮
[英]Prompt fb login not just show the login button
问题描述
我阅读了许多不同的文章，并看到了一些样本来检查fb登录状态。 我有一个基于这些教育资源的工作页面。
但是我的问题是，是否可以直接进入登录提示，从而使用户不必单击登录按钮即可保存。
目前，我在div中有“登录”按钮，并且已隐藏：
<div id="fblogin">
.......
class="fb-login-button"
onlogin="afterFbLogin()"
data-show-faces="false"
data-width="200"
data-max-rows="1"
data-scope="publish_stream">
........
</div>
当前，FB.Init在页面加载时运行，并检查登录状态并在需要时显示div。 然后，用户单击登录按钮...。然后登录后必须单击共享按钮，我想这是可以的。
但是，我希望流程稍有不同。
在页面加载时，我不希望fb.init显示登录按钮。
当他们单击共享按钮时，然后检查隐藏字段的值。 如果它们是loggid正常发布。 如果没有，直接跳转到登录提示。
所以对于＃1。 我只是将FB.getLoginStatus if / then / else分支更改为not_authorized和unknown，以设置隐藏输入类型的值。
FB.getLoginStatus(function (response) {
if (response.status === 'connected')
{
....code....
}
else if (response.status === 'not_authorized')
{
document.getElementById('FbLoginStatus').value = 'not_authorized';
}
else
{
document.getElementById('FbLoginStatus').value = 'unknown';
}
});
对于＃2。 fb sdk如下加载了登录按钮（当上面的init检测到未登录时），但是如果我对此进行编码（在javascript中找到此元素并执行click），而facebook更改了他们的sdk，则我的代码可能会中断。
<div tabindex="0" class="pluginFaviconButton pluginFaviconButtonEnabled pluginFaviconButtonMedium" id="u_0_0" role="button">
因此，将非常感谢您对步骤1的任何输入以及有关如何使用sdk完成第二步的任何想法。
谢谢
1 个解决方案
解决方案1
0 2013-10-25 13:31:14
我认为最好的方法是简单地使用一个变量，以便在Facebook初始化后立即获取用户的登录状态，并使用该变量来设置一个布尔变量，该变量确定是立即登录还是共享。
因此，让我们一步一步看一下：
登录变量
首先，我们要声明布尔值，这样我们就可以对其进行访问并将其默认设置为false。 您可能需要将其放在头部内的某个位置。
var loggedIn = false;
原始Facebook初始化模板
接下来，让我们看一下基本的Facebook init模板（如果您使用的是其他方法，请告诉我）：
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : 'YOUR_APP_ID', // App ID from the app dashboard
channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel file for x-domain comms
status : true, // Check Facebook Login status
xfbml : true // Look for social plugins on the page
});
// Additional initialization code such as adding Event Listeners goes here
};
// Load the SDK asynchronously
(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/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
添加FB.getLoginStatus（）
在以下行之后：
// Additional initialization code such as adding Event Listeners goes here
我们将要使用以下功能检查用户的登录状态：
// See if the User is logged in
FB.getLoginStatus(function(response) {
if (response.status === 'connected')
{
// Mark the user as logged in
loggedIn = true;
}
});
共享之前先测试登录
我不知道您要在Facebook上共享的代码是什么样子，但让我们假装将其放入名为fbShare()的函数中。 现在，我们可以将tryShare()的onclick函数分配给您的“共享按钮”，并使用以下逻辑定义函数：
function tryShare()
{
if (loggedIn)
{
//User is already logged in and authorized
fbShare();
}
else
{
// Pop open the FB Login dialog
FB.login(function(response) {
if (response.authResponse) {
// Successful login/auth
fbShare();
}
else
{
// Your user didn't want to log in to fb
}
});
}
}
摘要
因此，您的代码最终应该看起来像以下内容：
<head>
...
<script ... >
...
function fbShare()
{
// Your sharing code goes here
}
var loggedIn = false;
function tryShare()
{
// tryShare() function immediately above this..
}
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : 'YOUR_APP_ID', // App ID from the app dashboard
channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel file for x-domain comms
status : true, // Check Facebook Login status
xfbml : true // Look for social plugins on the page
});
// Additional initialization code such as adding Event Listeners goes here
// See if the User is logged in
FB.getLoginStatus(function(response) {
if (response.status === 'connected')
{
// Mark the user as logged in
loggedIn = true;
}
});
};
// Load the SDK asynchronously
(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/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
...
<button onclick="tryShare()">Share on Facebook</button>
除了tryShare()之外，大多数代码都是直接从Facebook JavaScript SDK Reference复制而来。 让我知道这一切是否合理:)
fb：登录按钮未显示，未更改代码
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.