Base64 кодирование и декодирование в Javascript: советы
Быстрый ответ
// Кодирование текста в формат Base64
const encoded = btoa('Текст для кодирования');
// Декодирование из формата Base64 в текст
const decoded = atob(encoded);
// Применение функции encodeURIComponent для кодирования URL
const urlEncoded = btoa(encodeURIComponent('Текст для кодирования'));
Обработка символов Unicode при кодировании
Если вам нужно работать с символами Unicode, используя функцию btoa()
, сначала кодируйте строки в формате UTF-8.
// Сначала кодируем строку в формате UTF-8, затем кодируем в Base64
function utf8_to_b64(str) {
return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g,
(match, p1) => String.fromCharCode('0x' + p1)));
}
Восстановление символов Unicode: декодирование
Когда вам надо декодировать строку Unicode из формата Base64, используйте следующий способ:
// Декодируем строку из формата Base64 обратно в формат UTF-8
function b64_to_utf8(str) {
return decodeURIComponent(atob(str).split('').map(c =>
'%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2)).join(''));
}
Работаем с Base64 в Node.js через Buffer
В Node.js функции btoa()
и atob()
не доступны, однако есть Buffer
.
// Кодирование текста с использованием Buffer в Node.js
let buff = Buffer.from('Текст для кодирования', 'utf-8');
let base64data = buff.toString('base64');
// Декодирование Base64 обратно в текст с использованием Buffer в Node.js
buff = Buffer.from(base64data, 'base64');
let text = buff.toString('utf-8');
Поддержка в различных браузерах: кодирование с помощью CryptoJS
Для обеспечения совместимости в разных версиях браузеров можно использовать CryptoJS.
var CryptoJS = require('crypto-js');
// Перевод текста в Base64 с помощью CryptoJS
var encodedWord = CryptoJS.enc.Utf8.parse('Текст для кодирования');
var encoded = CryptoJS.enc.Base64.stringify(encodedWord);
// Декодирование строки Base64 обратно в текст с помощью CryptoJS
var decodedWord = CryptoJS.enc.Base64.parse(encoded);
var decoded = decodedWord.toString(CryptoJS.enc.Utf8);
Лучшие практики и рекомендации
Следуйте данным советам при работе с Base64:
- Обрабатывайте большие строки Base64 по частям.
- Перед декодированием уберите символы перевода строки (
\r
или\n
) и завершающие нули (\0
). - При необходимости использования собственного метода кодирования можно применить сопоставление символов Base64 с их десятичными значениями.
- Используйте битовые операции для оптимизации вашего кода декодирования.
- Подумайте над пошаговой обработкой данных для экономии времени.
Визуализация
Вы можете представить процессы следующим образом:
Данные ⇒ функция btoa()
превращает их в кодированный подарок 🎁 ⇒ функция atob()
преобразует их обратно в данные, когда это требуется.
Работа с файлами и бинарными данными
Для работы с бинарными данными в JavaScript:
Воспользуйтесь методом FileReader.readAsDataURL() для конвертации файлов в строки Base64.
JSСкопировать кодconst reader = new FileReader(); reader.readAsDataURL(fileBlob); reader.onloadend = () => { let base64data = reader.result; console.log(base64data); };
Преобразование бинарного массива в Base64:
JSСкопировать кодlet uintArray = new Uint8Array(buffer); let string = String.fromCharCode.apply(null, uintArray); let encodedData = btoa(string);
Полезные материалы
Ниже представлены полезные ссылки для получения дополнительной информации о работе с Base64: