javascript - 身份验证后使用 Javascript SDK 重定向 URI

Question

所以我在我的网站主页上设置了一个基本的登录/身份验证流程。在身份验证对话框之后，我想将它们重定向到我网站上的另一个页面。我已经尝试了现有代码的几种变体，在开发人员应用程序的基本设置下更改站点 url，尝试不同的 oauth 流程，但它仍然只是重定向到他们登录的同一主页。我知道这听起来非常简单，但是有太多不同的身份验证流程和实现，这有点令人困惑。

   <div id="fb-root"></div>
   <script>
   window.fbAsyncInit = function() {
FB.init({
  appId      : 'XXXXXXXXXX', // App ID
  channelURL : '//localhost/dataweavr/channel.php', // Channel File
  status     : true, // check login status
  cookie     : true, // enable cookies to allow the server to access the session
  oauth      : true, // enable OAuth 2.0
  xfbml      : true  // parse XFBML
  });

  // Additional initialization code here
  };

 // Load the SDK Asynchronously
 (function(d){
 var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
 js = d.createElement('script'); js.id = id; js.async = true;
 js.src = "//connect.facebook.net/en_US/all.js";
 d.getElementsByTagName('head')[0].appendChild(js);
 }(document));
 </script>

还有一些更有趣的...

<div id="fb-root"></div>
<div id="user-info"></div>
<button id="fb-auth">Login</button>

<script>
window.fbAsyncInit = function() {
FB.init({ appId: 'XXXXXXXXXXXXXXXXXXXXXX', 
    status: true, 
    cookie: true,
    xfbml: true,
    oauth: true});

function updateButton(response) {
var button = document.getElementById('fb-auth');

if (response.authResponse) {
  //user is already logged in and connected
  var userInfo = document.getElementById('user-info');
  FB.api('/me', function(response) {
    userInfo.innerHTML = '<img src="https://graph.facebook.com/' 
  + response.id + '/picture">' + response.name;
    button.innerHTML = 'Logout';
  });
  button.onclick = function() {
    FB.logout(function(response) {
      var userInfo = document.getElementById('user-info');
      userInfo.innerHTML="";
});
  };
} else {
  //user is not connected to your app or logged out
  button.innerHTML = 'Login';
  button.onclick = function() {
    FB.login(function(response) {
  if (response.authResponse) {
        FB.api('/me', function(response) {
      var userInfo = document.getElementById('user-info');
      userInfo.innerHTML = 
            '<img src="https://graph.facebook.com/' 
        + response.id + '/picture" style="margin-right:5px"/>' 
        + response.name;
    });    
      } else {
        //user cancelled login or did not grant authorization
      }
    }, {scope:'email,user_birthday'});      
  }
}
}

  // run once with current status and whenever the status changes
  FB.getLoginStatus(updateButton);
  FB.Event.subscribe('auth.statusChange', updateButton);    
};

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

还有一个不相关的问题。为什么我只有一个普通的按钮弹出窗口？如何让 SDK 呈现 Facebook 登录按钮，而不仅仅是一个简单的登录按钮？

Answer 1

您应该能够在登录响应后重定向用户。在这些行下:

FB.login(function(response) {
  if (response.authResponse) {

添加这样的东西:

window.top.location = "http://page_to_redirect";

按钮的东西，嗯...好吧，你在 html 中写了一个简单的登录按钮，如果你想要一个登录按钮，改变这个:登录

对此:

<fb:login-button></fb:login-button>

希望对您有所帮助。