带有JS重定向的HTML 5中的FB登录按钮

时间:2013-02-28 18:58:16

标签: javascript facebook-php-sdk facebook-social-plugins facebook-login

在旧版本的FB登录按钮中,这对我来说效果很好

<fb:login-button scope='email,publish_stream'>Login</fb:login-button>
<div id='fb-root'></div>

 <script type='text/javascript' src='http://connect.facebook.net/en_US/all.js'></script>     
 <script>window.fbAsyncInit = function() {FB.init({
      appId: '<?php echo $facebook->getAppID(); ?>',
      cookie: true,
      xfbml: true,
      oauth: true
   });
   FB.Event.subscribe('auth.login', function(response) {
      window.location = '/fb_redirect.php';
   });
  FB.Event.subscribe('auth.logout', function(response) {
      window.location.reload();
  });
   };
  (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>

但是,我的一位朋友最近建议切换到新的HTML 5登录按钮,如下所示:

  <div id='fb-root'></div>
        <script>
            (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#xfbml=1&appId=APPID';
                fjs.parentNode.insertBefore(js, fjs);
            }(document, 'script', 'facebook-jssdk'));
        </script>

这也很有效。除了我找不到JS触发重定向到/fb_redirect.php的方法。在旧例子中,

FB.Event.subscribe('auth.login', function(response) {
      window.location = '/fb_redirect.php';
   });

工作得很好。但是,我需要将用户重定向到/fb_redirect.php,以便PHP可以启动会话并将一些用户的FB信息插入到数据库中。

2 个答案:

答案 0 :(得分:1)

这是您的默认参数

<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({
  appId      : <?php echo $facebook->getAppID() ?>,
  status     : false,
  cookie     : true,
  xfbml      : true
 });
};

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

这是我的自定义fb_login函数,我的自定义函数fb_login()获取uid和accessToken值并执行其余操作。这次只有在点击登录按钮时才会发生。

function fb_login() {
        FB.login(function(response) {
          if (response.status === 'connected') {
            var uid = response.authResponse.userID; 
            var accessToken = response.authResponse.accessToken;
                if ((parseFloat(uid) == parseInt(uid)) && !isNaN(uid)) {
                  window.location = '/fb_redirect.php';

                  }
     }
        });
      }

</script>

我已经使用onlogin事件扩展了FB登录按钮,当用户点击使用facebook按钮登录并成功登录时,该事件调用JS函数fb_login()。

<div class="fb-login-button" onlogin="fb_login()"></div>

答案 1 :(得分:0)

这是我的一个标志性粗心错误。答案是在这个问题的第一部分。

只是添加

FB.Event.subscribe('auth.login', function(response) {
  window.location = '/fb_redirect.php';

});