Base64 एन्कोडिंग की संपूर्ण जानकारी

"इस इमेज को API के माध्यम से कैसे भेजें?" "इस बाइनरी डेटा को JSON में कैसे डालें?"

उत्तर है Base64।

यह गाइड Base64 के सिद्धांतों से लेकर व्यावहारिक अनुप्रयोगों तक सब कुछ कवर करती है।

---

Base64 क्या है?

Base64 एक एन्कोडिंग विधि है जो बाइनरी डेटा को टेक्स्ट में बदलती है।

इसकी आवश्यकता क्यों है?

विशेषताएं

• 64 कैरेक्टर उपयोग: A-Z, a-z, 0-9, +, / (स्टैंडर्ड)
• आकार वृद्धि: मूल से लगभग 33% अधिक
• रिवर्सिबल: एन्कोडिंग <-> डिकोडिंग पूर्ण रिस्टोरेशन
• एन्क्रिप्शन नहीं है: कोई भी डिकोड कर सकता है

---

Base64 कैसे काम करता है

एन्कोडिंग प्रक्रिया

मूल स्ट्रिंग: "Man"

1. ASCII रूपांतरण
   M = 77 = 01001101
   a = 97 = 01100001
   n = 110 = 01101110

2. 6-बिट चंक्स में विभाजित करें
   010011 | 010110 | 000101 | 101110
      19  |   22   |    5   |   46

3. Base64 कैरेक्टर में बदलें (A=0, B=1, ... Z=25, a=26, ...)
   19 = T
   22 = W
   5  = F
   46 = u

परिणाम: "TWFu"

Base64 कैरेक्टर टेबल

इंडेक्स: कैरेक्टर
0-25:   A-Z
26-51:  a-z
52-61:  0-9
62:     +
63:     /
पैडिंग:   =

पैडिंग (=)

यदि मूल लंबाई 3 से विभाज्य नहीं है, तो पैडिंग जोड़ें

"M"   -> "TQ=="  (2 पैडिंग)
"Ma"  -> "TWE="  (1 पैडिंग)
"Man" -> "TWFu"  (कोई पैडिंग नहीं)

---

भाषा-विशिष्ट कार्यान्वयन

JavaScript (ब्राउज़र)

// एन्कोडिंग
const encoded = btoa('Hello, World!');
console.log(encoded); // "SGVsbG8sIFdvcmxkIQ=="

// डिकोडिंग
const decoded = atob('SGVsbG8sIFdvcmxkIQ==');
console.log(decoded); // "Hello, World!"

// यूनिकोड हैंडलिंग (नॉन-ASCII कैरेक्टर)
function encodeUnicode(str) {
  return btoa(encodeURIComponent(str).replace(
    /%([0-9A-F]{2})/g,
    (_, p1) => String.fromCharCode(parseInt(p1, 16))
  ));
}

function decodeUnicode(str) {
  return decodeURIComponent(
    Array.from(atob(str), c =>
      '%' + c.charCodeAt(0).toString(16).padStart(2, '0')
    ).join('')
  );
}

// यूनिकोड टेस्ट
const text = 'नमस्ते';
const encodedText = encodeUnicode(text);
console.log(encodedText);
console.log(decodeUnicode(encodedText)); // "नमस्ते"

Node.js

// Buffer का उपयोग
const encoded = Buffer.from('Hello, World!').toString('base64');
console.log(encoded); // "SGVsbG8sIFdvcmxkIQ=="

const decoded = Buffer.from('SGVsbG8sIFdvcmxkIQ==', 'base64').toString('utf-8');
console.log(decoded); // "Hello, World!"

// फाइल एन्कोडिंग
const fs = require('fs');

const imageBuffer = fs.readFileSync('image.png');
const base64Image = imageBuffer.toString('base64');
console.log(base64Image.substring(0, 50) + '...');

Python

import base64

# एन्कोडिंग
encoded = base64.b64encode(b'Hello, World!').decode('utf-8')
print(encoded)  # "SGVsbG8sIFdvcmxkIQ=="

# डिकोडिंग
decoded = base64.b64decode('SGVsbG8sIFdvcmxkIQ==').decode('utf-8')
print(decoded)  # "Hello, World!"

# यूनिकोड
text = 'नमस्ते'
encoded_text = base64.b64encode(text.encode('utf-8')).decode('utf-8')
print(encoded_text)

# फाइल एन्कोडिंग
with open('image.png', 'rb') as f:
    base64_image = base64.b64encode(f.read()).decode('utf-8')

Go

package main

import (
    "encoding/base64"
    "fmt"
)

func main() {
    // एन्कोडिंग
    data := "Hello, World!"
    encoded := base64.StdEncoding.EncodeToString([]byte(data))
    fmt.Println(encoded) // "SGVsbG8sIFdvcmxkIQ=="

    // डिकोडिंग
    decoded, _ := base64.StdEncoding.DecodeString(encoded)
    fmt.Println(string(decoded)) // "Hello, World!"

    // URL-safe Base64
    urlSafe := base64.URLEncoding.EncodeToString([]byte(data))
    fmt.Println(urlSafe)
}

---

व्यावहारिक अनुप्रयोग

1. इनलाइन इमेज एम्बेडिंग (Data URL)

<!-- HTML में सीधे इमेज एम्बेड करें -->
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNk+M9QDwADhgGAWjR9awAAAABJRU5ErkJggg==" alt="1x1 red pixel">

// फाइल -> Base64 Data URL
function fileToDataUrl(file) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.onload = () => resolve(reader.result);
    reader.onerror = reject;
    reader.readAsDataURL(file);
  });
}

// उपयोग
const file = document.getElementById('fileInput').files[0];
const dataUrl = await fileToDataUrl(file);
document.getElementById('preview').src = dataUrl;

2. API के माध्यम से इमेज भेजना

// क्लाइंट
async function uploadImage(file) {
  const base64 = await fileToBase64(file);

  const response = await fetch('/api/upload', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({
      filename: file.name,
      contentType: file.type,
      data: base64,
    }),
  });

  return response.json();
}

function fileToBase64(file) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.onload = () => {
      // data:image/png;base64, प्रीफिक्स हटाएं
      const base64 = reader.result.split(',')[1];
      resolve(base64);
    };
    reader.onerror = reject;
    reader.readAsDataURL(file);
  });
}

// सर्वर (Node.js)
app.post('/api/upload', (req, res) => {
  const { filename, contentType, data } = req.body;

  // Base64 -> Buffer -> फाइल सेव करें
  const buffer = Buffer.from(data, 'base64');
  fs.writeFileSync(`uploads/${filename}`, buffer);

  res.json({ success: true, filename });
});

3. JWT टोकन

// JWT = Header.Payload.Signature (प्रत्येक Base64URL एन्कोडेड)

const token = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c';

// Payload डिकोड करें
const payload = token.split('.')[1];
const decoded = JSON.parse(atob(payload));
console.log(decoded);
// { sub: "1234567890", name: "John Doe", iat: 1516239022 }

4. Basic प्रमाणीकरण

// HTTP Basic Authentication
const username = 'user';
const password = 'password';

const credentials = btoa(`${username}:${password}`);

fetch('/api/protected', {
  headers: {
    'Authorization': `Basic ${credentials}`,
  },
});

// हेडर: Authorization: Basic dXNlcjpwYXNzd29yZA==

5. ईमेल अटैचमेंट (MIME)

Content-Type: application/pdf
Content-Transfer-Encoding: base64
Content-Disposition: attachment; filename="document.pdf"

JVBERi0xLjQKMSAwIG9iago8PAovVHlwZSAvQ2F0YWxvZwovUGFnZXMgMiAwIFIK
Pj4KZW5kb2JqCjIgMCBvYmoKPDwKL1R5cGUgL1BhZ2VzCi9LaWRzIFszIDAgUl0K
...

---

Base64 वेरिएंट

URL-safe Base64

// URL-safe एन्कोडिंग
function toUrlSafeBase64(str) {
  return btoa(str)
    .replace(/\+/g, '-')
    .replace(/\//g, '_')
    .replace(/=/g, '');
}

// URL-safe डिकोडिंग
function fromUrlSafeBase64(str) {
  // पैडिंग रिस्टोर करें
  const pad = str.length % 4;
  const padded = pad ? str + '='.repeat(4 - pad) : str;

  return atob(
    padded
      .replace(/-/g, '+')
      .replace(/_/g, '/')
  );
}

Base64 vs Base32 vs Base16

---

सावधानियां

1. एन्क्रिप्शन नहीं है

// सुरक्षा के लिए उपयोग न करें
const password = btoa('mySecretPassword');
// कोई भी atob() से रिस्टोर कर सकता है!

// यदि आवश्यक हो तो पहले एन्क्रिप्ट करें, फिर Base64
const encrypted = await encryptAES(data, key);
const encoded = btoa(encrypted);

2. आकार वृद्धि

// मूल: 1MB इमेज
// Base64: ~1.33MB (33% वृद्धि)

// बड़ी फाइलों के लिए, सीधे अपलोड अधिक कुशल है
// FormData + multipart/form-data का उपयोग करें

3. यूनिकोड हैंडलिंग

// ब्राउज़र btoa() केवल Latin-1 सपोर्ट करता है
btoa('Special chars'); // काम करता है
// नॉन-ASCII को स्पेशल हैंडलिंग चाहिए

// यूनिकोड हैंडलिंग आवश्यक
function encodeUnicode(str) {
  return btoa(unescape(encodeURIComponent(str)));
}

4. लाइन ब्रेक

// कुछ सिस्टम हर 76 कैरेक्टर पर लाइन ब्रेक जोड़ते हैं
// MIME स्टैंडर्ड: 76 कैरेक्टर लाइन ब्रेक

// लाइन ब्रेक हटाएं
const cleaned = base64String.replace(/[\r\n]/g, '');

---

प्रदर्शन अनुकूलन

स्ट्रीमिंग एन्कोडिंग

// बड़ी फाइलों को चंक्स में प्रोसेस करें
async function* encodeFileInChunks(file, chunkSize = 1024 * 1024) {
  const reader = file.stream().getReader();

  while (true) {
    const { done, value } = await reader.read();
    if (done) break;

    // प्रत्येक चंक को Base64 एन्कोड करें
    yield Buffer.from(value).toString('base64');
  }
}

Web Worker उपयोग

// worker.js
self.onmessage = function(e) {
  const { action, data } = e.data;

  if (action === 'encode') {
    const result = btoa(data);
    self.postMessage({ result });
  }
};

// main.js
const worker = new Worker('worker.js');
worker.postMessage({ action: 'encode', data: largeString });
worker.onmessage = (e) => console.log(e.data.result);

---

डिबगिंग टूल्स

Base64 Encoder/Decoder

1. टेक्स्ट या फाइल दर्ज करें
2. एन्कोड/डिकोड बटन क्लिक करें
3. परिणाम कॉपी करें

CLI

# एन्कोडिंग
echo -n "Hello, World!" | base64
# SGVsbG8sIFdvcmxkIQ==

# डिकोडिंग
echo "SGVsbG8sIFdvcmxkIQ==" | base64 -d
# Hello, World!

# फाइल एन्कोडिंग
base64 image.png > image.txt

# फाइल डिकोडिंग
base64 -d image.txt > restored.png

---

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

Q1: Base64 आकार 33% क्यों बढ़ाता है?

A: क्योंकि 3 बाइट्स (24 बिट्स) को 4 कैरेक्टर (4x6=24 बिट्स) के रूप में दर्शाया जाता है।

• 3 बाइट्स -> 4 कैरेक्टर
• वृद्धि: (4-3)/3 = 33%

Q2: पैडिंग (=) क्यों आवश्यक है?

A: डिकोडर को मूल लंबाई जानने के लिए इसकी आवश्यकता होती है। पैडिंग कैरेक्टर की संख्या अंतिम ग्रुप में बाइट्स की संख्या इंगित करती है।

Q3: Base64URL कब उपयोग करना चाहिए?

A: जब URLs या फाइलनाम में उपयोग करना हो। स्टैंडर्ड Base64 के + और / के URLs में विशेष अर्थ होते हैं, इसलिए इन्हें - और _ से बदला जाता है।

Q4: इनलाइन इमेज एम्बेडिंग के फायदे और नुकसान क्या हैं?

A:

• फायदे: कम HTTP अनुरोध, सरलीकृत कैशिंग
• नुकसान: बड़ा HTML आकार, व्यक्तिगत इमेज कैशिंग नहीं
• सुझाव: केवल छोटे आइकन (2KB से कम) के लिए उपयोग करें

Q5: यह कैसे जांचें कि स्ट्रिंग वैध Base64 है?

A: फॉर्मेट वैलिडेशन के लिए regex का उपयोग करें, फिर डिकोड करने का प्रयास करें:

function isBase64(str) {
  const regex = /^[A-Za-z0-9+/]*={0,2}$/;
  if (!regex.test(str)) return false;

  try {
    atob(str);
    return true;
  } catch {
    return false;
  }
}

---

निष्कर्ष

Base64 के मुख्य बिंदु:

1. उद्देश्य: बाइनरी -> टेक्स्ट रूपांतरण
2. आकार: मूल से 33% बड़ा
3. सुरक्षा: एन्क्रिप्शन नहीं (कोई भी डिकोड कर सकता है)
4. वेरिएंट: URL-safe - और _ का उपयोग करता है
5. अनुप्रयोग: Data URL, JWT, Basic Auth, MIME

---

संबंधित उपकरण