Обработчик Data URI
Создать или декодировать Base64 data URI для встраивания файлов.
О Data URI Handler
Data URI Handler позволяет кодировать любой файл в Base64 Data URI для прямого встраивания в HTML, CSS или JavaScript, а также декодирует существующие Data URI обратно в их исходное содержимое файла. Data URI соответствуют формату RFC 2397 `data:[<mediatype>][;base64],<data>`, позволяя встраивать ресурсы без дополнительных HTTP-запросов. Встраивание небольших ресурсов, таких как SVG-иконки, шрифты или крошечные изображения, может значительно сократить задержку загрузки страницы для критически важных ресурсов. Все кодирование, декодирование, определение MIME-type и предварительный просмотр файлов происходит полностью в вашем браузере без необходимости загрузки на сервер.
Как использовать
Для кодирования загрузите файл или вставьте необработанный текст и выберите правильный MIME type из выпадающего списка — инструмент сгенерирует полную строку Data URI, соответствующую RFC 2397, готовую для вставки в атрибуты src, href или url(). Для декодирования вставьте существующий Data URI в поле ввода и нажмите «Decode», чтобы извлечь встроенное содержимое, просмотреть изображения или SVG в строке и загрузить исходный файл. Вся обработка происходит на стороне клиента, поэтому ваши файлы никогда не покидают браузер.
Распространённые сценарии использования
- Frontend разработчики, встраивающие небольшие SVG-иконки, спиннеры или изображения пользовательского интерфейса непосредственно в HTML или CSS для устранения дополнительных HTTP-запросов и уменьшения задержки критического пути рендеринга
- Разработчики шаблонов электронной почты, встраивающие пользовательские веб-шрифты и изображения логотипов в виде Base64 Data URI в блоки стилей CSS для обеспечения единообразного рендеринга в клиентах, блокирующих загрузку внешних ресурсов
- Исследователи безопасности, декодирующие подозрительные Data URI, найденные в фишинговых HTML-вложениях или обфусцированных script tags, чтобы раскрыть скрытое содержимое полезной нагрузки
- Веб-разработчики, создающие полностью автономные однофайловые HTML-демонстрации, офлайн-страницы документации или портативные виджеты инструментов, которые встраивают все активы в строку
- Авторы инструментов сборки, которые создают фоновые изображения в виде Data URI в Base64 для styled-компонентов CSS-in-JS или встроенные Data URI с SVG для иконочных шрифтов