वेब क्रिप्टो एपीआई का उपयोग करते हुए जेएस में 2FA के लिए एक बार पासवर्ड उत्पन्न करें

परिचय

दो-कारक प्रमाणीकरण आज हर जगह है। उसके लिए धन्यवाद, एक खाता चोरी करने के लिए, बस एक पासवर्ड पर्याप्त नहीं है। और यद्यपि इसकी उपस्थिति यह गारंटी नहीं देती है कि आपके खाते को इसके चारों ओर जाने के लिए हटाया नहीं जाएगा, एक अधिक जटिल और बहु-स्तरीय हमले की आवश्यकता होगी। जैसा कि आप जानते हैं, इस दुनिया में कुछ जितना अधिक जटिल है, उतनी ही यह काम नहीं करेगा।

मुझे यकीन है कि हर कोई जो इस लेख को पढ़ता है, कम से कम एक बार अपने जीवन में दो-कारक प्रमाणीकरण (इसके बाद 2FA के रूप में संदर्भित, एक दर्दनाक लंबी वाक्यांश) का उपयोग करता है। आज मैं आपको यह पता लगाने के लिए आमंत्रित करता हूं कि यह तकनीक कैसे काम करती है, जो प्रतिदिन अनगिनत खातों की सुरक्षा करती है।

लेकिन शुरुआत के लिए, आप आज हम जो करने जा रहे हैं उसके डेमो पर एक नज़र डाल सकते हैं।

मूल बातें

एक बार के पासवर्ड के बारे में ध्यान देने योग्य पहली बात यह है कि वे दो प्रकार के होते हैं: HOTP और TOTP । अर्थात्, एचएमएसी-आधारित वन टाइम पासवर्ड और समय-आधारित ओटीपी । TOTP HOTP के लिए एक ऐड-ऑन है, तो चलिए पहले एक सरल एल्गोरिथ्म के बारे में बात करते हैं।

HOTP को RFC4226 विनिर्देश द्वारा वर्णित किया गया है। यह छोटा है, केवल 35 पृष्ठ, और इसमें वह सब कुछ है जो आपको चाहिए: एक औपचारिक विवरण, एक उदाहरण कार्यान्वयन और परीक्षण डेटा। आइए बुनियादी अवधारणाओं को देखें।

सबसे पहले, एचएमएसी क्या है? एचएमएसी रूसी में हैश-आधारित संदेश प्रमाणीकरण कोड , या "हैश फ़ंक्शन का उपयोग करके संदेश प्रमाणीकरण कोड" के लिए खड़ा है। मैक एक संदेश भेजने वाले को सत्यापित करने के लिए एक तंत्र है। मैक एल्गोरिथ्म एक मैक टैग उत्पन्न करता है जो केवल प्रेषक और रिसीवर को ज्ञात एक गुप्त कुंजी का उपयोग करता है। संदेश प्राप्त करने के बाद, आप स्वयं मैक टैग उत्पन्न कर सकते हैं और दो टैग की तुलना कर सकते हैं। यदि वे मेल खाते हैं - सब कुछ क्रम में है, तो संचार प्रक्रिया में कोई हस्तक्षेप नहीं था। एक बोनस के रूप में, उसी तरह, आप जांच सकते हैं कि ट्रांसमिशन के दौरान संदेश क्षतिग्रस्त हो गया था या नहीं। बेशक, यह हस्तक्षेप को नुकसान से अलग करने के लिए काम नहीं करेगा, लेकिन सूचना भ्रष्टाचार का तथ्य पर्याप्त है।

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

मैक स्वयं एक विशिष्ट एल्गोरिथ्म नहीं है, लेकिन केवल एक सामान्य शब्द है। एचएमएसी, बदले में, पहले से ही एक ठोस कार्यान्वयन है। विशेष रूप से, एचएमएसी- एक्स , जहां एक्स क्रिप्टोग्राफिक हैश फ़ंक्शन में से एक है। एचएमएसी दो तर्क लेता है: एक गुप्त कुंजी और एक संदेश, उन्हें एक निश्चित तरीके से मिलाता है, चयनित हैश फ़ंक्शन को दो बार लागू करता है, और मैक टैग देता है।

यदि आप वर्तमान में अपने आप को सोच रहे हैं कि यह सब एक बार के पासवर्ड के साथ क्या करना है - चिंता मत करो, हम लगभग मुख्य बिंदु पर पहुंच गए हैं।

विनिर्देशन के अनुसार, HOTP की गणना दो मूल्यों के आधार पर की जाती है:

• K वह गुप्त कुंजी है जिसे क्लाइंट और सर्वर जानते हैं। यह कम से कम 128 बिट लंबा, और अधिमानतः 160 होना चाहिए, और जब आप 2FA कॉन्फ़िगर करते हैं, तो इसे बनाया जाना चाहिए।
• C काउंटर है ।

एक काउंटर ग्राहक और सर्वर के बीच सिंक्रनाइज़ किया गया एक 8-बाइट मान है। जैसे ही आप नए पासवर्ड जनरेट करते हैं, यह अपडेट हो जाता है। HOTP योजना में, जब भी आप एक नया पासवर्ड उत्पन्न करते हैं, तो क्लाइंट-साइड काउंटर बढ़ जाता है। सर्वर की ओर, हर बार पासवर्ड सफलतापूर्वक सत्यापन पास करता है। चूंकि पासवर्ड बनाना संभव है, लेकिन इसका उपयोग नहीं करना, सर्वर काउंटर मान को स्थापित विंडो के अंदर थोड़ा आगे चलाने की अनुमति देता है। हालांकि, अगर आप HOTP स्कीम में पासवर्ड जनरेटर के साथ बहुत अधिक खेलते हैं, तो आपको इसे फिर से सिंक करना होगा।

So. जैसा कि आपने शायद देखा है, HMAC भी दो तर्क देता है। RFC4226 HOTP पीढ़ी के कार्य को निम्नानुसार परिभाषित करता है:

HOTP(K,C) = Truncate(HMAC-SHA-1(K,C)) 

अपेक्षित रूप से, K का उपयोग गुप्त कुंजी के रूप में किया जाता है। काउंटर, बदले में, एक संदेश के रूप में उपयोग किया जाता है। HMAC फ़ंक्शन मैक टैग बनाने के बाद, रहस्यमय Truncate फ़ंक्शन उस वन-टाइम पासवर्ड को बाहर निकालता है जो पहले से ही हमसे परिचित है, जिसे आप अपने जनरेटर एप्लिकेशन या टोकन में देखते हैं।

आइए कोड लिखना शुरू करें और हम जाते ही बाकी चीजों से निपटें।

कार्यान्वयन योजना

वन-टाइम पासवर्ड प्राप्त करने के लिए, हमें इन चरणों का पालन करना होगा।

• K और C मापदंडों से एक HMAC-SHA1 हैश उत्पन्न करें। यह एक 20 बाइट स्ट्रिंग होगा।
• एक विशिष्ट तरीके से इस स्ट्रिंग से 4 बाइट्स खींचें।
• खींचे गए मान को एक संख्या में परिवर्तित करें और इसे 10 ^ n से विभाजित करें, जहां n = एक बार के पासवर्ड में अंकों की संख्या (आमतौर पर n = 6)। और अंत में, इस विभाजन के शेष भाग को लें। यह हमारा पासवर्ड होगा।

यह बहुत मुश्किल ध्वनि नहीं है, है ना? शुरुआत करते हैं हैश जनरेशन से।

HMAC-SHA1 उत्पन्न करें

यह ऊपर सूचीबद्ध चरणों का शायद सबसे आसान है। हम अपने दम पर एल्गोरिथ्म को फिर से बनाने की कोशिश नहीं करेंगे (हमें अपने दम पर क्रिप्टोग्राफी से कुछ को लागू करने की कोशिश करने की आवश्यकता नहीं है)। इसके बजाय, हम वेब क्रिप्टो एपीआई का उपयोग करेंगे। छोटी समस्या यह है कि यह विनिर्देश एपीआई केवल सुरक्षित संदर्भ (HTTPS) के तहत उपलब्ध है। हमारे लिए, यह इस तथ्य से भरा हुआ है कि हम विकास सर्वर पर HTTPS स्थापित किए बिना इसका उपयोग नहीं कर सकते हैं। थोड़ा इतिहास और चर्चा करें कि यह सही निर्णय कैसे हो सकता है ।

सौभाग्य से, फ़ायरफ़ॉक्स में आप एक असुरक्षित संदर्भ में वेब क्रिप्टो का उपयोग कर सकते हैं, और आपको तीसरे पक्ष के पुस्तकालयों में पहिया को सुदृढ़ करना या खींचना नहीं है। इसलिए, एक डेमो विकसित करने के प्रयोजनों के लिए, मैं एफएफ का उपयोग करने का सुझाव देता हूं।

क्रिप्टो एपीआई को window.crypto.subtle में ही परिभाषित किया गया है। क्रिप्टोकरंसी। यदि आप नाम से हैरान हैं, तो मैं विनिर्देश से उद्धृत करता हूं:

एपीआई को SubtleCrypto कहा जाता है इस तथ्य के प्रतिबिंब के रूप में कि कई एल्गोरिदम की विशिष्ट उपयोग आवश्यकताएं हैं। केवल जब ये आवश्यकताएं पूरी होती हैं, तो वे अपने स्थायित्व को बनाए रखते हैं।

आइए हम उन तरीकों पर जाएं जिनकी हमें ज़रूरत है। नोट: यहाँ बताई गई सभी विधियाँ एसिंक्रोनस हैं और Promise ।

सबसे पहले, हमें importKey विधि की आवश्यकता है, क्योंकि हम अपनी निजी कुंजी का उपयोग करेंगे, और इसे ब्राउज़र में उत्पन्न नहीं करेंगे। importKey 5 तर्क लेता है:

 importKey( format, keyData, algorithm, extractable, usages ); 

हमारे मामले में:

• format 'raw' , अर्थात हम एक ArrayBuffer बाइट सरणी के रूप में कुंजी प्रदान करेंगे।
• keyData एक ही ArrayBuffer है। बहुत जल्द हम इस बारे में बात करेंगे कि इसे कैसे उत्पन्न किया जाए।
• विनिर्देश के अनुसार algorithm , HMAC-SHA1 । यह तर्क HmacImportParams के प्रारूप से मेल खाना चाहिए।
• असत्य के लिए extractable , क्योंकि हमारे पास गुप्त कुंजी को निर्यात करने की कोई योजना नहीं है
• और अंत में, सभी usages हमें केवल 'sign' ।

हमारी गुप्त कुंजी एक लंबी यादृच्छिक स्ट्रिंग होगी। वास्तविक दुनिया में, यह बाइट्स का एक क्रम हो सकता है, जो अप्रत्याशित हो सकता है, हालांकि, सुविधा के लिए, इस लेख में हम एक स्ट्रिंग पर विचार करेंगे। इसे ArrayBuffer बदलने के लिए हम TextEncoder इंटरफ़ेस का उपयोग करेंगे। इसके साथ, कुंजी कोड की दो पंक्तियों में तैयार की जाती है:

 const encoder = new TextEncoder('utf-8'); const secretBytes = encoder.encode(secret); 

अब इसे सब एक साथ रखें:

  const Crypto = window.crypto.subtle; const encoder = new TextEncoder('utf-8'); const secretBytes = encoder.encode(secret); const key = await Crypto.importKey( 'raw', secretBytes, { name: 'HMAC', hash: { name: 'SHA-1' } }, false, ['sign'] ); 

बहुत बढ़िया! क्रिप्टोग्राफी तैयार की गई थी। अब हम काउंटर से निपटेंगे और अंत में संदेश पर हस्ताक्षर करेंगे।

विनिर्देश के अनुसार, हमारा काउंटर 8 बाइट लंबा होना चाहिए। हम इसके साथ फिर से काम करेंगे, जैसे कि ArrayBuffer साथ। इस रूप में अनुवाद करने के लिए, हम उस ट्रिक का उपयोग करेंगे जो आमतौर पर जेएस का उपयोग किसी संख्या के ऊपरी अंकों में शून्य को बचाने के लिए किया जाता है। उसके बाद, हम प्रत्येक बाइट एक ArrayBuffer में DataView का उपयोग करके ArrayBuffer । ध्यान रखें कि सभी बाइनरी डेटा के लिए विनिर्देशन से प्रारूप बड़ा एंडियन है ।

 function padCounter(counter) { const buffer = new ArrayBuffer(8); const bView = new DataView(buffer); const byteString = '0'.repeat(64); // 8 bytes const bCounter = (byteString + counter.toString(2)).slice(-64); for (let byte = 0; byte < 64; byte += 8) { const byteValue = parseInt(bCounter.slice(byte, byte + 8), 2); bView.setUint8(byte / 8, byteValue); } return buffer; } 

अंत में, कुंजी और काउंटर तैयार करके, आप हैश उत्पन्न कर सकते हैं! ऐसा करने के लिए, हम SubtleCrypto के sign फंक्शन का उपयोग करेंगे।

 const counterArray = padCounter(counter); const HS = await Crypto.sign('HMAC', key, counterArray); 

और इस पर हमने पहला कदम पूरा कर लिया है। आउटपुट में, हमें एचएस नामक थोड़ा रहस्यमय मूल्य मिलता है। और यद्यपि यह एक चर के लिए सबसे अच्छा नाम नहीं है, यह वही है जो (और निम्नलिखित में से कुछ) विनिर्देश में कहा जाता है। हम इन नामों को उसके साथ कोड की तुलना करना आसान बनाने के लिए छोड़ देंगे। आगे क्या है?

चरण 2: 4-बाइट स्ट्रिंग (डायनामिक ट्रंकेशन) उत्पन्न करें
आइए Sbits = DT (HS) // DT, नीचे परिभाषित,
// एक 31-बिट स्ट्रिंग लौटाता है

डीटी डायनेमिक ट्रंकेशन के लिए है। और यहाँ है कि यह कैसे काम करता है:

 function DT(HS) { // First we take the last byte of our generated HS and extract last 4 bits out of it. // This will be our _offset_, a number between 0 and 15. const offset = HS[19] & 0b1111; // Next we take 4 bytes out of the HS, starting at the offset const P = ((HS[offset] & 0x7f) << 24) | (HS[offset + 1] << 16) | (HS[offset + 2] << 8) | HS[offset + 3] // Finally, convert it into a binary string representation const pString = P.toString(2); return pString; } 

ध्यान दें कि हमने बिटवाइज़ और HS के पहले बाइट पर कैसे लागू किया। बाइनरी सिस्टम में 0b01111111 , इसलिए अनिवार्य रूप से हम पहले बिट को छोड़ देते हैं। जेएस में, यह वह जगह है जहां इस अभिव्यक्ति का अर्थ समाप्त होता है, लेकिन अन्य भाषाओं में यह सकारात्मक / नकारात्मक संख्याओं के बीच भ्रम को दूर करने के लिए साइन बिट को काटने के लिए भी प्रदान करेगा और इस नंबर को अहस्ताक्षरित के रूप में प्रस्तुत करेगा।

लगभग किया! यह केवल डीटी से प्राप्त मूल्य को एक संख्या में बदलने और तीसरे चरण के लिए आगे रहता है।

 function truncate(uKey) { const Sbits = DT(uKey); const Snum = parseInt(Sbits, 2); return Snum; } 

तीसरा चरण भी काफी छोटा है। बस इतना करना है कि परिणामी संख्या को 10 ** ( ) से विभाजित करना है, और फिर इस विभाजन के शेष भाग को लेना है। इस प्रकार, हमने इस संख्या से अंतिम एन अंकों को काट दिया। विनिर्देश के अनुसार, हमारा कोड कम से कम छह अंकों के पासवर्ड और संभावित 7 और 8 अंकों वाले लोगों को बाहर निकालने में सक्षम होना चाहिए। सैद्धांतिक रूप से, चूंकि यह 31-बिट संख्या है, इसलिए हम 9 वर्णों को निकाल सकते थे, लेकिन वास्तव में, मैंने व्यक्तिगत रूप से कभी भी 6 से अधिक वर्ण नहीं देखे हैं। आपके बारे में क्या?

अंतिम फ़ंक्शन के लिए कोड, जो सभी पिछले वाले को जोड़ता है, इस मामले में कुछ इस तरह दिखाई देगा:

 async function generateHOTP(secret, counter) { const key = await generateKey(secret, counter); const uKey = new Uint8Array(key); const Snum = truncate(uKey); // Make sure we keep leading zeroes const padded = ('000000' + (Snum % (10 ** 6))).slice(-6); return padded; } 

हुर्रे! लेकिन अब कैसे जांचें कि हमारा कोड सही है?

परीक्षण

कार्यान्वयन का परीक्षण करने के लिए, हम RFC से उदाहरणों का उपयोग करेंगे। परिशिष्ट डी में गुप्त कुंजी "12345678901234567890" लिए परीक्षण मान और 0 से 9 तक काउंटर मान शामिल हैं। ट्रंककेट फ़ंक्शन के गिनाए गए HMAC हैश और मध्यवर्ती परिणाम भी हैं। एल्गोरिथम के सभी चरणों को डीबग करने के लिए बहुत उपयोगी है। यहाँ इस तालिका का एक छोटा सा उदाहरण है (केवल काउंटर और HOTP बाकी हैं):

  Count HOTP 0 755224 1 287082 2 359152 3 969429 ... 

यदि आपने डेमो नहीं देखा है, तो अब समय है। आप इसमें RFC से मान ले सकते हैं। और वापस आ जाओ क्योंकि हम TOTP शुरू कर रहे हैं।

TOTP

इसलिए हम अंत में 2FA के अधिक आधुनिक हिस्से में पहुंच गए। जब आप अपना वन-टाइम पासवर्ड जनरेटर खोलते हैं और एक छोटे टाइमर को देखते हैं कि कितना अधिक कोड मान्य होगा, तो यह टीटीपी है। अंतर क्या है?

समय-आधारित का अर्थ है कि एक स्थिर मूल्य के बजाय, वर्तमान समय का उपयोग काउंटर के रूप में किया जाता है। या, अधिक सटीक रूप से, "अंतराल" (समय कदम)। या वर्तमान अंतराल की संख्या भी। इसकी गणना करने के लिए, हम यूनिक्स समय (1 जनवरी, 1970 यूटीसी पर आधी रात के बाद से मिलीसेकंड की संख्या) लेते हैं और विंडो द्वारा पासवर्ड की वैधता (आमतौर पर 30 सेकंड) विभाजित करते हैं। सर्वर आमतौर पर अपूर्ण घड़ी तुल्यकालन के कारण मामूली विचलन की अनुमति देता है। आमतौर पर 1 अंतराल आगे और पीछे विन्यास पर निर्भर करता है।

जाहिर है, यह HOTP योजना की तुलना में अधिक सुरक्षित है। समयबद्ध योजना में, वैध कोड हर 30 सेकंड में बदल जाता है, भले ही इसका उपयोग न किया गया हो। मूल एल्गोरिथ्म में, एक वैध पासवर्ड सर्वर + सहिष्णुता विंडो पर वर्तमान काउंटर मूल्य द्वारा निर्धारित किया जाता है। यदि आप प्रमाणित नहीं करते हैं, तो पासवर्ड अनिश्चित काल के लिए नहीं बदला जाएगा। आप TOFC के बारे में RFC6238 में अधिक पढ़ सकते हैं।

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

 let stepWindow = 30 * 1000; // 30 seconds in ms let lastTimeStep = 0; const updateTOTPCounter = () => { const timeSinceStep = Date.now() - lastTimeStep * stepWindow; const timeLeft = Math.ceil(stepWindow - timeSinceStep); if (timeLeft > 0) { return requestAnimationFrame(updateTOTPCounter); } timeStep = getTOTPCounter(); lastTimeStep = timeStep; <...update counter and regenerate...> requestAnimationFrame(updateTOTPCounter); } 

फिनिशिंग टच - क्यूआर कोड सपोर्ट

आमतौर पर, जब हम 2FA कॉन्फ़िगर करते हैं, तो हम एक क्यूआर कोड के साथ प्रारंभिक मापदंडों को स्कैन करते हैं। इसमें सभी आवश्यक जानकारी है: चयनित योजना, गुप्त कुंजी, खाता नाम, प्रदाता का नाम, पासवर्ड में अंकों की संख्या।

पिछले लेख में, मैंने इस बारे में बात की कि आप getDisplayMedia API का उपयोग करके QR कोड को सीधे स्क्रीन से कैसे स्कैन कर सकते हैं। उस सामग्री के आधार पर, मैंने एक छोटा पुस्तकालय बनाया, जिसका उपयोग हम अभी करेंगे। लाइब्रेरी को स्ट्रीम-डिस्प्ले कहा जाता है, और इसके अलावा हम अद्भुत jsQR पैकेज का उपयोग करते हैं।

QR- एन्कोडेड लिंक में निम्न प्रारूप है:

 otpauth://TYPE/LABEL?PARAMETERS 

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

 otpauth://totp/label?secret=oyu55d4q5kllrwhy4euqh3ouw7hebnhm5qsflfcqggczoafxu75lsagt&algorithm=SHA1&digits=6&period=30 

मैं उस कोड को छोड़ दूंगा जो स्क्रीन कैप्चर और मान्यता शुरू करने की प्रक्रिया सेट करता है, क्योंकि यह सब प्रलेखन में पाया जा सकता है। इसके बजाय, यहां इस लिंक को पार्स करने का तरीका बताया गया है:

 const setupFromQR = data => { const url = new URL(data); // drop the "//" and get TYPE and LABEL const [scheme, label] = url.pathname.slice(2).split('/'); const params = new URLSearchParams(url.search); const secret = params.get('secret'); let counter; if (scheme === 'hotp') { counter = params.get('counter'); } else { stepWindow = parseInt(params.get('period'), 10) * 1000; counter = getTOTPCounter(); } } 

वास्तविक दुनिया में, गुप्त कुंजी एक आधार होगी- 32 (!) एन्कोडेड स्ट्रिंग, जैसा कि कुछ बाइट्स अप्राप्य हो सकते हैं। लेकिन प्रदर्शन की सादगी के लिए, हम इस बिंदु को छोड़ देते हैं। दुर्भाग्य से, मुझे यह जानकारी नहीं मिली कि आधार -32 या सिर्फ ऐसा प्रारूप क्यों है। जाहिर है, इस URL प्रारूप के लिए कोई आधिकारिक विनिर्देश मौजूद नहीं है, और यह प्रारूप स्वयं Google द्वारा गढ़ा गया था। आप यहाँ उसके बारे में थोड़ा पढ़ सकते हैं ।

परीक्षण QR कोड उत्पन्न करने के लिए, मैं FreeOTP का उपयोग करने की सलाह देता हूं ।

निष्कर्ष

और वह सब है! एक बार फिर, डेमो देखना न भूलें। कोड के साथ रिपॉजिटरी का एक लिंक भी है जो इसके पीछे है।

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

जल्द मिलते हैं!