डेवलपर टूल

उन छोटे कामों के लिए एक ब्राउज़र टूलबॉक्स जो असली काम में खलल डालते हैं

ज़्यादातर कोडिंग समस्याएँ बड़ी और दिलचस्प होती हैं। जो आपको सचमुच धीमा करती हैं, वे नहीं होतीं। आपके सामने एक मिनिफ़ाई की हुई API प्रतिक्रिया है, एक JWT जिसे आप पढ़ नहीं सकते, एक URL जो अपनी क्वेरी स्ट्रिंग बिगाड़ रहा है, और एक regex जो लगभग काम करता है। इनमें से किसी के लिए एक dependency, एक CLI इंस्टॉल, या विज्ञापनों से भरा टैब लायक नहीं। ये तीस सेकंड और एक साफ़ टेक्स्ट बॉक्स के लायक हैं।

इस संग्रह के पीछे का पूरा विचार यही है: मुफ़्त डेवलपर उपकरणों का एक अकेला पन्ना जो तुरंत लोड होता है, पूरी तरह आपके ब्राउज़र में चलता है, और आपसे कभी साइन अप करने को नहीं कहता। JSON फ़ॉर्मेटिंग, Base64, URL एन्कोडिंग, JWT डिकोडिंग, रंग रूपांतरण, regex परीक्षण, टाइमस्टैम्प गणित, और एक HTTP स्टेटस संदर्भ — सब एक जगह रहते हैं। आप गूगल पर सबसे पहले जो दिखे उसमें अपना डेटा चिपकाना बंद कर देते हैं, और यह सोचना बंद कर देते हैं कि वह कोई बेतरतीब साइट उसे लॉग कर रही है या नहीं।

हर टूल सचमुच क्या करता है

JSON फ़ॉर्मेटर एस्केप किए, एक-पंक्ति वाले JSON की एक दीवार लेकर उसे ऐसी चीज़ में बदल देता है जिसे इंसान स्कैन कर सके। मान लीजिए कोई webhook चलता है और आपके लॉग कच्चे body को एक विशाल स्ट्रिंग के रूप में पकड़ते हैं। उसे चिपकाएँ, दो- या चार-स्पेस इंडेंटेशन चुनें, और आपको एक पढ़ने योग्य ट्री मिलता है जिसमें सिंटैक्स एरर भी इंगित होती है, अगर कोई हो। यह फ़ॉर्मेट करते समय ही मान्य करता है, इसलिए कोई छिटका हुआ trailing comma या बिना उद्धरण वाली कुंजी आपके ऐप में तीन परत गहरे चुपचाप विफल होने के बजाय बता दी जाती है।

Base64 एन्कोड/डिकोड वह घोड़ा है जिसे आप बिना सोचे लगातार इस्तेमाल करते हैं। Data URI, Basic Auth हेडर, कॉन्फ़िग फ़ाइलों में ठूँसे बाइनरी blob, किसी टोकन के खंड — सब Base64। किसी हेडर मान को डिकोड करके पुष्टि करें कि क्रेडेंशियल आपकी अपेक्षा के अनुसार भेजे जा रहे हैं, या किसी छोटी छवि को इनलाइन करने के लिए एन्कोड करें। यह UTF-8 को साफ़-सुथरे ढंग से संभालता है, जो उसी पल मायने रखता है जब आपका इनपुट सादा ASCII न हो।

URL एन्कोड/डिकोड टूल उस क्लासिक बग को ठीक करता है जहाँ किसी क्वेरी पैरामीटर में एक स्पेस, एक एम्परसैंड, या एक प्लस चिह्न हो और चुपचाप आपका अनुरोध तोड़ दे। अगर आप हाथ से कोई लिंक बना रहे हैं और मान name=John & Co है, तो आपको वह एम्परसैंड %26 में एस्केप करना होगा वरना सर्वर उसे पैरामीटर विभाजक के रूप में पढ़ेगा। पेस्ट करें, एन्कोड करें, कॉपी करें। डिकोडिंग उल्टी दिशा में काम करती है जब आप प्रतिशत कोड से भरे किसी लॉग किए URL को घूर रहे हों और यह समझने की कोशिश कर रहे हों कि सचमुच क्या अनुरोध हुआ था।

टोकन टूल, और एक ज़रूरी चेतावनी

JWT डिकोडर एक टोकन को उसके तीन डॉट-विभाजित हिस्सों में बाँटता है और आपको हेडर तथा payload को सादे JSON के रूप में दिखाता है। जब आप auth डिबग कर रहे हों, तो यह सोने जैसा है: जाँचें कि किस एल्गोरिदम ने टोकन पर हस्ताक्षर किए, sub पढ़ें, पुष्टि करें कि exp दावा पहले ही नहीं बीता, और ठीक-ठीक देखें कि आपका gateway क्लाइंट को कौन-से scope या role सौंप रहा है।

यहाँ वह हिस्सा है जो लोग भूल जाते हैं। JWT को डिकोड करना उसे सत्यापित करना नहीं है। payload बस Base64url है — टोकन रखने वाला कोई भी उसमें हर दावा पढ़ सकता है, और यह टूल ठीक यही करता है, इससे ज़्यादा कुछ नहीं। यह हस्ताक्षर की जाँच नहीं करता, इसलिए एक डिकोड किया टोकन आपको बताता है कि टोकन क्या कहता है, न कि वह असली है या नहीं। किसी प्राधिकरण निर्णय के लिए डिकोडर के दावों पर कभी भरोसा न करें; यह आपके सर्वर का काम है, हस्ताक्षर कुंजी के साथ। डिकोडर को समझने और डिबग करने के लिए इस्तेमाल करें, कभी मान्य करने के लिए नहीं।

regex टेस्टर सबसे झुँझलाने वाले उपकरण पर पूर्णता लाता है। अपना पैटर्न लिखें, कुछ नमूना टेक्स्ट डालें, और आपके टाइप करते समय मैच लाइव हाइलाइट होते देखें। Capture group सूचीबद्ध होते हैं, ताकि आप पुष्टि कर सकें कि समूह दो सचमुच साल पकड़ रहा है, पूरी तारीख नहीं। यह अपने असल कोडबेस के भीतर किसी पैटर्न को परखने के edit-save-rerun चक्र से बेहतर है, और यह सीखने का एक तेज़ तरीका है कि कोई greedy quantifier आपके इरादे से ज़्यादा क्यों निगल रहा है।

बाकी चीज़ें पूरी करते हुए: HEX↔RGB कन्वर्टर एक #1a2b3c को rgb(26, 43, 60) में और वापस पलट देता है, तब के लिए जब आपके डिज़ाइन टोकन और आपका CSS असहमत हों। Unix टाइमस्टैम्प कन्वर्टर 1718900000 को एक असली तारीख और समय में बदल देता है, जो आप हर बार चाहेंगे जब कोई डेटाबेस epoch सेकंड संग्रहीत करता हो और आपकी आँखें उन्हें पढ़ न पाएँ। और HTTP स्टेटस कोड संदर्भ आपको अंदाज़ा लगाने से बचाता है कि किसी API कॉल के बिगड़ने पर 422 या 409 सही जवाब है या नहीं।

स्थानीय प्रसंस्करण, ताकि आप संवेदनशील चीज़ें चिपका सकें

यह वह हिस्सा है जो प्रोडक्शन डेटा छूने वाले किसी भी व्यक्ति के लिए सबसे ज़्यादा मायने रखता है। यहाँ हर टूल JavaScript में client-side चलता है। आपका इनपुट कभी ब्राउज़र से बाहर नहीं जाता — कोई अपलोड नहीं, सर्वर तक कोई आना-जाना नहीं, लॉग करने को कुछ नहीं। इसका मतलब आप किसी असली access टोकन को चिपकाकर उसके दावे जाँच सकते हैं, किसी क्रेडेंशियल वाले Base64 हेडर को डिकोड कर सकते हैं, या ग्राहक डेटा से भरी किसी API प्रतिक्रिया को बिना उसके नेटवर्क पार किए फ़ॉर्मेट कर सकते हैं। सबूत चाहिए? अपने dev tools खोलें, network टैब देखें, और चिपकाते जाएँ। आपको कुछ बाहर जाता नहीं दिखेगा। संवेदनशील payload के लिए, एक केवल-स्थानीय टूल कोई बोनस नहीं; यह एकमात्र ज़िम्मेदार विकल्प है।

अक्सर पूछे जाने वाले सवाल