JS метод Object.atob()

Загальний опис

Функція atob() є вбудованою глобальною функцією, що використовується для декодування даних, закодованих за допомогою методу Base64. Ця функція приймає один аргумент - рядок, закодований у форматі Base64, і повертає декодований рядок. Застосування atob() можна зустріти в сценаріях, де необхідно декодувати дані, отримані в форматі Base64, наприклад, при роботі з API, які повертають закодовані дані, або при обробці даних, які були закодовані для передачі через URL.

Виклик atob() виглядає досить просто. Наприклад, якщо потрібно декодувати рядок SGVsbG8gV29ybGQh, виклик функції буде наступним:

let decodedString = atob('SGVsbG8gV29ybGQh');
console.log(decodedString); // Виводить: Hello World!

Цей рядок був спочатку закодований в Base64, і atob() повертає його у вигляді звичайного тексту.

Однак, важливо розуміти, що atob() призначена лише для обробки рядків, закодованих у форматі Base64, і може викинути помилку, якщо вхідний рядок містить символи, які не відповідають цьому формату. Тому перед використанням atob() важливо переконатися, що рядок дійсно закодований у Base64.

У більш складних сценаріях atob() може використовуватися для декодування даних, отриманих у вигляді бінарних файлів або інших форматів, які були перетворені у рядок Base64. Наприклад, можна декодувати зображення, закодоване у Base64, і відображати його на веб-сторінці:

let base64Image = 'data:image/png;base64,iVBORw0KGgo...';
let image = new Image();
image.src = atob(base64Image.split(',')[1]);
document.body.appendChild(image);

У цьому прикладі base64Image містить зображення у форматі Base64, яке спочатку розділяється на частини (відокремлення метаданих про формат), а потім декодується і вставляється на сторінку як зображення.

Важливо пам'ятати, що atob() не є безпечною функцією з точки зору безпеки. Оскільки вона не здійснює жодної перевірки аутентичності або цілісності вхідних даних, її використання з даними, отриманими з ненадійних джерел, може становити ризик. Також варто враховувати, що Base64 не є механізмом шифрування і не повинен використовуватися для захисту конфіденційних даних.

правити

Порада

Переконайтеся, що вхідний рядок для методу atob() є коректно закодованим у форматі base-64. Якщо переданий рядок не відповідає цьому формату, виклик методу призведе до помилки. Наприклад, використання atob("SGVsbG8gV29ybGQ=") правильно декодує рядок "Hello World", але передача некоректного рядка спричинить помилку.

автор: Bond правити

Порада

Врахуйте, що вихідний рядок методу atob() завжди буде у форматі ASCII. Тому, якщо оригінальний закодований текст містив символи поза ASCII-діапазоном, вони будуть втрачені або неправильно інтерпретовані після декодування. Це важливо розуміти при роботі з міжнародними або багатомовними даними.

автор: Bond правити

Порада

Використовуйте метод atob() для декодування даних, які були закодовані у форматі base-64 на стороні сервера або іншого клієнта. Це може бути корисним, наприклад, при отриманні закодованих даних через API або при обробці даних, збережених у вигляді рядків у локальному сховищі.

автор: Bond правити

Порада

Зверніть увагу на безпеку при роботі з atob(). Оскільки цей метод використовується для декодування даних, важливо переконатися, що декодовані дані не містять шкідливого коду або не використовуються в уразливих контекстах. Завжди перевіряйте джерело даних та їхній вміст перед декодуванням.

автор: Bond правити

+ додати пораду чи нотатку

Синтаксис

atob(encodedData)

Параметри

encodedData

Рядок у форматі двійкового коду (тобто рядок, в якому кожен символ розглядається як байт двійкових даних) із закодованими даними у форматі base64.

автор: Bond

правити

Повернення

string

Повертає рядок ASCII, що містить розкодовані дані з encodedData.

автор: Bond

правити

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі Серверні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
	4	1	3	10.5	12

Підтримка: мобільні переглядачі

Переглядач
	37	18	4	1

Підтримка: серверні переглядачі

Переглядач
	16.0.0	1.0

Приклади

+ запропонувати свій приклад у пісочниці

// Закодований рядок у форматі Base64
const encodedText = "SGVsbG8gV29ybGQh"; // Це представляє "Hello World!" закодований в Base64

// Використання методу atob() для декодування тексту
const decodedText = atob(encodedText);

// Виведення результуючого рядка
console.log(decodedText); // Виведе: "Hello World!"

// Закодоване зображення у форматі Base64
const encodedImage = "data:image/png;base64,iVBORw0KG..."; // Приклад закодованого зображення

// Створення нового об'єкту <img> для відображення зображення
const imgElement = document.createElement("img");

// Встановлення декодованого зображення як джерела зображення для <img>
imgElement.src = encodedImage;

// Додавання <img> до DOM для відображення зображення на сторінці
document.body.appendChild(imgElement);