Главная/ Учимся Javascript, CSS, HTML/ Уроки HTML/ Up And Running/ Local Storage/ Введение в HTML5 хранилище. HTML5. Up and Running. Марк Пилгрим

Введение в HTML5 хранилище

Дата публикации: 28.03.2011

То, что я называю «HTML5 хранилище» на самом деле является спецификацией «Веб хранилище». Изначально это было частью HTML5, но затем по некоторым политическим причинам было отделено. Некоторые производители браузеров эту возможность именуют по-своему: «локальное хранилище» или «DOM хранилище». Эти различия в названиях добавляют несколько сложностей, о которых я расскажу далее.

Так что же такое HTML5 хранилище? Если коротко — то это возможность для веб страниц хранить пары ключ/значение локально, в рамках веб браузера клиента. Это похоже на работу cookie: данные сохранятся, если ты покинешь сайт или даже закроешь браузер. Но в отличие от cookie эти данные никогда не передаются на сервер (кроме случаев, когда ты специально не попросишь). В отличие от прочих попыток реализации локального хранилища, эта встроена в браузер и будет доступна всегда, даже когда не установлены дополнительные плагины.

Какие браузеры это поддерживают? Как видно из таблицы ниже, почти все современные браузеры поддерживают HTML5 хранилище… и даже IE!

IE Firefox Safari Chrome Opera iPhone Android
8.0+ 3.5+ 4.0+ 4.0+ 10.5+ 2.0+ 2.0+

С помощью Javascript можно получить доступ к локальному хранилищу через объект localStorage глобального объекта window. Прежде, чем использовать эту возможность, нужно определить, а поддерживает ли браузер хранилище:

function supports_html5_storage() {
	return ('localStorage' in window) && window['localStorage'] !== null;
}

Или же можно воспользоваться Modernizr:

if (Modernizr.localstorage) {
// window.localStorage доступен
}
else {
// встроенной поддержки HTML5 хранилища нет :(
// можно попробовать dojox.storage или какое-то другое решение
}

Куда дальше

Показать комментарии