Cookie

Cookie on ruseller.com.

Cookie on w3schools.com.

Cookie - це спеціальні дані, що зберігаються у браузері.

Куки зберігаються між сесіями. Ви можете перегрузити сторінку чи відкрити сторінку в новій вкладці - збережені куки будуть доступні.

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

Cookie можна присилати сервером з кожним файлом: скриптом, зображенням, стилями, фреймом і т.д.
Ви можете знайти куки в заголовках файла в інструментах розробника.

Під час відвідування інтернет-магазину вам в браузер записуються куки про товари, які ви переглянули.

Коли ви мандруєте мережею - періодично бачите рекламу з тими ж товарами, що переглянули. Сайт-рекламодавець зчитує куки з вашого браузера і підгружає саме ці товари в банер.

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

document.cookie

Всі куки ви можете переглянути в налаштуваннях браузера.

Chrome:
Налаштування > Конфіденційність > Налаштування вмісту > Усі файли cookie...

Firefox:
Налаштування > Приватність > Видалити окремі cookie

Увага! Cookie працює тільки на сервері. Тому для роботи нам необхідний або локальний сервер (localhost), або наш FTP (http://circle.com.ua/users/fe*/ваш_нік/шлях_до_файла). Можливо, підійде і веб-сервер, вбудований в IDE, спробуйте.

Куки складаються з пар даних "ключ = значення".

Для роботи з куками в чистому js немає спеціальних функцій чи методів. Можна скористатися сторонньою бібліотекою функцій cookie.js.

Розгляньте запропоновані функції, опишіть що вони роблять.

Можливо, для роботи з куками вам знадобляться дві функції:

encodeURIComponent(str);
decodeURIComponent(URIstr);

Перша функція заміняє "небезпечні" символи в строці на спецсимволи, наприклад, пробіл на %20.
Друга функція виконує зворотню дію.

Завдання

  1. Підключіть до лекції скрипт cookie.js.
  2. Створіть декілька куків зі своїм іменем, курсом долара і т.п.
  3. Спробуйте напряму задати куки: document.cookie = 'say=hello';
  4. Змініть значення куків.

Видалення куків

В куки можна встановити спеціальний параметр expires, який відповідає кінцевому терміну дії куки, після цього куки автоматично видаляються.

Куки - сесійні, протягом сесії параметр expires ігнорується. В сучасних браузерах у більшості користувачів в налаштуваннях стоїть галочка "Продовжити з місця завершення", "Відновити попередній сеанс" чи щось подібне (для збереження відкритих вкладок якщо браузер закрити і відрити знову). При цьому сесія не вважається завершеною і просрочені куки не будуть видалені.

Для тестування видалення куків скористайтесь іншим браузером (яким ви не користуєтеся), відключіть функцію збереження вкладок і пробуйте видалити куки програмно, перезапустіть браузер, перевірте.