Base64 простими словами: чому дані стають більшими і як їх декодувати

Base64 записує двійкові дані звичайним текстом, використовуючи 64 символи: від A до Z, від a до z, від 0 до 9, а також + і /. Кожні три байти стають чотирма символами, тож текст приблизно на третину довший за дані, які він містить. Його використовують, коли формат приймає лише текст, наприклад data URL на веб-сторінці, поле JSON або вкладення електронної пошти.

Кодування і декодування Base64Прочитати або створити рядок Base64Безкоштовно

Навіщо текстовим форматам це потрібно

Багато форматів створено лише для тексту. Тіло листа, файл JSON і CSS-файл безпечно містять літери та символи, але сирі зображення чи ZIP-архіви містять значення байтів, які деякі системи можуть змінити, обрізати або сприйняти як керуючі коди. Base64 використовує лише символи, які кожна текстова система передає без змін, тож дані доходять цілими. Його описано в RFC 4648.

Base64 — це кодування, а не секрет. Його може декодувати будь-хто без ключа, тому ніколи не використовуйте його, щоб приховати пароль чи персональні дані.

Як три байти стають чотирма символами

Візьмемо слово Man, яке складається з трьох байтів: 77, 97 і 110 у десятковій системі. Разом ці три байти дають 24 біти. Розріжте 24 біти на чотири групи по шість бітів, і кожна група стане числом від 0 до 63, яке вказує на один символ алфавіту. Man перетворюється на TWFu.

Шість бітів можуть позначити лише 64 значення, тому чотири символи несуть три байти. Тож вихід приблизно на третину більший за вхід, не враховуючи розривів рядків.

Якщо дані не діляться на три байти, кодувальник доповнює кінець знаками =. Ma, у якому два байти, стає TWE=, а M, у якому один байт, стає TQ==. Доповнення повідомляє декодеру, скільки байтів містить остання група.

Текст спершу треба закодувати в UTF-8

Base64 працює з байтами, а текст складається із символів. Символ на кшталт é чи ✓ у UTF-8, кодуванні, що використовується в усьому вебі, зберігається як більше ніж один байт. Функція браузера btoa() приймає рядок і трактує кожен символ як один байт, тому вона не працює із символами понад базовою латиницею. Якщо викликати її для галочки, з'являється помилка InvalidCharacterError.

Виправлення: спершу перетворити текст на байти UTF-8, а потім закодувати ці байти. Фраза héllo ✓ має 10 байтів у UTF-8, а її Base64 — aMOpbGxvIOKckw==. Інструмент Base64 виконує цей крок за вас. Під час декодування він читає байти назад як UTF-8. Якщо байти не є коректним текстом UTF-8, інструмент сприймає їх як файл і пропонує завантаження.

Base64 для URL

Стандартний алфавіт містить + і /. В URL знак + може означати пробіл, а / розділяє частини шляху, тож рядок Base64 може зламати посилання. Безпечна для URL форма (RFC 4648, розділ 5) використовує натомість - і _, і зазвичай відкидає доповнення =. Використовуйте її, коли рядок потрапляє в URL, назву файлу або токен. Декодер приймає обидві форми, з доповненням або без.

Якщо Base64 узято з посилання, спершу декодуйте URL. Значення, яке було процентно закодоване в посиланні, треба декодувати, перш ніж можна буде прочитати його Base64. Посібник з процентного кодування пояснює правила для посилань.

Типовий випадок — токен входу: JSON Web Token складається з трьох частин у форматі Base64url, розділених крапками: заголовок, дані та підпис. Декодер JWT розбиває його й показує заголовок і дані як читабельний JSON.

Data URL і зображення

Data URL вбудовує файл у саме посилання. Його форма: data:, далі тип медіа, далі ;base64, потім кома та дані. Маленьке зображення стає data:image/png;base64, а далі закодовані байти. Веб-сторінки та таблиці стилів приймають цю форму, що заощаджує запит для крихітної іконки.

Ціна — розмір. Дані приблизно на третину більші, і вони йдуть усередині сторінки або таблиці стилів, а не окремим файлом, який браузер може кешувати. Використовуйте data URL для маленьких зображень, а не для великих фото. Якщо фото велике, стисніть його перед кодуванням.

Коли ви декодуєте Base64 в інструменті, він дивиться на перші байти даних. Файли PNG, JPEG, GIF і WebP починаються з відомої сигнатури, тож інструмент показує попередній перегляд і пропонує завантаження. Data URL з типом зображення також відображається як картинка.

Як це зробити у fixmint

1. Оберіть Кодувати або Декодувати над полем Текст або Base64, потім вставте текст або Base64.
2. Увімкніть Безпечний для URL алфавіт, без доповнення = для токенів, назв файлів і посилань. Декодер у будь-якому разі приймає обидві форми.
3. Щоб зробити data URL із файлу, перетягніть файл в зону скидання і увімкніть Для файлів: вивести data: URL.
4. Скопіюйте результат. Якщо декодовані байти є файлом, а не текстом, скористайтеся завантаженням, яке пропонує інструмент.

Типові помилки декодування

• Недопустимий символ. Вхідні дані містять символ, якого немає серед 64, наприклад лапки зі скопійованого речення. Перевірте, звідки взято текст. Невидимий пробіл нульової ширини у скопійованому тексті викликає ту саму помилку, тож видаліть невидимі символи і спробуйте ще раз. Посібник про невидимі символи пояснює, звідки вони беруться.
• Неправильна довжина. Бракує або зайвий символ, зазвичай це означає, що копіювання обірвалося.
• Розриви рядків і пробіли. Електронна пошта (MIME) переносить Base64 кожні 76 символів. Декодер прибирає пробіли і розриви рядків, тож перенесений текст можна вставляти як є.
• Відсутнє доповнення. Деякі системи відкидають знаки =. Декодер додає їх назад.

Винятки

• Результат схожий на безглуздицю. Це може бути файл, а не текст. ZIP-архів, PDF або програма декодуються в байти, які не читаються як текст. Інструмент пропонує їх для завантаження.
• Дуже великі вхідні дані. Увесь файл утримується в браузері під час кодування або декодування, тож дуже великий файл може працювати повільно, а на телефоні — не спрацювати.

Короткі відповіді

Base64 — це те саме, що шифрування?

Ні. Це оборотне кодування без ключа, тож його може декодувати будь-хто.

Чому мій Base64 довший за файл?

Кожні три байти стають чотирма символами, тому текст приблизно на третину більший.

Чому скопійований рядок Base64 не декодується?

Зазвичай під час копіювання щось втрачено або додано, наприклад розрив рядка не на тому місці чи відсутній останній символ. Скопіюйте ще раз із джерела.