Einfaches Beispiel von Popup-Authentifizierung mit Facebook Graph API

Question

Der Versuch, Facebook zu bekommen, um meine Nutzer über ein Javascript Popup zu authentifizieren. Im Moment habe ich:

Aber wenn der Benutzer über Facebook anmeldet, zeigt das Popup nur die Facebook.com Homepage. Ich möchte für das Popup den Benutzer authentifizieren und weggehen, so dass ich beginnen kann, Benutzerdaten aus dem Graph API abzurufen.

Gibt es einen besseren/einfachen Weg, dies zu tun? Einfache Beispiele werden geschätzt.

Vielen Dank.

Answer 1

oauth2 in Facebook sind zwei Schritte erforderlich ist, rufen Sie autorisieren Code zu bekommen, dann rufen access_token Token zu erhalten. Ein Weg, um mit dem Pop-Login umzugehen:

Login-URL in einem neuen Fenster öffnen, genau wie Sie, wenn die Facebook-Weiterleitung zurück zu Ihrer URL im Popup, setzen Sie den Cookie entweder durch serverseitigen Code oder mit Javascript zu Capture Url Query Parameter, wenn die Seite in das Popup geladen wird, schließen Sie das Fenster sofort window.close.

Auf dem Haupt-Seite, nach dem window.open Code, fügen Sie JavaScript-Code zu erkennen, ob Popup geschlossen und erfassen das Cookie:

var signinWin; 
$('#FacebookBtn').click(function() { 
     var pos = screenCenterPos(800, 500); 
     signinWin = window.open("[URL]", "SignIn", "width=780,height=410,toolbar=0,scrollbars=0,status=0,resizable=0,location=0,menuBar=0,left=" + pos.x + ",top=" + pos.y); 
     setTimeout(CheckLoginStatus, 2000); 
     signinWin.focus(); 
     return false; 
    }); 

function CheckLoginStatus() { 
    if (signinWin.closed) { 
     $('#UserInfo').text($.cookie("some_cookie"); 
    } 
    else setTimeout(CheckLoginStatus, 1000); 
} 

Answer 2

Kasse diesen Artikel: Create Facebook PopUp Authentication Window using PHP and javascript für customize Popup-Authentifizierung.

Answer 3

Es könnte eine gute Idee sein, sowohl eine Callback-Funktion aus den Child-Fenstern zu tun, wie Avner sowie ein Timer, sagt die für das Fenster geschlossen wird Uhren. Auf diese Weise können Sie, wenn das untergeordnete Fenster ohne eine bestimmte Aktion geschlossen wird, entsprechende Maßnahmen im übergeordneten Fenster ergreifen.

**On Child** 
// Set oAuthToken from server side when it comes back from authenticating 
// and you have the token on the server side. 
var oAuthToken = ""; 
oAuthToken = "--STRING INSERTED BY SERVER SIDE CODE--"; 
window.opener.pbFromPopup(oAuthToken); 

**On Parent :** 
     function CheckLoginStatus() { 
      if (authWindow.closed) { 
       // Handle error if authentication window is closed 
       // without any action on Allow or Deny 
       alert("window closed");     
       //location.href = "errorPage.aspx?error=authwinclosed; 
      } 
      else setTimeout(CheckLoginStatus, 1000); 
     } 
     function pbFromPopup(token) { 
      // Function called from child window, 
      // token is passed back from child 
      authWindow.close(); 
      // Put token in a hidden form field and submit the form to pass 
      // it back to the server 
      $("#authToken").val(token); 
      $("#form1").submit(); 
     } 

Answer 4

Warum nicht einfach ...

function authorizeAppInPopup() { 
    FB.login(function(response) { 
     if (response.authResponse) { 
      // User authorized app 
     } else { 
      // User cancelled login or did not fully authorize 
     } 
    }, {scope: 'publish_stream'}); 
} 

??? :]

https://developers.facebook.com/docs/reference/javascript/FB.login/