JavaScript Base64 JSON के लिए रेसिपी, फ़ाइलें और बाइट सरणियाँ

JSON पेलोड और चयनित फ़ाइलों के लिए UTF-8-सुरक्षित JavaScript व्यंजनों का उपयोग करें, गलती से बाइनरी डेटा को टेक्स्ट के रूप में माने बिना।

उपयोगी Base64 कोड यह तय करने से शुरू होता है कि इनपुट वास्तव में क्या है। JavaScript स्ट्रिंग को वर्ण एन्कोडिंग की आवश्यकता होती है; किसी फ़ाइल में पहले से ही बाइट्स हैं; JSON मान को पहले क्रमांकन की आवश्यकता है। उन चरणों को दृश्यमान रखने से डिबगिंग आसान हो जाती है और आकस्मिक डबल एन्कोडिंग को रोका जा सकता है।

एक छोटे JSON मान को एनकोड करें

मान को ठीक एक बार क्रमबद्ध करें, उस स्ट्रिंग को UTF-8 के रूप में एनकोड करें, फिर बाइट्स को Base64 के रूप में एनकोड करें। इस उदाहरण में उन कार्यान्वयनों को पकड़ने के लिए एक गैर-ASCII फ़ील्ड शामिल है जो केवल अंग्रेजी के साथ काम करते हैं। यह छोटे पेलोड के लिए अभिप्रेत है; अस्थायी बाइट स्ट्रिंग मेमोरी उपयोग को बढ़ाती है।

const value = { message: '你好', count: 3 };
const text = JSON.stringify(value);
let binary = '';
for (const byte of new TextEncoder().encode(text)) {
  binary += String.fromCharCode(byte);
}
const encoded = btoa(binary);
const bytes = Uint8Array.from(atob(encoded), c => c.charCodeAt(0));
const json = new TextDecoder('utf-8', { fatal: true }).decode(bytes);
console.log(JSON.parse(json).message); // 你好

एक सफल Base64 डिकोड वैध JSON की गारंटी नहीं देता है। UTF-8 डिकोड का इलाज करें और JSON.parse अलग-अलग विफलता बिंदुओं के रूप में। जब डिकोड की गई सामग्री पहले से ही JSON युक्त एक स्ट्रिंग है, तो इसे फिर से क्रमबद्ध करने से उद्धरण चिह्न जुड़ जाते हैं और बच जाते हैं; जो पेलोड को बदल देता है।

चयनित फ़ाइल को बाइट्स के रूप में पढ़ें

एक ब्राउज़र के लिए File, उपयोग करें arrayBuffer() जब आपको अंतर्निहित बाइट्स की आवश्यकता हो। प्रयोग न करें file.text() किसी छवि, संग्रह या एन्क्रिप्टेड फ़ाइल के लिए: अमान्य वर्ण अनुक्रम प्रतिस्थापन वर्ण बन सकते हैं। यदि आपके गंतव्य को डेटा URI की आवश्यकता है, FileReader.readAsDataURL() रैपर के साथ-साथ Base64 डेटा भी प्रदान करता है।

// file is a File selected by the user.
const bytes = new Uint8Array(await file.arrayBuffer());
console.log(bytes.byteLength); // original file size in bytes
// Pass bytes to a byte-oriented encoder, not TextEncoder.

राउंडट्रिप जाँचें जो वास्तविक गलतियाँ पकड़ती हैं

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

जब तक आपका वर्कफ़्लो जानबूझकर API को कॉल न करे तब तक रूपांतरण स्थानीय रखें। एन्कोडेड आउटपुट वाला नेटवर्क अनुरोध अभी भी अंतर्निहित डेटा को प्रतिवर्ती रूप में भेजता है। बाइट-स्ट्रिंग व्यवहार और ब्राउज़र फ़ंक्शन की यूनिकोड सीमा के लिए, देखें एमडीएन: btoa().