Томский политехнический университет
Опубликован: 01.08.2012 | Доступ: свободный | Студентов: 19801 / 2044 | Оценка: 3.91 / 4.09 | Длительность: 12:36:00
Лекция 16:

HTML5. Хранения данных на стороне клиента

Аннотация: Cookie. Технология HTML5 WebStorage. Особенности хранения данных на стороне клиента: Отличия локального хранилища от сеансового. Сохранение и извлечение данных.

Мы уже говорили о том, что в последнее время наблюдается тенденция к переносу нагрузки веб - приложений на сторону клиента. В данной лекции мы рассмотрим подходы к хранению данных на стороне клиента.

Cookie

Прежде чем говорить о том, что есть, давайте разберемся с тем, что было.

Слово "cookie" ("куки", по общепринятой традиции не склоняется и не переводится буквально) знает практически каждый, кто так или иначе сталкивался с веб - разработкой. Если говорить просто, то это специальные файлы, создаваемые веб - сервером и хранящиеся на компьютере клиента.

Название эти файлы унаследовавали от давней методики программирования magic cookie, с помощью которой обеспечивался обмен небольшими порциями данных между программами, являются встроенным механизмом пересылки текстовых значений между сервером и клиентом.

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

Файлы "cookie" передаются в обоих направлениях при каждом посещении домена пользователем. Например, в файле "cookie" может храниться идентификатор сеанса, по которому веб-сервер может определить, какая именно виртуальная "корзина" принадлежит данному пользователю, сверяя идентификатор с собственной базой данных.

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

cookie поддерживаются со времен выпуска первого браузера Netscape.

Несмотря на удобства, предоставляемые использованием куки - файлов, можно выделить и ряд неудобств, связанных с их использованием:

  • ограничение размера cookie файла (4кб);
  • безопасность (файлы "видны в сети");
  • поскольку файлы передаются при каждом к ним обращении, т.е. занимают часть пропускной способности канала;
  • ряд пользователей требует наличия в браузерах возможности блокировки использования cookie - файлов, что ограничивает их использование в настоящее время.

Технология Web Storage

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

HTML5 Web Storage предоставляет программный интерфейс, посредством которого, разработчики могут сохранять данные в легко извлекаемых JavaScript-объектах, постоянно существующих от одной загрузки страницы к другой. Используя хранилище сеанса (sessionStorage) или локальное хранилище(localStorage), разработчики могут сами определять, должны ли данные сохраняться по отдельности для страниц, открытых в одном и том же окне (вкладке), и прекращать существование после закрытия этого окна (вкладки) или же совместно использоваться всеми окнами (вкладками) и продолжать существовать даже после перезапуска браузера.

В настоящее время заявлена поддержка технологии следующими браузерами:

  • Internet Explorer от 8.0 версии;
  • Mozilla Firefox от 3.5 версии;
  • Safari от 4.0 версии;
  • Chrome от 4.0 версии;
  • Opera от 10.5 версии;
  • iPhone от 2.0 версии;
  • Android от 2.0 версии.

Особенности хранения данных на стороне клиента

HTML5 предлагает два объекта для хранения данных на клиенте:

  1. localStorage - хранит данные без временных ограничений;
  2. sessionStorage - хранит данные в течение одной сессии.

Данные не передаются при каждом запросе, а только тогда, когда это явно указано. Таким образом возможно хранить большие объёмы данных, не влияя при этом на производительность вебсайта.

Для каждого сайта данные хранятся в своей области. И сайт имеет доступ только к принадлежащим ему данным.

Для работы с хранилищами данных используется javascript.

Галина Башкирова
Галина Башкирова

Здравствуйте, недавно закончила курс по проф веб программиованию, мне прислали методические указания с примерами тем, однако темы там для специальности 

Системный администратор информационно-коммуникационных» систем.
Мне нужно самой найти тему? или делать по высланным темам

 

Константин Моренко
Константин Моренко
Игорь Хан
Игорь Хан
Узбекистан, Ташкент, Ташкентский педагогический институт иностранных языков, 1990
Евгений Снегиренко
Евгений Снегиренко
Россия, г. Кемерово