tigtools

تصویر به Base64

یک فایل PNG، JPEG، WebP، GIF، SVG یا ICO را به متن Base64 تبدیل کنید که می‌توانید در HTML، CSS یا JSON جاسازی کنید، یا Base64 را دوباره به تصویر رمزگشایی کنید. فایل هرگز مرورگر شما را ترک نمی‌کند.

در مرورگر شما اجرا می‌شود بدون ثبت‌نام

جهت

یا آن را اینجا رها کنید (تا ۱۰ مگابایت). فایل روی دستگاه شما می‌ماند.

نحوه استفاده

  1. گزینه Image → Base64 را انتخاب کنید و یک فایل تصویری انتخاب کنید، یا برای تبدیل برعکس، Base64 → Image را انتخاب کنید.
  2. خروجی مورد نیاز خود را انتخاب کنید: data URL، Base64 ساده، تگ HTML img، قانون CSS background-image یا Markdown.
  3. نتیجه را کپی کنید و آن را در کد، قالب ایمیل یا JSON خود جای‌گذاری کنید.
  4. برای رمزگشایی، یک data URL یا Base64 ساده را جای‌گذاری کنید؛ تصویر پیش‌نمایش داده می‌شود و قابل دانلود است.

نحوه کار

Base64 داده‌های دودویی را با 64 نویسه قابل چاپ نمایش می‌دهد، بنابراین می‌توان تصویر را مستقیماً داخل قالب‌های متنی نوشت. یک URL داده نوع رسانه را در ابتدا اضافه می‌کند، برای مثال data:image/png;base64 و سپس بایت‌های کدگذاری‌شده می‌آیند. مرورگرها URL داده را هر جایی که URL تصویر مجاز است می‌پذیرند: src تگ img، url() در CSS، یا ارجاع تصویر SVG.

متن کدگذاری‌شده همیشه حدود یک‌سوم بزرگتر از فایل اصلی است (4 نویسه برای هر 3 بایت). درون‌سازی آیکون‌های کوچک و placeholderها می‌تواند یک درخواست شبکه جداگانه را حذف کند، اما داده‌های درون‌سازی‌شده به‌تنهایی قابل کش نیستند و با هر صفحه یا stylesheetای که شامل آن‌هاست دوباره دانلود می‌شوند؛ بنابراین به ندرت برای حجم‌های بالای چند کیلوبایت ارزش دارد. بسیاری از سرویس‌گیرندگان ایمیل تصاویر URL داده را مسدود یا حذف می‌کنند؛ بنابراین قبل از استفاده در خبرنامه‌ها آزمایش کنید.

فایل بایت‌به‌بایت کدگذاری می‌شود: هیچ چیز دوباره فشرده نمی‌شود و فراداده‌های داخل فایل (مانند EXIF) حفظ می‌شوند. هنگام کدگشایی، ابزار یک URL داده کامل، Base64 ساده، Base64 امن برای URL و متنی که همراه با پوشش CSS url(…) کپی شده را می‌پذیرد. نوع تصویر از بایت‌های کدگشایی‌شده تشخیص داده می‌شود نه از روی برچسب.

نمونه‌ها

آیکون کوچک در stylesheet

یک آیکون PNG 600 بایتی به یک رشته Base64 با 800 کاراکتر تبدیل می‌شود. استفاده از خروجی CSS یک قانون background-image به شما می‌دهد که می‌توانید بدون میزبانی فایل جداگانه، آن را در یک کلاس قرار دهید.

تصویر از پاسخ API

یک API یک فیلد JSON مانند "iVBORw0KGgoAAAANSUhEUg…" برمی‌گرداند. آن را در Base64 → Image قرار دهید تا تصویر را ببینید، اندازه آن را بررسی کنید و به صورت PNG دانلود کنید.

لوگوی SVG در HTML

کدگذاری یک SVG یک URL با پیشوند data:image/svg+xml;base64 تولید می‌کند که در تگ img کار می‌کند. برای SVG، کد SVG فشرده‌نشده معمولاً کوتاه‌تر از Base64 است، بنابراین در نظر بگیرید SVG را مستقیماً درج کنید.

پرسش‌های متداول

چرا نسخه Base64 بزرگ‌تر از تصویر من است؟

Base64 از ۴ نویسه متنی برای ذخیره‌سازی ۳ بایت استفاده می‌کند و حدود 33% به حجم اضافه می‌کند، به علاوه کمی برای پیشوند data URL. فشرده‌سازی Gzip یا Brotli روی سرور وب این تفاوت را کاهش می‌دهد اما آن را از بین نمی‌برد.

آیا کدگذاری تصویر را تغییر می‌دهد یا فشرده می‌کند؟

خیر. بایت‌های دقیق فایل کدگذاری می‌شوند، از جمله هرگونه فراداده. برای کوتاه‌تر کردن رشته، ابتدا تصویر را فشرده یا تغییر اندازه دهید.

تفاوت بین data URL و Base64 ساده چیست؟

Base64 ساده فقط بایت‌های کدگذاری‌شده است. یک data URL پیشوندی مانند data:image/jpeg;base64 اضافه می‌کند که به مرورگر می‌گوید فایل از چه نوعی است، بنابراین می‌توان از آن مستقیماً به عنوان منبع تصویر استفاده کرد.

آیا محدودیت اندازه وجود دارد؟

فایل‌های تا 10 مگابایت را می‌توان اینجا کدگذاری کرد. رشته‌های بسیار طولانی می‌توانند فیلدهای متنی و ویرایشگرها را کند کنند، و data URL های به آن اندازه برای وب‌سایت‌ها عملی نیستند.

حریم خصوصی

کدگذاری و رمزگشایی در مرورگر شما انجام می‌شود. تصویر شما و متن Base64 بارگذاری نمی‌شوند، ذخیره نمی‌شوند یا در تجزیه و تحلیل‌ها گنجانده نمی‌شوند.