К списку
Web-тестирование и DevToolsMiddleТехническое

Как работает и что хранит Local Storage в браузере

Краткий ответ

Local Storage сохраняет данные в формате ключ-значение внутри браузера и сохраняется после закрытия вкладки без ограничения по времени. Данные доступны только на том же домене, пока не будут удалены вручную или через скрипт.

Развёрнуто

Краткий ответ

Local Storage — это механизм хранения данных на стороне клиента, использующий формат ключ-значение. Информация сохраняется в браузере пользователя и не удаляется после закрытия окна, пока её явно не удалят.


Как это работает

Local Storage — часть Web Storage API, предназначенная для долговременного хранения данных в браузере. В отличие от sessionStorage, данные в Local Storage сохраняются постоянно и не зависят от сессии пользователя.

Данные организованы в виде пар ключ-значение (оба — строки). Доступ к Local Storage осуществляется через объект window.localStorage.

Основные характеристики:

Характеристика Описание
Время хранения Постоянное, пока не удалено вручную/скриптом
Доступность Только на том же домене
Объем Обычно около 5 Мб на домен
Формат хранения Строковые ключи и значения

Пример

// Сохранение данных
localStorage.setItem('user', 'QA Specialist');

// Получение данных
const role = localStorage.getItem('user'); // "QA Specialist"

// Удаление данных
localStorage.removeItem('user');

// Очистка всего localStorage
localStorage.clear();

В этом примере мы записываем роль пользователя, извлекаем её и удаляем по необходимости.

Что важно знать на собеседовании

  • Local Storage работает только в браузерах и доступен через JavaScript API.
  • Данные хранятся без срока действия, в отличие от cookie, и не отправляются на сервер автоматически.
  • Размер хранилища ограничен (~5 Мб), что достаточно для небольших настроек и кеша.
  • Local Storage не подходит для хранения чувствительной информации из-за отсутствия шифрования.
  • Для очистки данных можно использовать как JavaScript, так и инструменты разработчика в браузере.

Тема: Web-тестирование и DevTools | Уровень: middle