رمزگشای تصویر Base64
تبدیل Data URI های Base64 به تصاویر قابل مشاهده
رمزگشایی تصویر Base64 چیست؟
رمزگشایی تصویر Base64 معکوس رمزنویسی تصویر Base64 است: یک رشته Base64 یا data URI را میگیرد که یک تصویر را نشان میدهد و آن را به داده پیکسل باینری قابل مشاهده تبدیل میکند. وقتی رشتهای مثل data:image/png;base64,iVBORw0KGgo... دریافت میکنید، رمزگشایی پیشوند data URI را حذف میکند، رمزنویسی Base64 تعریف شده در RFC 4648 را برعکس میکند، و بایتهای تصویر اصلی را بازسازی میکند. سپس مرورگر میتواند بایتهای رمزگشایی شده را به عنوان تصویر مرئی ترسیم کند.
URI دادهها (RFC 2397) نوع MIME و محتوای رمزگذاری شده Base64 را در یک رشته واحد بستهبندی میکنند. آنها اغلب در پاسخهای API، کد منبع ایمیل HTML، ابزارهای سبک CSS، و رکوردهای پایگاه داده ظاهر میشوند جایی که تصاویر به جای فایلهای باینری بهعنوان متن ذخیره میشوند. رمزگشایی این رشتهها برای پیشنمایش تصویر، تایید محتوای آن، یا ذخیره آن بهعنوان فایل مستقل ضروری است. از آنجایی که Base64 از 4 کاراکتر ASCII برای نمایش هر 3 بایت از داده باینری استفاده میکند، رشته رمزگذاری شده همیشه حدود 33% بزرگتر از تصویر اصلی است.
این ابزار هم URI دادههای کامل (data:image/png;base64,...) و هم رشتههای Base64 خالص بدون پیشوند data: را تجزیه میکند. برای رشتههای خالص، قالب تصویر با بررسی چند کاراکتر اول Base64 بهطور خودکار تشخیص داده میشود، که با بایتهای جادویی فایل مطابقت دارند — برای مثال، iVBORw0KGgo همیشه یک فایل PNG را نشان میدهد. تصویر رمزگشایی شده مستقیماً در مرورگر ترسیم میشود و میتواند بهعنوان فایل دانلود شود.
یک سناریوی معمول توسعهدهنده کار کردن با API REST است که عکس پروفایل یا تصویر بند کوچک سند را بهعنوان رشته Base64 در قسمت JSON برمیگرداند — برای مثال، {} با تصویر. برای استفاده از تصویر، مقدار فیلد را استخراج میکنید، پیشوند data URI را تا و شامل ویرگول حذف میکنید، سپس کاراکترهای Base64 باقیمانده را از طریق رمزگشای مثل atob() در JavaScript یا base64.b64decode() در Python عبور میدهید تا بایتهای خام بازیابی شوند. چسباندن مقدار کامل در این ابزار تمام این مراحل دستی را نادیده میگیرد و تصویر را فوری ترسیم میکند.
چرا از این رمزگشای تصویر Base64 استفاده کنید؟
این ابزار داده تصویر Base64 را ماجرا بهطور کامل در مرورگر شما به تصویر قابلمشاهده و قابلدانلود تبدیل میکند — بدون آپلود، بدون پردازش سرور، بدون نیاز به حساب.
موارد استفاده رمزگشایی تصویر Base64
ساختار data URI برای تصاویر
data URI قالب تصویر و محتوای رمزگذاری شده را در یک رشته واحد بستهبندی میکند. هر مؤلفه برای رمزگشایی صحیح ضروری است: طرح (data:) نشان میدهد که URL خودکافی است بهجای ارجاع به منبع خارجی؛ نوع MIME (مثل image/png) به رندرر میگوید وقتی بایتهای خام را تفسیر میکند کدام قالب استفاده کند؛ نشانگر ;base64، محتوای رمزگذاری Base64 را از داده URIهایی که برای قالبهای متن ساده از کدگذاری درصد استفاده میکنند متمایز میکند. بار Base64 خود ممکن است با یک یا دو کاراکتر = padding پایان یابد — اینها زمانی مورد نیاز هستند که تعداد بایت ورودی مضربی از سه نباشد، تضمین میکند که طول رمزگذاری شده همیشه مضربی از چهار است. حذف یا قطع هر یک از این مؤلفهها باعث رمزگشایی ناموفق یا تولید تصویر خراب میشود.
| مؤلفه | توضیح |
|---|---|
| data: | URI scheme identifier |
| image/png | MIME type declaring the image format |
| ;base64, | Encoding declaration (always base64 for binary) |
| iVBORw0KGgo... | Base64-encoded pixel data |
تشخیص قالب تصویر از Base64
هنگام عدم وجود پیشوند data: در رشته Base64، قالب تصویر را میتوان با بررسی چند کاراکتر اول شناسایی کرد. این کاراکترها با بایتهای جادویی فایل مطابقت دارند — دنبالههای بایتی ثابت در آغاز هر فایل تصویر که قالب را شناسایی میکند:
| قالب | پیشوند Base64 | امضای Hex | نوع MIME |
|---|---|---|---|
| PNG | iVBORw0KGgo | 89 50 4E 47 | image/png |
| JPEG | /9j/ | FF D8 FF | image/jpeg |
| GIF | R0lGOD | 47 49 46 38 | image/gif |
| WebP | UklGR | 52 49 46 46 | image/webp |
| SVG | PHN2Zy | 3C 73 76 67 (text) | image/svg+xml |
| BMP | Qk | 42 4D | image/bmp |
| ICO | AAABAA | 00 00 01 00 | image/x-icon |
مثالهای کد
نحوه رمزگشایی رشتههای تصویر Base64 به فایلهای تصویری در زبانها و محیطهای محبوب:
// Decode a Base64 data URI to a Blob and create a download link
const dataUri = 'data:image/png;base64,iVBORw0KGgo...'
// Method 1: fetch API (simplest)
const res = await fetch(dataUri)
const blob = await res.blob()
// blob.type → "image/png", blob.size → 2048
// Method 2: manual decode for older environments
const [header, b64] = dataUri.split(',')
const mime = header.match(/:(.*?);/)[1] // → "image/png"
const binary = atob(b64)
const bytes = Uint8Array.from(binary, c => c.charCodeAt(0))
const blob2 = new Blob([bytes], { type: mime })
// Create a download link
const url = URL.createObjectURL(blob)
const a = document.createElement('a')
a.href = url
a.download = 'decoded.png'
a.click()
URL.revokeObjectURL(url)import base64
import re
data_uri = 'data:image/png;base64,iVBORw0KGgo...'
# Parse the data URI
match = re.match(r'data:(image/[\w+.-]+);base64,(.+)', data_uri)
mime_type = match.group(1) # → "image/png"
b64_data = match.group(2)
# Decode and write to file
image_bytes = base64.b64decode(b64_data)
ext = mime_type.split('/')[1].replace('jpeg', 'jpg').replace('svg+xml', 'svg')
with open(f'output.{ext}', 'wb') as f:
f.write(image_bytes)
# → writes output.png (byte-for-byte identical to the original)
# Decode raw Base64 (no data: prefix)
raw_b64 = 'iVBORw0KGgo...'
image_bytes = base64.b64decode(raw_b64)import { writeFileSync } from 'fs'
const dataUri = 'data:image/png;base64,iVBORw0KGgo...'
// Extract MIME type and Base64 payload
const [meta, b64] = dataUri.split(',')
const mime = meta.match(/:(.*?);/)[1] // → "image/png"
// Decode to Buffer and save
const buffer = Buffer.from(b64, 'base64')
writeFileSync('output.png', buffer)
// → output.png (identical to the original file)
// Validate by checking magic bytes
console.log(buffer.subarray(0, 4))
// PNG → <Buffer 89 50 4e 47> (\x89PNG)
// JPEG → <Buffer ff d8 ff e0># Decode a raw Base64 string to an image file (Linux) echo 'iVBORw0KGgo...' | base64 -d > output.png # Decode a raw Base64 string to an image file (macOS) echo 'iVBORw0KGgo...' | base64 -D > output.png # Extract Base64 from a data URI and decode echo 'data:image/png;base64,iVBORw0KGgo...' | \ sed 's/^data:.*base64,//' | base64 -d > output.png # Identify the image format from the decoded file file output.png # → output.png: PNG image data, 64 x 64, 8-bit/color RGBA