Перенаправление URI с помощью Javascript SDK после аутентификации

#javascript #facebook #authentication #oauth-2.0

#javascript #Facebook #аутентификация #oauth-2.0

Вопрос:

Итак, я настроил базовый поток входа / аутентификации на домашней странице моего сайта. После диалога аутентификации я хочу перенаправить их на другую страницу моего сайта. Я попробовал несколько вариантов существующего кода, изменив 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, а не просто простую кнопку входа в систему?

Ответ №1:

Вы должны иметь возможность перенаправить пользователя после ответа на вход. Под этими строками:

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

Добавьте что-то вроде этого:

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

Проблема с кнопкой, хм… ну, вы пишете простую кнопку входа в html, если вам нужна кнопка входа, измените это:
Вход

Для этого:

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

Надеюсь, это поможет.

Комментарии:

1. 1 но как я могу получить там access_token ? Я имею в виду, что я хочу сделать что-то подобное window.top.location = "http://page_to_redirectamp;access_token=?????;

2. Объект authResponse поставляется с токеном доступа: var accessToken = authResponse.accessToken;