Как Установить и получить cookie с помощью JavaScript
Для работы нам понадобятся две функции: получение и установка cookie
Функция установки cookie
function set_cookie(name, value, expires)
{
if (!expires)
{
expires = new Date();
}
document.cookie = name + "=" + escape(value) + "; expires=" + expires.toGMTString() + "; path=/";
}
Функция получения cookie
function get_cookie(name)
{
cookie_name = name + "=";
cookie_length = document.cookie.length;
cookie_begin = 0;
while (cookie_begin < cookie_length)
{
value_begin = cookie_begin + cookie_name.length;
if (document.cookie.substring(cookie_begin, value_begin) == cookie_name)
{
var value_end = document.cookie.indexOf (";", value_begin);
if (value_end == -1)
{
value_end = cookie_length;
}
return unescape(document.cookie.substring(value_begin, value_end));
}
cookie_begin = document.cookie.indexOf(" ", cookie_begin) + 1;
if (cookie_begin == 0)
{
break;
}
}
return null;
}
Пример установки и получения
В примере нажав на ссылку "Установка" записываем в браузер cookie. Делаем это с помощью вот такой функции:
function save_cookie() {
var name = "example" // имя cookie
var tmp = "Привет, я ваша cookie!"; // записываемое значение
expires = new Date(); // получаем текущую дату
expires.setTime(expires.getTime() + (1000 * 86400 * 365)); // вычисляем срок хранения cookie
set_cookie(name, tmp, expires); // устанавливаем cookie с помощью функции set_cookie
}
Вызов этой функции в html:
<a href="javascript:save_cookie();">Установка</a>
Чтобы прочитать cookie, воспользуемся функцией get_cookie() и для наглядности запишем полученное значение в html-слой. Делаем это с помощью такой функции:
function write_cookie() {
// получаем cookie и записываем значение в слой layer с помощью innerHTML
document.getElementById('layer').innerHTML = get_cookie('example');
}
Вызов этой функции в html:
<a href="javascript:write_cookie();">Чтение</a>
// слой, в котором показываем значение cookie
<div id="layer" style="padding:5px;"></div>
Пример сохранения и получение массива
Установка и получение cookie аналогичны рассмотренным в предыдущем примере, с той лишь разницей, что перед чтением и сохранением необходимо обработать массив.
Получаем значения и записываем в cookie с помощью функции save_array():
function save_array() {
var myArray = [1, 2, "привет"]; // массив со значениями
var tmp = "";
if (myArray != null) {
// проходимся по массиву, собирая значения в переменную и разделяя их запятой
for (i in myArray)
{
if (myArray[i] != "") {
tmp = tmp + myArray[i];
if (i != myArray.length-1) {
tmp = tmp + ",";
}
}
}
}
expires = new Date(); // получаем текущую дату
expires.setTime(expires.getTime() + (1000 * 86400 * 365)); // вычисляем срок хранения cookie
set_cookie("example", tmp, expires); // устанавливаем cookie с помощью функции set_cookie
}
Вызов этой функции в html:
<a href="javascript:save_array();">Установка</a>
Читаем значение cookie и выводим в html-слой
function write_array() {
var getmyArray = get_cookie('example'); // читаем значение cookie
var tmp = '';
getmyArray = getmyArray.split(",") // разбираем значение, помещяя его в массив
for (i=0; i<getmyArray.length; i++) // проходимся по массиву и форматируем его для вывода
{
tmp += getmyArray[i];
if (i != getmyArray.length) {
tmp += "<br /7>";
}
}
// выводим массив в слой с индентификатором layer2
document.getElementById('layer2').innerHTML = tmp;
}
Вызов этой функции в html:
<a href="javascript:write_array();">Распечатать массив</a>
// слой, в котором показываем значение cookie
<div id="layer2" style="padding:5px;"></div>
Created/Updated: 25.05.2018
|