Преобразователь Base64 DataURL

Чистый Base64
0 символов

Онлайн-инструмент для преобразования Base64 и DataURL в обе стороны с автоопределением MIME и удалением пробелов.

Похожие

Кодирование Base64

Декодирование Base64

Base64 — объединение строк

Base64 в изображение

Изображение в Base64

Очистка Base64

Что такое Base64 DataURL?

DataURL — это схема URI, которая встраивает данные непосредственно в URL, формат: data:[<MIME-тип>];base64,<данные Base64>. Она позволяет встраивать изображения, PDF, шрифты и другие небольшие ресурсы напрямую в HTML, CSS и JavaScript без дополнительных HTTP-запросов.

**Чистый Base64 vs DataURL:** Чистый Base64 — это просто закодированная строка (например, iVBORw0KGgo...); DataURL — это полный URI с префиксом data: и MIME-типом, который можно использовать напрямую как значение src, href, url() и т. д.

**Назначение инструмента:** Взаимное преобразование между «чистой строкой Base64» и «полным DataURL» — как для добавления префикса data: и MIME-типа к имеющемуся Base64, так и для извлечения чистого Base64 из DataURL.

**Типичные применения:** ① встраивание фоновых изображений в CSS; ② встраивание src в HTML <img>; ③ встраивание изображений в Markdown; ④ вставка изображений в редактор форматированного текста; ⑤ отладка схемы data URI.

Варианты использования

  • Добавление префикса data: и MIME-типа к существующему Base64 для получения DataURL, готового к встраиванию в HTML
  • Извлечение чистого Base64 из существующего DataURL для повторной сборки или передачи
  • Проверка полноты полезной нагрузки Base64 при отладке ресурсов data: во фронтенде
  • Автоопределение MIME-типа (PNG/JPEG/PDF и др.) для Base64 из буфера обмена
  • Подготовка data URL для CSS background-image или HTML <img src>
  • Преобразование Base64 изображения в DataURL для вставки в Markdown-редактор форматированного текста

Как использовать

  1. Выберите направление: «Добавить заголовок» (чистый Base64 → DataURL) или «Удалить заголовок» (DataURL → чистый Base64).
  2. Вставьте содержимое в левое поле: в режиме добавления — чистый Base64, в режиме удаления — строку data:...
  3. В режиме добавления можно оставить «Автоопределение» или выбрать конкретный тип в выпадающем списке MIME.
  4. Инструмент преобразует данные в реальном времени, результат отображается справа и доступен для копирования или скачивания в txt.

Функции

  • Двустороннее преобразование: чистый Base64 ↔ DataURL
  • 11 типов MIME: изображения, документы, аудио/видео, текст
  • Автоопределение MIME: по магическим байтам для PNG/JPEG/GIF/WEBP/PDF
  • Удаление пробелов: автоматическая очистка переносов строк и пробелов
  • Преобразование в реальном времени: автоматический пересчёт через 300 мс после ввода
  • Автопереключение направления: при смене ввод и вывод меняются местами
  • Копирование одним кликом: результат сразу копируется в буфер обмена
  • Скачивание в txt: сохранение в файл dataurl-result.txt
  • Адаптивность для ПК и мобильных устройств: разделяемая панель или переключение вкладок
  • Локальная обработка в браузере: содержимое не отправляется на сервер

Best Practices

Сначала используйте автоопределение

если MIME-тип неизвестен, оставьте «Автоопределение» по умолчанию, а при ошибке выбирайте вручную.

Учитывайте ограничение по размеру

DataURL имеет лимит 2–4 МБ в браузере, для больших файлов лучше использовать обычные URL-ссылки, а не встраивание.

Удаление лишних символов

при вставке Base64 часто попадаются переносы строк, инструмент удаляет их автоматически; при повышенных требованиях можно сначала применить «Очистку Base64».

Сравнительная проверка

после преобразования проверьте через «Проверку Base64» или инструменты разработчика в браузере, что DataURL корректно загружается.

Проверка после копирования

после вставки в целевое место проверьте результат декодирования в консоли браузера на соответствие ожиданиям.

Часто задаваемые вопросы

В режиме добавления уже включено автоопределение?

Да. По умолчанию автоопределение включено: инструмент анализирует первые байты Base64 (магические байты) и распознаёт формат PNG, JPEG, GIF, WEBP или PDF. Если нужен другой MIME-тип (например, application/json или video/mp4), можно выбрать его вручную в выпадающем списке.

Что произойдёт, если ввод уже содержит префикс data:?

В режиме добавления, если ввод уже начинается с data:, инструмент вернёт его как есть, не добавляя префикс повторно. В режиме удаления, если ввод не является DataURL, инструмент очистит пробелы и вернёт чистый Base64.

Что если автоопределение не сработает?

Если Base64 не совпадает ни с одним из магических байтов PNG/JPEG/GIF/WEBP/PDF, автоопределение вернётся к application/octet-stream. В таком случае рекомендуется выбрать нужный MIME-тип вручную.

Какие MIME-типы поддерживаются?

image/png, image/jpeg, image/gif, image/webp, image/svg+xml, application/pdf, application/json, text/plain, text/html, audio/mpeg, video/mp4 — всего 11 распространённых типов.

Есть ли в браузере ограничение на размер DataURL?

Да. Большинство браузеров ограничивают общую длину DataURL (примерно от 2 до 4 МБ в зависимости от браузера), при превышении загрузка ресурса завершается ошибкой. Для больших файлов рекомендуется использовать обычные URL-ссылки.

Где можно использовать DataURL?

В HTML <img src>, в CSS url(), для скачивания через <a href>, в JavaScript fetch, в синтаксисе изображений Markdown, во встроенных ресурсах JSON и т. д.

Удаляются ли переносы строк и пробелы в Base64 автоматически?

Да. В режиме добавления переносы строк и пробелы удаляются перед добавлением префикса; в режиме удаления пробелы также удаляются после извлечения из DataURL.

Изменится ли ввод при переключении направления?

При переключении направления инструмент автоматически подставляет текущий результат в качестве нового ввода, что упрощает последовательные операции.

Отправляется ли содержимое на сервер?

Нет. Все преобразования выполняются локально в браузере, входные и выходные данные не покидают ваше устройство.

Глоссарий

DataURL
Схема URI данных, определённая в RFC 2397, формат data:[<mime>];base64,<data>, которую можно напрямую использовать как значение src, href, url() и т. д.
MIME-тип
Идентификатор типа медиа, например image/png, application/pdf. Инструмент поддерживает 11 распространённых MIME-типов с возможностью автоопределения.
Магические байты
Фиксированные байты в начале файла, по которым определяется его тип. Инструмент распознаёт PNG/JPEG/GIF/WEBP/PDF и др. по магическим байтам.
Base64
Способ кодирования двоичных данных при помощи 64 печатных символов. Полезная нагрузка DataURL представляет собой Base64.
Data URI Scheme
Протокол URI data:, определённый в RFC 2397 — формальное название спецификации DataURL.

Authoritative References