2010-04-26 27 views
21

के साथ पॉपअप प्रमाणीकरण का सरल उदाहरण फेसबुक को जावास्क्रिप्ट पॉपअप के माध्यम से अपने उपयोगकर्ताओं को प्रमाणीकृत करने की कोशिश कर रहा है। अभी, मेरे पास है:फेसबुक ग्राफ एपीआई

<input type="button" value="Connect with Facebook" onclick="window.open('https://graph.facebook.com/oauth/authorize?client_id=XXXXXXXXXXX&redirect_uri=http://example.com/step2&display=popup')" /> 

लेकिन जब उपयोगकर्ता फेसबुक के माध्यम से लॉग इन करता है, तो पॉपअप बस फेसबुक.com मुखपृष्ठ प्रदर्शित करता है। मैं पॉपअप को उपयोगकर्ता को प्रमाणित करने और दूर जाने के लिए चाहता हूं ताकि मैं ग्राफ़ एपीआई से उपयोगकर्ता डेटा पुनर्प्राप्त करना प्रारंभ कर सकूं।

क्या ऐसा करने के लिए एक बेहतर/आसान तरीका है? सरल उदाहरणों की सराहना की जाती है।

धन्यवाद।

उत्तर

27

फेसबुक में oauth2 में दो चरण शामिल हैं, कोड प्राप्त करने के लिए अधिकृत कॉल करें, फिर टोकन प्राप्त करने के लिए access_token पर कॉल करें। पॉप लॉगिन से निपटने का एक तरीका:

नई विंडो में खुले लॉगिन यूआरएल जैसा आपने किया था, जब फेसबुक पॉपअप में आपके यूआरएल पर वापस रीडायरेक्ट करता है, तो आप कुकी को सर्वर साइड कोड के माध्यम से सेट करते हैं या जावास्क्रिप्ट का उपयोग करते हैं यूआरएल क्वेरी पैरामीटर कैप्चर करें, जब पॉपअप में पेज लोड होता है, तो खिड़की को तुरंत बंद करें। बंद करें। अनुकूलित पॉपअप प्रमाणीकरण के लिए Create Facebook PopUp Authentication Window using PHP and javascript:

अपने मुख्य पृष्ठ पर, अपने window.open कोड के बाद, पता लगाने के लिए जावा स्क्रिप्ट कोड जोड़ने पॉपअप बंद कर दिया है और कुकी पर कब्जा:

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); 
} 
+27

के बजाय मूल विंडो में एक टाइमर (जो एक से अधिक आप उम्मीद थी देरी हो सकती है), तो आप जो पॉप अप विंडो में चलेगा पुनर्निर्देश url में एक स्क्रिप्ट का उपयोग कर सकते हैं का उपयोग कर: अगर (opener && ""! = opener.location) { \t opener.handler(); } window.close(); यह खोलने वाली विंडो पर हैंडलर() को कॉल करेगा और पॉपअप को बंद करेगा। हैंडलर केवल तभी बुलाया जाएगा जब अभिभावक विंडो अभी भी खोली गई है और किसी दूसरे डोमेन पर नेविगेट नहीं किया गया है। – Avner

+3

मुझे लगता है कि फ़ंक्शन स्क्रीन केंद्रर गायब है। –

+1

'$ ('# UserInfo') टेक्स्ट ($। कुकी (" some_cookie ");' '$ ('# UserInfo') होना चाहिए। टेक्स्ट ($। कुकी (" some_cookie ")); 'आप गायब हैं समापन ')'। – Gogol

4

चेकआउट इस लेख।

2

चाइल्ड विंडो से कॉलबैक फ़ंक्शन दोनों करना एक अच्छा विचार हो सकता है क्योंकि एवरर के साथ-साथ एक टाइमर जो विंडो को बंद करने के लिए देखता है। इस तरह यदि चाइल्ड विंडो एक विशिष्ट कार्रवाई के बिना बंद हो जाती है तो आप अभिभावक विंडो पर उचित कार्रवाई कर सकते हैं।

**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(); 
     } 
9

क्यों नहीं बस ...

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/

+0

आपका कोड अच्छा है, लेकिन उपयोगकर्ता-टोकन 2 घंटे में समाप्त हो जाएगा –

संबंधित मुद्दे