Як Встановити і отримати 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>