Окно: свойство sessionStorage

Только для чтения sessionStorage свойство предоставляет доступ к объекту сессионного Storage для текущего происхождения. sessionStorage аналогичен localStorage; разница заключается в том, что данные в localStorage не истекают, а данные в sessionStorage очищаются при завершении сессии страницы.

• При каждом загрузке документа в определённой вкладке браузера создаётся уникальная сессия страницы и назначается этой вкладке. Сессия страницы действует только для этой конкретной вкладки.
• Сессия страницы длится до тех пор, пока вкладка или браузер открыты, и сохраняется при перезагрузке и восстановлении страницы.
• Открытие страницы в новой вкладке или окне создаёт новую сессию со значением контекста верхнего уровня просмотра, что отличается от работы с куки-файлами сессии.
• Открытие нескольких вкладок/окон с одним и тем же URL создаёт sessionStorage для каждой вкладки/окна.
• Дублирование вкладки копирует sessionStorage вкладки в новую вкладку.
• Закрытие вкладки/окна завершает сессию и очищает объекты в sessionStorage.

Данные, хранящиеся в sessionStorage , специфичны для протокола страницы. В частности, данные, сохранённые скриптом на сайте, доступном по HTTP (например, http://example.com/), помещаются в другой объект sessionStorage от того же сайта, доступного по HTTPS (например, https://example.com/).

Ключи и значения всегда представлены в формате UTF-16, использующем два байта на символ. Как и с объектами, целочисленные ключи автоматически преобразуются в строки.

Объект Storage, который можно использовать для доступа к пространству сессионного хранения текущего происхождения.

SecurityError

Выбрасывается в одном из следующих случаев:

• Происхождение не является корректной тройкой схема/хост/порт. Это может произойти, если происхождение использует схемы file: или data:, например.
• Запрос нарушает политику. Например, пользователь настроился так, чтобы браузер не позволял странице сохранять данные.

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

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

// Get the text field that we're going to track
let field = document.getElementById("field");

// See if we have an autosave value
// (this will only happen if the page is accidentally refreshed)
if (sessionStorage.getItem("autosave")) {
  // Restore the contents of the text field
  field.value = sessionStorage.getItem("autosave");
}

// Listen for changes in the text field
field.addEventListener("change", () => {
  // And save the results into the session storage object
  sessionStorage.setItem("autosave", field.value);
});

• Использование API Web Storage
• Window.localStorage