JavaScript sessionStorage: состояние текущей вкладки

Категория: JavaScript · Язык: JavaScript · Обновлено:

sessionStorage удобно для временного состояния одной вкладки: например, черновика формы или выбранного шага мастера. Значение хранится как строка, поэтому объект нужно сериализовать и безопасно обработать при чтении.

Рабочий пример

JavaScript
const key = 'wizard-state';
const state = { step: 2, email: 'dev@example.test' };
sessionStorage.setItem(key, JSON.stringify(state));

function readState() {
  try {
    return JSON.parse(sessionStorage.getItem(key) ?? 'null');
  } catch {
    return null;
  }
}

Хранилище доступно в рамках origin и сессии вкладки. try/catch защищает чтение от повреждённого JSON.

Частый вопрос

Сохраняется ли sessionStorage после перезагрузки страницы?

Обычно да, в той же вкладке. После закрытия вкладки её сессия завершается; новая вкладка обычно получает отдельное хранилище.