Вставьте Base64, чтобы получить исходные данные, или превратите в Base64 текст, картинку либо любой файл. Можно вставить целиком data URI вида data:image/png;base64,... — префикс будет распознан и убран за вас. Раскодированные изображения показываются тут же, для двоичных данных появляется кнопка скачивания. Всё выполняется локально в браузере, никакие данные никуда не отправляются.
О кодировании и декодировании Base64
Base64 — это шифрование?
Нет, и это самое важное на всей странице. Base64 —кодирование: произвольные двоичные данные переписываются 64 печатными символами (A-Z a-z 0-9 + /). Ни ключа, ни секрета здесь нет: правила общедоступны, и любой обратит преобразование в один шаг. Base64 решает задачу «канал передаёт только текст, а мне нужно протолкнуть через него картинку», а вовсе не задачу «сделать так, чтобы никто не прочитал». Поэтому пароль, номер документа или ключ от API, пропущенные через Base64 перед записью в базу или в код фронтенда, не защищены ничем. Если вам действительно нужна необратимость, посмотрите SHA-256 онлайн, а для хранения паролей берите медленный хеш вроде bcrypt.
Ссылка вида data:text/html;base64 не открывается — как достать из неё содержимое?
Такие ссылки выглядят как data:text/html;charset=utf-8;base64,PGh0bWw+...и обычно приходят из функции «поделиться» в некоторых почтовых сервисах и на форумах. Не открываются они не потому, что ссылка испорчена: с 2017 года Chromeзапрещает переход по data: ссылке в адресной строке, а следом за ним это сделали Firefox и Edge: возможностью слишком активно пользовались фишеры — поддельная страница входа целиком помещается в одну ссылку, а настоящего домена адресная строка для неё показать не может.
Само содержимое из ссылки никуда не делось. Вставьтессылку целиком(вместе с префиксом data:text/html;charset=utf-8;base64, ) в поле декодирования выше — страница распознает префикс, уберёт его и раскодирует остальное. Если внутри HTML, вы увидите полный исходный код страницы.Одно предупреждение, прежде чем смотреть: если ссылку прислал незнакомец, шанс, что это фишинговая страница, вполне заметный. Раскодировать её и прочитать содержимое можно, а вот вводить логин и пароль в найденную там форму — ни в коем случае.
Зачем на самом деле переводят картинки в Base64
Главным образом радивстраивания: маленький значок пишется прямо в CSS как background-image: url(data:image/png;base64,...) или в HTML как <img src>, и это экономит один HTTP-запрос. Тем же способом картинку помещают в JSON, Markdown или тело письма — туда, куда ничего кроме текста не положишь. Плата — примерно треть лишнего объёма (каждые 3 байта превращаются в 4 символа) и невозможность кэшировать встроенную картинку отдельно: поменяли один байт — сбросился кэш всего CSS-файла. Поэтому приёмгодится только для значков в несколько КБ, а фотографиям и крупным изображениям место за обычным URL. Отметьте выше «Добавить префикс data URI», и вы получите готовую строку, которую можно вставить прямо в код.
Почему в одном Base64 встречаются - и _, а другой заканчивается без =
Это безопасный для URL вариант(RFC 4648 §5). В стандартном алфавите символы + и / имеют особый смысл в адресах и именах файлов и внутри параметра запроса экранируются или обрезаются, поэтому их заменяют на - и _; а завершающие = в адресе мешают ничуть не меньше и обычно просто отбрасываются. Ровно так закодированы три части JWT. При декодировании страница узнаёт обе записи сама, и подменять символы руками не придётся; а чтобы получить такую форму при кодировании, отметьте «Алфавит, безопасный для URL».