2

选中复选框时如何触发 Facebook 登录?

我正在为我的网站实现共享到多个网络的功能。我需要一些帮助来实现 facebook 登录过程。作为代表我的用户分享的先决条件,我需要确保用户已登录 facebook 并允许访问我的应用程序。通常这是使用标准的 facebook 登录过程完成的。

https://developers.facebook.com/docs/javascript/gettingstarted/

我已经实现了这个并且工作正常。如果满足以下条件,我想修改显示facebook登录页面的过程:

A. 用户选中了我的“与 facebook 共享”复选框和 B. 用户未登录或 C. 用户未授权我的应用代表他们发布

这是我的表单的样子:

<form action="post.php" method="post">
  <input type="checkbox" name="facebook"  value="1" onClick="FB.Login();"/>Facebook
  <label for="Message">Message</label>
  <input name="message" type="text"/>
  <input  type="submit" value="post"/>
</form>

这是我的脚本的样子(直接来自 facebook教程):

<script>
    window.fbAsyncInit = function() {
        FB.init({
            appId      : 'MY APP ID',
            channelUrl : 'my channel url',
            status     : true,
            cookie     : true,
            xfbml      : true
        });

        FB.Event.subscribe('auth.authResponseChange', function(response) {
            if (response.status === 'connected') {
                testAPI();
            } else if (response.status === 'not_authorized') {
                FB.login();
            } else {
                FB.login();
            }
        });

    };

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

    function testAPI() {
        console.log('Welcome!  Fetching your information.... ');
        FB.api('/me', function(response) {
            console.log('Good to see you, ' + response.name + '.');
        });
    }
</script>

当检查复选框并且尚未登录用户时,如何修改此JavaScript以弹出Facebook登录名?

我已经尝试过这个建议,但似乎没有用。

编辑

看起来我让这变得比它必须的更复杂。以下解决方案似乎运作良好。希望它可以帮助别人。

<script type="text/javascript">

// Initialize the Facebook JavaScript SDK
FB.init({
  appId: 'APP ID',
  channelUrl : 'channel url',
  xfbml: true,
  status: true,
  cookie: true,
});

</script>

<input type="checkbox" name="facebook" value="1" onclick="FB.login();">
4

2 回答 2

4

这似乎是正确的解决方案:

<div id="fb-root"></div>
<script src="//connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">

// Initialize the Facebook JavaScript SDK
FB.init({
  appId: 'APP ID', // Your app id
  channelUrl : 'channel url', // Your channel url
  xfbml: true,
  status: true,
  cookie: true,
});

function fbAuthUser() {
    FB.login(checkLoginStatus);
}

function checkLoginStatus(response) {
    if(response && response.status == 'connected') {
        document.getElementById("fb").checked = true
    } else {
        document.getElementById("fb").checked = false
    }
}
</script>

<input type="checkbox" name="facebook" value="1" onclick="fbAuthUser();" id="fb">

希望这可以帮助某人。

于 2013-11-05T19:19:49.203 回答
0

你意识到你有一个错误吗?

TypeError: FB.Login is not a function

您可以使用 jQuery:

    $('#checkbox').change(function () {

     if ($(this).is(':checked')) { // only if the checked an not when unchecked!

         FB.login(function (response) {

             if (response.authResponse) {

                 console.log('Welcome!  Fetching your information.... ');
                 FB.api('/me', function (response) {
                     console.log('Good to see you, ' + response.name + '.');
                 });

             } else {

                 alert('User canceled login or did not fully authorize the app.');

             }

         }, {
             scope: '' // we don't need any scopes in demo...
         });

     }
 });

小提琴

于 2013-11-04T19:30:32.473 回答