JavaScript. Подробное руководство, 6-е издание, стр. 332

Кроме того, учтите, что многие пользователи не доверяют веб-сайтам, использующим cookies или другие механизмы хранения данных на стороне клиента для целей, которые напоминают «слежение». Применяйте механизмы хранения, описываемые в этой главе, для повышения удобства работы с вашим сайтом, но не используйте их как механизм сбора конфиденциальной информации. Если появится слишком большое количество сайтов, дискредитирующих механизмы хранения данных на стороне клиента, пользователи будут отключать их или часто очищать хранилища, что сделает невозможным и их использование, и работу сайтов, опирающихся на их применение.

***************************************************

20.1. Объекты localStorage и sessionStorage

Броузеры, реализующие положения проекта спецификации «Web Storage», определяют в объекте

<b>Window</b>
два свойства:
<b>localStorage</b>
и
<b>sessionStorage</b>
. Оба свойства ссылаются на объект
<b>Storage</b>
- постоянно хранимый ассоциативный массив, отображающий строковые ключи в строковые значения. Объекты
<b>Storage</b>
действуют подобно обычным объектам в языке JavaScript: достаточно просто присвоить свойству объекта строку, и броузер автоматически сохранит ее. Разница между
<b>localStorage</b>
и
<b>sessionStorage</b>
заключается лишь в сроке хранения и области видимости: они определяют, как долго будут храниться данные и кому они будут доступны.

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

<b>localStorage</b>
, но он точно так же мог бы работать и со свойством
<b>sessionStorage</b>
:

<b>var name = localStorage.username; // Получить сохраненное значение.</b>

<b>name = localStorage[&quot;username&quot;]; // Эквивалентная форма обращения, как к массиву</b>

<b>if (!name) {</b>

<b>  name = prompt(&quot;Как вас зовут?&quot;); // Задать пользователю вопрос.</b>

<b>  localStorage.username = name; // Сохранить ответ.</b>

<b>}</b>

<b>// Выполнить итерации по всем хранящимся парам имя/значение </b>

<b>for(var name in localStorage) { // Итерации по всем хранящимся именам</b>

<b>  var value = localStorage[name]; // Получить значение для каждого из них</b>

<b>}</b>

Объекты

<b>Storage</b>
также определяют методы для сохранения, извлечения и удаления данных. Эти методы рассматриваются в разделе 20.1.2.

Проект спецификации «Web Storage» определяет возможность сохранения структурированных данных (объектов и массивов), а также простых значений и данных встроенных типов, таких как даты, регулярные выражения и даже объекты

<b>File</b>
. Однако на момент написания этих строк броузеры позволяли сохранять только строки. Если потребуется сохранять и извлекать данные других типов, их можно кодировать и декодировать вручную. Например:

<b>// При сохранении числа оно автоматически преобразуется в строку.</b>

<b>// Не забудьте выполнить обратное преобразование при извлечении из хранилища.</b>

<b>localStorage.х = 10;</b>

<b>var х = parseInt(localStorage.х);</b>

<b>// Преобразовать объект Date в строку при записи и обратно - при чтении</b>

<b>localStorage.lastRead = (new Date()).toUTCString();</b>

<b>var lastRead = new Date(Date.parse(localStorage.lastRead));</b>

<b>// Для кодирования любых простых или структурированных данных удобно </b>

<b>// использовать формат JS0N</b>

<b>localStorage.data = JSON.stringify(data); // Закодировать и сохранить </b>

<b>var data = JSON.parse(localStorage.data); // Извлечь и декодировать.</b>

20.1.1. Срок хранения и область видимости

Объекты

<b>localStorage</b>
и
<b>sessionStorage</b>
отличаются сроком хранения данных и областью видимости хранилища. Объект
<b>localStorage</b>
представляет долговременное хранилище данных: срок хранения не ограничен, и данные сохраняются на компьютере пользователя, пока не будут удалены веб-приложением или пока пользователь не потребует от броузера (посредством некоторого пользовательского интерфейса, предоставляемого броузером) удалить их.

Доступность данных в объекте

<b>localStorage</b>
ограничивается происхождением документа. Как описывалось в разделе 13.6.2, происхождение документа определяется такими параметрами, как протокол, имя хоста и номер порта, поэтому все следующие URL-адреса ссылаются на документы с разным происхождением:

<a href="http://www.example.com/"><b>http://www.example.com</b></a><b>      // Протокол: http: имя хоста: </b><a href="http://www.example.com/"><b>www.example.com</b></a>

<a href="https://www.example.com/"><b>https://www.example.com</b></a><b>     // Другой протокол </b>

<a href="http://static.example.com/"><b>http://static.example.com</b></a><b>   // Другое имя хоста </b>

<a href="http://www.example.com:8000/"><b>http://www.example.com:8000</b></a><b> // Другой порт</b>

Все документы, имеющие одно и то же происхождение, будут совместно использовать одни и те же данные в объекте

<b>localStorage</b>
(независимо от происхождения сценария, который фактически обращается к хранилищу
<b>localStorage</b>
). Они смогут читать и изменять данные друг друга. Но документы с разными происхождениями никогда не смогут прочитать или изменить данные друг друга (даже если оба они будут выполнять сценарий, полученный с одного и того же стороннего сервера).