OAuth 2.0 एक मानक है जो तृतीय-पक्ष एप्लिकेशन को वेब ऐप्स से डेटा को सुरक्षित रूप से एक्सेस करने देता है। आप इसका उपयोग प्रोफ़ाइल जानकारी, शेड्यूल आदि सहित डेटा प्राप्त करने के लिए कर सकते हैं। जिसे Facebook, Google और GitHub जैसे अन्य वेब ऐप्स पर होस्ट किया गया है। कोई सेवा किसी उपयोगकर्ता की ओर से तृतीय-पक्ष एप्लिकेशन को अपनी साख उजागर किए बिना ऐसा कर सकती है।

कुछ चरणों में एक OAuth प्रदाता के रूप में GitHub का उपयोग करके एक एक्सप्रेस ऐप में OAuth को लागू करने का तरीका जानें।

OAuth प्रवाह

एक सामान्य OAuth प्रवाह में, आपकी साइट उपयोगकर्ताओं को GitHub या Facebook जैसे प्रदाता से अपने तृतीय-पक्ष खाते से लॉग इन करने का विकल्प प्रदान करती है। एक उपयोगकर्ता प्रासंगिक OAuth लॉगिन बटन पर क्लिक करके इस प्रक्रिया को शुरू कर सकता है।

यह उन्हें आपके आवेदन से OAuth प्रदाता की वेबसाइट पर पुनर्निर्देशित करता है और उन्हें एक सहमति फ़ॉर्म के साथ प्रस्तुत करता है। सहमति फॉर्म में वह सभी जानकारी होती है जिसे आप उपयोगकर्ता से एक्सेस करना चाहते हैं, जो उनके ईमेल, चित्र, शेड्यूल आदि हो सकती हैं।

यदि उपयोगकर्ता आपके आवेदन को अधिकृत करता है, तो तीसरा पक्ष उन्हें एक कोड के साथ आपके आवेदन पर वापस भेज देगा। आपका एप्लिकेशन तब प्राप्त कोड को एक्सेस टोकन के लिए एक्सचेंज कर सकता है जिसका उपयोग वह उपलब्ध उपयोगकर्ता डेटा तक पहुंचने के लिए कर सकता है।

instagram viewer

एक्सप्रेस एप्लिकेशन में इस प्रवाह को लागू करने में कुछ चरण शामिल हैं।

चरण 1: विकास पर्यावरण की स्थापना

सबसे पहले, एक खाली प्रोजेक्ट डायरेक्टरी बनाएं और सीडी बनाई गई निर्देशिका में।

उदाहरण के लिए:

एमकेडीआईआर जीथब-एपीपी
सीडी जीथब-एप

इसके बाद, अपने प्रोजेक्ट में npm को चलाकर इनिशियलाइज़ करें:

npm init -y

यह आदेश a. बनाता है पैकेज.जेसन फ़ाइल जिसमें आपके प्रोजेक्ट के बारे में विवरण जैसे नाम, संस्करण इत्यादि शामिल हैं।

इस ट्यूटोरियल में ES6 मॉड्यूल सिस्टम के उपयोग की सुविधा होगी। अपना खोलकर इसे सेट करें पैकेज.जेसन फ़ाइल और निर्दिष्ट करना "टाइप करें": "मॉड्यूल" JSON ऑब्जेक्ट में।

चरण 2: निर्भरता स्थापित करना

अपने सर्वर के ठीक से काम करने के लिए आपको कुछ निर्भरताएँ स्थापित करनी होंगी:

  • एक्सप्रेसजेएस: एक्सप्रेसजेएस एक नोडजेएस ढांचा है जो वेब और मोबाइल एप्लिकेशन के लिए सुविधाओं का एक मजबूत सेट प्रदान करता है। एक्सप्रेस का उपयोग करने से आपकी सर्वर निर्माण प्रक्रिया सरल हो जाएगी।
  • Axios: Axios एक वादा-आधारित HTTP क्लाइंट है। GitHub तक पहुंच टोकन के लिए POST अनुरोध करने के लिए आपको इस पैकेज की आवश्यकता होगी।
  • dotenv: dotenv एक पैकेज है जो पर्यावरण चर को .env फ़ाइल से process.env ऑब्जेक्ट में लोड करता है। आपको अपने आवेदन के बारे में महत्वपूर्ण जानकारी छिपाने के लिए इसकी आवश्यकता होगी।

चलाकर उन्हें स्थापित करें:

NPM इंस्टॉल एक्सप्रेस axios dotenv

चरण 3: एक एक्सप्रेस ऐप बनाना

आपको एक बेसिक एक्सप्रेस सर्वर बनाएं OAuth प्रदाता को संभालने और अनुरोध करने के लिए।

सबसे पहले, एक बनाएं index.js अपने प्रोजेक्ट की रूट डायरेक्टरी में फ़ाइल करें जिसमें निम्न शामिल हैं:

// index.js
आयात अभिव्यक्त करना से "अभिव्यक्त करना";
आयात अक्षतंतु से "अक्ष";
आयात * जैसा दोतेनव से "डॉटेनव";
दोतेनव.config();

स्थिरांक ऐप = एक्सप्रेस ();
स्थिरांक पोर्ट = प्रक्रिया.env. पोर्ट || 3000

app.listen (पोर्ट, () => {
सांत्वना देना।लकड़ी का लट्ठा(`ऐप पोर्ट पर चल रहा है ${पोर्ट}`);
});

यह कोड एक्सप्रेस लाइब्रेरी को इंपोर्ट करता है, एक्सप्रेस इंस्टेंस को इंस्टेंट करता है, और पोर्ट पर ट्रैफिक को सुनना शुरू करता है 3000.

चरण 4: रूट हैंडलर बनाना

OAuth प्रवाह को संभालने के लिए आपको दो रूट हैंडलर बनाने होंगे। पहला उपयोगकर्ता को GitHub पर पुनर्निर्देशित करता है और प्राधिकरण का अनुरोध करता है। दूसरा आपके ऐप पर रीडायरेक्ट को वापस संभालता है और जब कोई उपयोगकर्ता आपके एप्लिकेशन को अधिकृत करता है तो एक्सेस टोकन के लिए अनुरोध करता है।

पहले रूट हैंडलर को उपयोगकर्ता को पुनर्निर्देशित करना चाहिए https://github.com/login/oauth/authorize? मापदंडों.

आपको GitHub के OAuth URL के लिए आवश्यक मापदंडों का एक सेट पास करना होगा, जिसमें शामिल हैं:

  • क्लाइंट आईडी: यह उस आईडी को संदर्भित करता है जो आपके OAuth एप्लिकेशन को GitHub पर पंजीकृत होने पर प्राप्त होता है।
  • दायरा: यह एक स्ट्रिंग को संदर्भित करता है जो निर्दिष्ट करता है कि एक OAuth ऐप के पास उपयोगकर्ता की जानकारी तक पहुंच की मात्रा है। आप उपलब्ध कार्यक्षेत्रों की सूची प्राप्त कर सकते हैं GitHub का OAuth दस्तावेज़ीकरण. यहां आप "पढ़ें: उपयोगकर्ता"क्षेत्र, जो उपयोगकर्ता के प्रोफ़ाइल डेटा को पढ़ने की पहुंच प्रदान करता है।

निम्नलिखित कोड को अपने में जोड़ें index.js फ़ाइल:

// index.js
app.get("/auth", (req, res) => {
// किसी ऑब्जेक्ट में पैरामीटर स्टोर करें
स्थिरांक परम = {
दायरा: "पढ़ें: उपयोगकर्ता",
ग्राहक ID: प्रक्रिया.env।ग्राहक ID,
};

// पैरामीटर को URL-एन्कोडेड स्ट्रिंग में बदलें
स्थिरांक urlEncodedParams = नया URLSearchParams (params).toString ();
पुनर्निर्देशन (` https://github.com/login/oauth/authorize?${urlEncodedParams}`);
});

यह कोड पहले रूट हैंडलर को लागू करता है। यह किसी ऑब्जेक्ट में आवश्यक पैरामीटर संग्रहीत करता है, उन्हें URLSearchParams API का उपयोग करके URL-एन्कोडेड प्रारूप में परिवर्तित करता है। इसके बाद यह इन मापदंडों को GitHub के OAuth URL में जोड़ता है और उपयोगकर्ता को GitHub के सहमति पृष्ठ पर पुनर्निर्देशित करता है।

निम्नलिखित कोड को अपने में जोड़ें index.js दूसरे रूट हैंडलर के लिए फ़ाइल:

// index.js
app.get("/github-callback", (req, res) => {
स्थिरांक {कोड} = req.query;

स्थिरांक शरीर = {
ग्राहक ID: प्रक्रिया.env।ग्राहक ID,
ग्राहक_गुप्त: प्रक्रिया.env.CLIENT_SECRET,
कोड,
};

होने देना एक्सेस टोकन;
कॉन्स्ट विकल्प = {हेडर: {स्वीकार करें: "आवेदन/जेसन" } };

अक्षतंतु
।पद("https://github.com/login/oauth/access_token", शरीर, विकल्प)
तब ((प्रतिक्रिया) => response.data.access_token)
तब ((टोकन) => {
एक्सेस टोकन = टोकन;
पुनर्निर्देशन (`/? टोकन =${टोकन}`);
})
.पकड़((गलती) => res.status(500.json ({गलती: err.message}));
});

दूसरा रूट हैंडलर निकालेगा कोड में GitHub से लौटा अनुरोध वस्तु। यह तब एक POST. बनाता है अनुरोध का उपयोग कर एक्सिओस प्रति " https://github.com/login/oauth/access_token" कोड के साथ, ग्राहक ID, तथा ग्राहक_गुप्त.

ग्राहक_गुप्त एक निजी स्ट्रिंग है जिसे आप GitHub OAuth एप्लिकेशन बनाते समय जेनरेट करेंगे। जब एक्सेस टोकन सफलतापूर्वक प्राप्त किया जाता है, इसे बाद में उपयोग के लिए एक चर में सहेजा जाता है। उपयोगकर्ता को अंततः आपके आवेदन पर पुनः निर्देशित किया जाता है एक्सेस टोकन.

चरण 5: GitHub एप्लिकेशन बनाना

इसके बाद, आपको GitHub पर एक OAuth एप्लिकेशन बनाना होगा।

सबसे पहले, अपने GitHub खाते में लॉग इन करें, फिर जाएँ समायोजन, नीचे स्क्रॉल करें डेवलपर सेटिंग्स, और चुनें OAuth ऐप्स. अंत में, "पर क्लिक करेंएक नया आवेदन पंजीकृत करें.”

GitHub आपको इस तरह एक नया OAuth आवेदन पत्र प्रदान करेगा:

अपने वांछित विवरण के साथ आवश्यक फ़ील्ड भरें। "होम पेज यूआरएल" होना चाहिए " http://localhost: 3000”. तुम्हारी "प्राधिकरण कॉलबैक URL" होना चाहिए " http://localhost: 3000 / जीथब-कॉलबैक"। आप वैकल्पिक रूप से डिवाइस प्रवाह को भी सक्षम कर सकते हैं, जिससे आप उपयोगकर्ताओं को हेडलेस ऐप के लिए अधिकृत कर सकते हैं, जैसे एक सीएलआई उपकरण या गिट क्रेडेंशियल मैनेजर।

डिवाइस प्रवाह सार्वजनिक बीटा में है और परिवर्तन के अधीन है।

अंत में, हिट करें पंजीकरण आवेदन बटन।

गिटहब आपको एक पेज पर ले जाएगा जिसमें आपका ग्राहक ID और अपना उत्पन्न करने का विकल्प ग्राहक_गुप्त. अपनी कॉपी करें ग्राहक ID, अपना उत्पन्न करें ग्राहक_गुप्त, और इसे कॉपी भी करें।

एक .env फ़ाइल बनाएँ और स्टोर करें ग्राहक ID तथा ग्राहक_गुप्त इसके अंदर। इन चरों को क्रमशः CLIENT_ID और CLIENT_SECRET नाम दें।

आपका OAuth प्रवाह अब पूरा हो गया है, और अब आप उपयोगकर्ता डेटा को पढ़ने के लिए एक्सेस टोकन के साथ अनुरोध कर सकते हैं दायरा आपने पहले निर्दिष्ट किया था)।

OAuth 2.0 का महत्व

आपके आवेदन में OAuth 2.0 का उपयोग प्रमाणीकरण प्रवाह को लागू करने के कार्य को बहुत सरल करता है। यह आपके ग्राहकों के उपयोगकर्ता डेटा को सिक्योर सॉकेट लेयर (एसएसएल) मानक का उपयोग करके सुरक्षित करता है, यह सुनिश्चित करता है कि वे निजी रहें।