Javascript - хранение информации у клиента
- Подробности
- Категория: PHP, MySQL, Java
- Опубликовано 14.08.2014 19:19
В этом материале мы затронем очень интересную тему, которой касаются все веб-разработчики, кто стремиться сделать JS приложение или игру. Если нет желания прибегать к лишнему взаимодействию с сервером для хранения данных приложения или игры, тогда приходится искать иные выходы из ситуаций. Давайте их как раз и разберём.
В первую очередь, думая о хранении информации в браузере на стороне клиента хочется подумать о примитивных файлах. Однако к сожалению записывать в файлы Javascript не умеет. Поэтому никаких rewritable файлов в нашем приложении/игре быть не должно.
Тут же следует упомянуть о Cookies. Это весьма гожий способ хранения данных в браузере клиента. Из плюсов следует заметить что данные при желании моно получить и серверной стороной сайта. Из минусов это в первую очередь малый размер (имя переменной и значение не должны превышать 4кб), а также невозможность использования локально (не на домене). Вот очень удобные функции для записи и чтения ваших кукисов с помощью javascript:
function getCookie(name)
{
var begin = document.cookie.indexOf(name+'=');
if(-1 == begin) return null;
begin += name.length + 1;
end = document.cookie.indexOf('; ',begin);
if (-1 == end) end = document.cookie.length;
return document.cookie.substring(begin,end);
}
function setCookie(name, value)
{
var today = new Date();
var expiration = new Date(today.getTime() + 90 * 24 * 60 * 60 * 1000);
document.cookie = name + '=' + value + '; path=/; expires=' + expiration.toGMTString();
}
Следующим способом хранить и читать данные у клиента с помощью JS, это использование Web SQL. Как вы поняли из названия технологии, что это база данных. Естественно, обращение к вашим таблицам, изменение данных, создание строк в Web SQL имеет свои правила и ньюансы о которых вы сможете почитать на сторонних ресурсах.
Последним самым сочным вариантом является использование Web Storage.
Итак вот несколько способов использования технологии:
localStorage.somekey = "My data"; // Записываем данные в переменную somekey
alert(localStorage.somekey); // Получаем данные из переменной somekey
alert(localStorage['somekey']); // Другим способом получаем данные
delete localStorage.somekey; // Удаляем содержимое somekey
Также можно ещё другим способом записывать и получать данные Web Storage:
localStorage.setItem('somekey', 'value'); //Запись
alert(localStorage.getItem('somekey')); // Получение
Вы с лёгкостью можете записывать массивы JS в одну единицу хранения Web Storage:
foo = ['bar1', 'bar2', 'bar3']; //массив
localStorage.foo = JSON.stringify(foo); //Запись
foo = localStorage.foo ? JSON.parse(localStorage.foo) : []; //Восстанавливаем массив из Web Storage
Как вы сами видите всё просто и легко. В материале мы рассмотрели самые перспективные способы хранения информации на строне браузера клиента с целью использования её Javascript-кодами вашего web-приложения.