ASP.NET MVC 3 अनुप्रयोगों को फेसबुक OAuth एपीआई के साथ एकीकृत करें। भाग 1: प्राधिकरण

आपको फेसबुक के माध्यम से अपनी साइट पर प्राधिकरण की आवश्यकता क्यों है?
वर्तमान में, फेसबुक पर 500 मिलियन से अधिक उपयोगकर्ता हैं। कई साइटें अतिरिक्त पंजीकरण के बिना लॉग इन करने की क्षमता प्रदान करती हैं, जहां आपको अपने बारे में जानकारी के कई क्षेत्रों को भरने की आवश्यकता होती है। यदि आपका फेसबुक पर खाता है, तो आपको इसका उपयोग करके साइट पर लॉग इन करना होगा। यह समय बचाता है, क्योंकि पंजीकरण के लिए अक्सर 5-10 मिनट की आवश्यकता होती है।

यदि आप फेसबुक के माध्यम से प्राधिकरण को लागू करते हैं, तो सबसे अधिक संभावना है कि आप साइट पर अधिक उपयोगकर्ता प्राप्त कर पाएंगे, क्योंकि हर कोई कुछ टिप्पणी लिखने के लिए पंजीकरण चरण से नहीं गुजरना चाहता है।

तो, चलिए शुरू करते हैं ...

एप्लिकेशन बनाने से पहले, आपको अपनी साइट को फेसबुक पर रजिस्टर करना होगा
developers.facebook.com/setup
पंजीकरण के बाद, आपको 2 कुंजी प्राप्त होंगी: ऐप आईडी और ऐप सीक्रेट।

अब एक नया ASP.NET MVC 3 एप्लिकेशन बनाएं।


हमें Json के साथ काम करना होगा, इसलिए आप यहां लाइब्रेरी डाउनलोड कर सकते हैं और इसे परियोजना में जोड़ सकते हैं:
using Newtonsoft.Json.Linq;
या NuGet पैकेज मैनेजर का उपयोग करें और " Install-Package Newtonsoft.Json " Install-Package Newtonsoft.Json ।

आरंभ करने के लिए, हमारे पृष्ठ पर जावास्क्रिप्ट एसडीके लोड करें।

Copy Source | Copy HTML

1. $ (दस्तावेज़)। पहले से ही ( फ़ंक्शन ) ({
2. if (document.getElementById ( 'fb-root' )! = अपरिभाषित) {
3. var e = document.createElement ( 'स्क्रिप्ट' );
4. e.type = 'text / javascript' ;
5. e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js' ;
6. e.async = true ;
7. document.getElementById ( 'fb-root' ) .appendChild (e);
8. }
9. });

अगला, हम ऐप आईडी का उपयोग करके अपने पेज को इनिशियलाइज़ करते हैं, जो फेसबुक पर डोमेन रजिस्टर करते समय प्राप्त किया गया था।

Copy Source | Copy HTML

1. FB.init ({
2. appId: 'Your_APP_ID' , कुकी: सच ,
3. स्थिति: सच , xfbml: सच
4. });

हम साइट पृष्ठ पर फेसबुक के माध्यम से लॉगिन बटन प्रदर्शित करते हैं।

Copy Source | Copy HTML

1. < fb: लॉगिन-बटन परमिट = "ईमेल, user_checkins"
2. onlogin = "onConnect ();" autologoutlink = "false">
3. </ fb: लॉगिन-बटन >

xmlns:fb="http://www.facebook.com/2008/fbml" नाम स्थान यहाँ उपयोग किया जाता है xmlns:fb="http://www.facebook.com/2008/fbml" ।
आप यहां एक बटन जनरेट कर सकते हैं ।

Fb- बटन बटन के onlogin घटना को पॉप-अप विंडो में प्राधिकरण की पुष्टि या रद्द करने के बाद उठाया जाता है।



OnConnect () विधि को ऑनलोजेन ईवेंट पर कहा जाता है, जिसमें हम प्राप्त करते हैं
access_token ।

Copy Source | Copy HTML

1. फंक्शन ऑनकनेक्ट () {
2. FB.getLoginStatus ( फ़ंक्शन (प्रतिक्रिया) {
3. अगर (प्रतिक्रिया। सत्र) {
4. window.location = "../Account/FbLogin?token=" + response.session.access_token;
5. } {
6. // यदि उपयोगकर्ता रद्द करता है
7. }
8. });
9. };

उपयोगकर्ता जानकारी प्राप्त करने के लिए इस कुंजी का उपयोग किया जा सकता है। अकाउंटकंट्रोलर की FbLogin () विधि को कहा जाता है, जो उपयोगकर्ता की जानकारी प्राप्त करता है:

Copy Source | Copy HTML

1. सार्वजनिक लड़ाई। FbLogin ( स्ट्रिंग टोकन)
2. {
3. WebClient ग्राहक = नया WebClient ();
4. string JsonResult = client.DownloadString ( स्ट्रिंग .Concat ( "https://graph.facebook.com/me?access_token=" , टोकन));
5. जोबजेक्ट jsonUserInfo = JObject.Parse (JsonResult);
6. UInt64 facebook_userID = jsonUserInfo.Value < UInt64 > ( "आईडी" );
7. string username = jsonUserInfo.Value < string > ( "उपयोगकर्ता नाम" );
8. string email = jsonUserInfo.Value < string > ( "email" );
9. // इस जानकारी को बचा सकता है
10. FormAuthentication.SetAuthCookie (उपयोगकर्ता नाम, सत्य );
11. RedirectToAction ( "इंडेक्स" , "होम" ) लौटाएं ;
12. }

उपयोगकर्ता से क्या जानकारी प्राप्त की जा सकती है, यहां पाया जा सकता है ।

सभी कोड _LogOnPartial.cshtml :

Copy Source | Copy HTML

1. @if (Request.IsAuthenticated)
2. {
3. < text > स्वागत < strong > @ User.Identity.Name </ strong > ! [@ Html.ActionLink ("लॉग ऑफ़", "लॉगऑफ़", "खाता")] </ पाठ >
4. }
5. अन्यथा
6. {
7. < fb: लॉगिन-बटन परमिट = "ईमेल, user_checkins" onlogin = "onConnect ();" autologoutlink = "false"> </ fb: लॉगिन-बटन >
8. < div id = "fb-script" st yle = "डिस्प्ले: इनलाइन; मार्जिन-लेफ्ट: 20px;">
9. </ div >
10. @: [@ Html.ActionLink ("लॉग ऑन", "लॉगऑन", "खाता")]
11. }
12. < स्क्रिप्ट भाषा = "जावास्क्रिप्ट" प्रकार = "पाठ / जावास्क्रिप्ट" >
13. window.fbAsyncInit = function () {
14. FB.init ({appId: .in 177572352298948 ’ , स्थिति: सच्ची , कुकी: झूठी , xfbml: true });
15. };
16. समारोह के बाद कनेक्ट () {
17. FB.getLoginStatus ( फ़ंक्शन (प्रतिक्रिया) {
18. अगर (प्रतिक्रिया। सत्र) {
19. window.location = "../Account/FbLogin?token=" + response.session.access_token;
20. } {
21. // यदि उपयोगकर्ता रद्द करता है
22. }
23. });
24. };
25. $ (दस्तावेज़)। पहले से ही ( फ़ंक्शन ) ({
26. if (document.getElementById ( 'fb-root' )! = अपरिभाषित) {
27. var e = document.createElement ( 'स्क्रिप्ट' );
28. e.type = 'text / javascript' ;
29. e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js' ;
30. e.async = true ;
31. document.getElementById ( 'fb-root' ) .appendChild (e);
32. }
33. });
34. </ script >

प्राधिकरण से पहले:

प्राधिकरण के बाद: