Работа с куками из javascript. Хранение данных Примеры работы с куками на javascript

Файлы cookie - это небольшие текстовые файлы, которые создаёт браузер в специальной папке по команде PHP программы. Хотя cookie может создать и JavaScript, но в этой статье не об этом. Тут мы будем говорить только о установке cookie через PHP программу.

Файлы cookie содержать в себе информацию в виде пар имя=значение. Например, в cookie можно записать логин и пароль пользователя и хранить их на компьютере клиента, чтобы он в следующий раз не залогинивался заново. Конечно, хранение логина и пароля в cookie не самый безопасный способ, и эти данные лучше хранить используя сессии в PHP , но в качестве примера использования cookie этот случай подойдёт.

PHP программа даёт команду браузеру-клиенту установить cookie используя строку в заголовке ответа. То есть вы должны представлять, как работает интернет, что такое заголовок запроса и заголовок ответа, чтобы понять как работает установка cookie.

Итак, всю информацию о том, какие cookie должен установить браузер, PHP программа отправляет в заголовке ответа.

Установка cookie в PHP

Для установки cookie в языке PHP есть функция setcookie() , она и задает cookie, которое будет передано браузеру вместе с другими HTTP заголовками.

Все заголовки, которые создаёт ваш скрипт, должны быть отправлены до того, как ваш скрипт что-то выведет в окно браузера.

Вернёмся к нашей функции. Вот её синтаксис:

Bool setcookie (string имя, string значение, int время жизни, string путь, string домен, bool протокол, bool http only)

bool, string, int в этом синтаксисе ‐ это типы данных. То есть "bool setcookie() " обозначает то, что функций setcookie() возвращает значение булевого типа. Далее, первый и второй аргумент (имя и значение) должны быть типа строка (string), и так далее.

Сразу скажу, для начала вам понадобится только первые три параметра. На остальные можете пока не обращать внимания.

  • string имя - имя в паре имя=значение
  • string значение - значение в паре имя=значение
  • int время жизни - время хранения cookie, это метка времени Unix, т.е. желательно задавать это время с помощью функции time() , прибавляя время в секундах, через которое срок действия cookie должен истечь. Также можно воспользоваться функцией mktime() .
  • string путь - путь к директории на сервере, из которой будут доступны cookie.
  • string домен - домен, которому доступны cookie.
  • bool протокол - указывает на то, что значение cookie должно передаваться от клиента по защищенному HTTPS соединению. Если задано TRUE, cookie от клиента будет передано на сервер, только если установлено защищенное соединение. При передаче cookie от сервера клиенту следить за тем, чтобы cookie этого типа передавались по защищенному каналу, должен программист веб-сервера.
  • bool http only - если задано TRUE, cookie будут доступны только через HTTP протокол. То есть cookie в этом случае не будут доступны скриптовым языкам, вроде JavaScript. Эта возможность была предложена в качестве меры, эффективно снижающей количество краж личных данных посредством XSS атак (несмотря на то, что поддерживается не всеми броузерами). Стоит однако же отметить, что вокруг этой возможности часто возникают споры о ее эффективности и целесообразности. Аргумент добавлен в PHP 5.2.0. Может принимать значения TRUE или FALSE.

Только первый параметр обязателен. Если упустить третий параметр, то по умолчанию он будет равным нолю, это значит что cookie исчезнут сразу после закрытия браузера.

Вот пример установки cookie:

Обратите внимание, я поставил прошедшее время с запасом, на случай если на компьютере клиента время установлено не точно.

Пример работы cookie в PHP

Напишем примитивный счётчик просмотра страниц сайта посетителем, используя cookie.

Что здесь что?

«cookie_name » – имя куки;

«cookie_value » – значение куки;

«time()+3600 » – время жизни куки в секундах (в нашем случае – 1 час). Если задать время жизни равное «0 », то куки удалится сразу, как будет закрыт браузер;

«/ » – раздел, в котором доступен куки (в нашем случае – доступен на всем сайте). Если вы хотите ограничить раздел, в котором куки будет доступен, то «/ » замените, например, на «/audio/rock »;

«your_site.ru » – домен, на котором куки будет доступен;

«true » – параметр, указывающий что куки доступен только по защищенному протоколу https. В противном случае значение – false ;

«false » – параметр, указывающий, что куки доступен скриптовым языкам. В противном случае – true (доступно только по http).

Здесь также не все параметры являются обязательными, и для создания куки вам хватит такой конструкции:

Для удобства значение куки можно задать через переменную:

2. Получение Cookie

Для того чтобы получить куки, вам необходимо воспользоваться:

$_COOKIE["cookie_name"];

Чтобы исключить появление ошибок из-за возможного отсутствия куки, воспользуйтесь :

Как и в предыдущем примере работы с Cookie на jQuery, куки можно присвоить к переменной:

3. Удаление Cookie

Удаление куки на PHP выполняется так же просто, как и в jQuery. Все, что вам нужно сделать, это задать пустое значение куки и отрицательное время (время, которое уже прошло):

Setcookie("cookie_name", "", time() - 3600);

Время в данном примере равняется часу назад, чего вполне хватит для удаления куки.

Хочется отметить , что в некоторых случаях использование куки куда рациональнее использования базы данных для реализации необходимого функционала.

Cookies - это механизм хранения данных броузером удаленного компьютера для идентификации возвращающихся посетителей и хранения параметров веб-страниц (например, переменных).

Приведем пример использования Cookies на конкретном примере.

Предположим, нам нужно написать счетчик посещения сайта. Нам нужно знать, какое число посещений сайта осуществлялось каждым конкретным посетителем.

Данную задачу можно решить двумя способами. Первый из них заключается в ведении учета IP-адресов пользователей. Для этого нужна база данных всего из одной таблицы, примерная структура которой такая:

Когда пользователь заходит на сайт, нам нужно определить его IP-адрес, найти в базе данных информацию о его посещениях, увеличить счетчик и вывести его в браузер посетителя. Написать обработчик (скрипт) подобной процедуры несложно. Однако при использовании такого метода у нас появляются проблемы следующего характера:

  • Для каждого IP-адреса нужно вести учет в одной таблице, которая может быть очень большой. А из этого следует, что мы нерационально используем процессорное время и дисковое пространство;
  • У большинства домашних пользователей IP-адреса являются динамическими. То есть, сегодня у него адрес 212.218.78.124, а завтра - 212.218.78.137. Таким образом, велика вероятность идентифицировать одного пользователя несколько раз.

Можно использовать второй способ, который намного легче в реализации и более эффективен. Мы устанавливаем в Cookie переменную, которая будет храниться на диске удаленного пользователя. Эта переменная и будет хранить информацию о посещениях. Она будет считываться скриптом при обращении посетителя к серверу. Выгода такого метода идентификации очевидна. Во-первых, нам не нужно хранить множество ненужной информации о IP-адресах. Во-вторых, нас не интересуют динамические IP-адреса, поскольку данные о своих посещениях хранятся конкретно у каждого посетителя сайта.

Теперь понятно, для чего мы можем использовать Cookie - для хранения небольшой по объему информации у клиента (посетителя) сайта, например: настройки сайта (цвет фона страниц, язык, оформление таблиц и.т.д.), а также другой информации.

Файлы Cookies представляют собой обыкновенные текстовые файлы, которые хранятся на диске у посетителей сайтов. Файлы Cookies и содержат ту информацию, которая была в них записана сервером.

Программирование Cookies

Приступим к программированию Cookies.

Для установки Cookies используется функция SetCookie() . Для этой функции можно указать шесть параметров, один из которых является обязательным:

  • name - задает имя (строк), закрепленное за Cookie;
  • value - определяет значение переменной (строка);
  • expire - время "жизни" переменной (целое число). Если данный параметр не указать, то Cookie будут "жить" до конца сессии, то есть до закрытия браузера. Если время указано, то, когда оно наступит, Cookie самоуничтожится.
  • path - путь к Cookie (строка);
  • domain - домен (строка). В качестве значения устанавливается имя хоста, с которого Cookie был установлен;
  • secure - передача Cookie через защищенное HTTPS-соединение.

Обычно используются только три первые параметра.

Пример установки Cookies:

При использовании Cookies необходимо иметь в виду, что Cookies должны устанавливаться до первого вывода информации в браузер (например, оперетором echo или выводом какой-либо функции). Поэтому желательно устанавливать Cookies в самом начале скрипта. Cookies устанавливаются с помощью определенного заголовка сервера, а если скрипт выводит что-либо, то это означает, что начинается тело документа. В результате Cookies не будут установлены и может быть выведено предупреждение. Для проверки успешности установки Cookies можно использовать такой метод:

Функция SetCookie() возвращает TRUE в случае успешной установки Cookie. В случае, если Cookie установить не удается SetCookie() возвратит FALSE и возможно, предупреждение (зависит от настроек PHP). Пример неудачной установки Cookie:

Cookie установить не удалось, поскольку перед посылкой заголовка Cookie мы вывели в браузер строку "Hello".

Чтение значений Cookies

Получить доступ к Cookies и их значениям достаточно просто. Они хранятся в суперглобальных массивах и $_COOKIE и $HTTP_COOKIE_VARS .

Доступ к значениям осуществляется по имени установленных Cookies, например:

echo $_COOKIE["my_cookie"];
// Выводит значения установленной Cookie "My_Cookie"

Пример установки Cookie и последующего его чтения:

В рассмотренном примере при первом обращении к скрипту устанавливается Cookie "test" зо значением "hello". При повторном обращении к скрипту будет выведено значение Cookie "test", то есть строка "Hello".

При чтении значений Cookies обращайте внимание на проверку существования Cookies, например, используя оператор isset() . Либо путем подавления вывода ошибок опереатором @

А вот пример, как построить счетчик числа загрузок страницы с помощью Cookies:

Удаление Cookies

Иногда возникает необходимость удаления Cookies. Сделать это несложно, необходимо лишь вновь установить Cookie с идентичным именем и пустым параметром. Например:

Установка массива Cookies и его чтение

Мы может установить массив Cookies, используя квадратные скобки в именах Cookies , а затем прочитать массив Cookies и значения этого массива:

Преимущества использования Cookies неоспоримы. Однако существуют и некоторые проблемы их использования. Первая из них заключается в том, что посетитель может блокировать прием Cookies браузером или попросту удалить все Cookies или их часть. Таким образом, мы можем иметь некоторые проблемы в идентификации таких посетителей.



>
Есть еще вопросы или что-то непонятно - добро пожаловать на наш

Сейчас мы с вами будем разбираться с cookie (куки). Куки - это небольшой кусочек информации, который может храниться в браузере пользователя.

Эта информация доступна в каждый заход пользователя на страницу нашего сайта. Можно, к примеру, по первому заходу пользователя на страницу спросить у него дату рождения, а потом, когда наступит его день рождения - поприветствовать его. Или можно показать пользователю баннер с кнопкой

Или можно показать пользователю баннер с кнопкой "не показывать 1 день". По нажатию на эту кнопку баннер скрывается, но в куки пишется информация о моменте времени, когда это произошло - и ровно через сутки баннер покажется опять.

Кроме того, с куками можно работать не только из JavaScript, но и из PHP (там это нужно, например, для хранения авторизации пользователя), см. работа с куками на PHP при необходимости.

В общем, куки достаточно полезная штука и с ее помощью можно сделать довольно много интересных вещей. Давайте разбираться, как работать с куками через JavaScript.

К сожалению, работа с куками в JavaScript реализована просто ужасно и без костылей тут не обойтись, а лучше просто использовать готовые библиотеки.

Итак, давайте приступим.

Основы работы с куками

К кукам, хранящимся в браузере, можно получить доступ с помощью document.cookie . С помощью этого свойства куки можно записывать и можно прочитывать.

В document.cookie куки хранятся просто в виде строки. Эта строка состоит из пар имя_куки=значение_куки , которые перечисляются через точку с запятой с пробелом "; ".

Пример: "name=Вася; age=25" .

Чтобы записать в куки, нужно просто в document.cookie присвоить куку с ее именем:

Document.cookie = "name=Вася";

При записывании новой куки те куки, которые там уже были, не затрутся. Посмотрим на примере - будем постепенно записывать новые куки и сразу выводить текущее содержимое document.cookie:

Document.cookie = "name=Вася"; alert(document.cookie); //выведет "name=Вася" document.cookie = "age=25"; alert(document.cookie); //выведет "name=Вася; age=25"

Если устанавливать куку с тем же именем в разные значения - новое значение будет затирать предыдущее:

Document.cookie = "name=Вася"; alert(document.cookie); //выведет "name=Вася" document.cookie = "name=Дима"; alert(document.cookie); //выведет "name=Дима"

Когда вы будете экспериментировать с куками, имейте ввиду, что уже установленные куки никуда не деваются из document.cookie и мои примеры кода у вас могут работать не совсем так, как показано - вы будете видеть еще и ранее установленные куки.

Получение куки по ее имени

Итак, мы уже определи, что куки хранятся в виде простой строки, например, "name=Вася; age=25; salary=1000". Получается, чтобы найти, к примеру, значение куки с именем age, его нужно достать из это строки каким-нибудь способом: к примеру функциями работы со строками или регулярными выражениями.

Дальнейшие рассуждения вам не будут понятны без знания регулярных выражений, см. вначале учебник по регулярным выражениям . Или просто пропустите эти рассуждения и пользуйтесь готовой функцией не вникая особо в ее суть.

Давайте попробуем написать регулярку, которая вытягивает значение куки с именем age :

Document.cookie = "age=25"; var age = document.cookie.match(/age=(.+?);/); alert(age); //выведет 25

Однако, эта регулярка не идеальна и при некоторых условиях может или не работать, или работать не правильно.

Во-первых , в нашей регулярке в конце стоит точка с запятой - разделитель разных кук в document.cookie. Но посмотрим внимательно на нашу строку с куками - "name=Вася; age=25; salary=1000" - у последней куки нету точки с запятой в конце! И наша регулярка эту куку не возьмет.

Нужно ее модифицировать и сказать, что кука заканчивается или точкой с запятой, или концом строки. Модифицируем: /age=(.+?)(;|$)/ .

Во-вторых , следует дописать часть регулярки перед именем куки - перед этим именем может быть пробел или начало строки, если кука первая. Допишем: /(^|\s)age=(.+?)(;|$)/ .

Значение куки может быть пустым, к примеру, если мы в document.cookie записывали вот так: "age=". Учтем это в нашей регулярке - заменим + на *. Заменим: /(^|\s)age=(.*?)(;|$)/ .

Давайте теперь введем несохраняющие скобки, чтобы не плодить лишних карманов: /(?:^|\s)age=(.*?)(?:;|$)/ .

А теперь давайте реализуем функцию getCookie() , которая параметром будет принимать имя произвольной куки и возвращать ее значение. Вот эта функция:

Function getCookie(name) { var matches = document.cookie.match(new RegExp("(?:^|\s)" + name + "=(.*?)(?:;|$)";)); return matches; }

Однако, у нас есть проблема: ведь в переменной name могут быть специальные символы (команды регулярных выражений), которые сломают нашу регулярку. Давайте заэкранируем все эти символы (заменим их на их же, но с экранирующем обратным слешем спереди):

Name = name.replace(/([.$\/?*+\\{}|()\[\]^])/g, "\\$1") + "=(.*?);

С учетом этого исправления получим следующее:

Function getCookie(name) { var matches = document.cookie.match(new RegExp("(?:^|\s)" + name.replace(/([.$?*+\\\/{}|()\[\]^])/g, "\\$1") + "=(.*?)(?:;|$)";)); return matches; }

Теперь разберемся с matches . Если кука существует - все хорошо, а вот если не существует - давайте вернем undefined :

If (matches) {return matches;} else {return undefined;}

Перепишем этот if в сокращенный вариант:

Return matches ? matches : undefined;

С учетом исправления получим следующий код:

Function getCookie(name) { var matches = document.cookie.match(new RegExp("(?:^|\s)" + name.replace(/([.$?*+\\\/{}|()\[\]^])/g, "\\$1") + "=(.*?)(?:;|$)";)); return matches ? matches : undefined; }

Теперь учтем, что некоторые браузеры выполняют url кодирование кук и раскодируем их обратно с помощью decodeURIComponent:

Function getCookie(name) { var matches = document.cookie.match(new RegExp("(?:^|\s)" + name.replace(/([.$?*+\\\/{}|()\[\]^])/g, "\\$1") + "=(.*?)(?:;|$)";)); return matches ? decodeURIComponent(matches) : undefined; }

Это и есть готовая функция для получения нужной вам куки (взята отсюда learn.javascript.ru/cookie , я просто чуть подправил регулярку и объяснил как она работает).

Дополнительные настройки кук

Это еще не все: у кук есть дополнительные настройки, которые чаще всего желательно указать.

Эти настройки указываются после пары ключ=значение , каждое – после точки с запятой. Как-то так:

Document.cookie = "name=Вася; настройка1=значение1; настройка2=значение2";

Папка установки

Первая настройка, которую мы разберем - это папка сайта, для которой установлена кука. Это очень важная настройка, так как куки без нее работают совсем не так, как мы ожидаем - при установки куки мы думаем, что она будет доступна на всем сайте, а она будет доступна только в папке установки и ее подпапках.

Например: ваш сайт site.ru и вы, находясь на странице site.ru/folder/ установили куку. Так вот: эта кука будет доступна на странице site.ru/folder/, на странице site.ru/folder/subfolder/ и так далее, но не будет доступна, к примеру на странице site.ru/somefolder/.

Это очень неожиданное поведение. Чтобы исправить его существует настройка path . Обычно она используется так: path=/ - и кука устанавливается на всем сайте. Пример:

Document.cookie = "name=Вася; path=/";

Можно указать и конкретную папку, например path=/folder :

Document.cookie = "name=Вася; path=/folder";

Домен установки

Следующая настройка domain задает домен, для которого установлена кука. По умолчанию это текущий домен (но не его поддомены). Можно указать, что кука доступна именно на поддомене. К примеру, наш домен site.ru, а куку мы установим для forum.site.ru:

Document.cookie = "name=Вася; path=/; domain=forum.site.ru";

Если указать специальную маску .site.ru , то кука будет доступна на сайте и всех его поддоменах:

Document.cookie = "name=Вася; path=/; domain=.site.ru";

Время жизни

Все куки живут только определенное время. По умолчанию куки живут очень не долго - всего лишь до закрытия браузера. Чаще всего нас это не устраивает и мы хотели бы сделать куки более долгоживущими.

Для этого применяется настройка expires , в которую следует задавать момент времени, до которого живет кука. Этот момент устанавливается в формате GMT. Этот формат можно получить так: используем объект Date, устанавливаем в любое время, а потом вызываем метод toUTCString.

Давайте установим время жизни куки +1 день от текущего момента :

Var date = new Date; date.setDate(date.getDate() + 1); date = date.toUTCString(); document.cookie = "name=Вася; path=/; expires="+date;

Удаление кук

Куки удаляются интересным образом: нужно установить время их жизни в прошедшее время, ну или просто поставить его как -1 . Давайте удалим нашу куку:

Document.cookie = "name=; path=/; expires=-1";

Библиотеки для работы с куками

Так как работа с куками в JavaScript реализована просто ужасно, существуют библиотеки, которые упрощают работу с ними. Изучите эти библиотеки самостоятельно.

Cookies - верная технология, позволяющая веб-сайту "запомнить" пользователя,
сохранить его настройки и не спрашивать каждый раз его логин и пароль. Можно
подумать, что если удалить кукисы в браузере, то сайт тебя не узнает. Но эта
уверенность обманчива.

Можно сколько угодно заморачиваться о своей анонимности, использовать прокси
и VPN, подделывать заголовки HTTP-запросов, выдающие используемую систему,
версию браузера, часовой пояс и море другой инфы, но у веб-сайта все равно
останутся способы распознать факт того, что ты на нем уже бывал. Во многих
случаях это не особо критично, но только не в ситуации, когда на каком-то
сервисе необходимо представиться другим пользователем или банально сохранить
анонимность. Легко представить, как среагирует антифрод-система некой условной
финансовой организации, если определит, что с одного компьютера были выполнены
авторизации под аккаунтами совершенно разных людей. Да и разве приятно
осознавать, что кто-то в Сети может отслеживать твои перемещения? Едва ли. Но
обо всем по порядку.

Как работают куки?

Чтобы идентифицировать пользователя, испокон веков использовались кукисы.
Cookies (от англ. "печенье") - это небольшая порция текстовой информации,
которую сервер передает браузеру. Когда пользователь обращается к серверу
(набирает его адрес в строке браузера), сервер может считывать информацию,
содержащуюся в cookies, и на основании ее анализа совершать какие-либо действия.
Например, в случае авторизованного доступа к чему-либо через веб в cookies
сохраняются логин и пароль в течение сессии, что позволяет пользователю не
вводить их снова при запросах каждого документа, защищенного паролем. Таким
образом, веб-сайт может "запомнить" пользователя. Технически это выглядит
следующим образом. Запрашивая страницу, браузер отправляет веб-серверу короткий
текст с HTTP-запросом.

Например, для доступа к странице www.example.org/index.html браузер
отправляет на сервер www.example.org следующий запрос:

GET /index.html HTTP/1.1
Host: www.example.org

Сервер отвечает, отправляя запрашиваемую страницу вместе с текстом,
содержащим HTTP-ответ. Там может содержаться указание браузеру сохранить куки:

HTTP/1.1 200 OK
Content-type: text/html
Set-Cookie: name=value

Если есть строка Set-cookie, браузер запоминает строку name=value (имя =
значение) и отправляет ее обратно серверу с каждым последующим запросом:

GET /spec.html HTTP/1.1
Host: www.example.org
Cookie: name=value
Accept: */*

Все очень просто. Если сервер получил от клиента куки и они есть у него в
базе, он однозначно может их обработать. Таким образом, если это были кукисы с
некоторой информацией об авторизации, у пользователя в момент посещения не будет
спрашиваться логин и пароль. По стандарту куки имеют определенный срок жизни
(хоть он и может быть очень большим), после которого умирают. А любые
сохраненные кукисы пользователь без труда может удалить, воспользовавшись
соответствующей опцией, которая есть в любом браузере. Этот факт сильно
расстраивает владельцев многих ресурсов, которые не желают терять связь с
посетителем. Им важно отслеживать его, понимать, что "вот этот человек был у нас
вчера, а еще позавчера и т.д.". Особенно это касается различных анализаторов
трафика, систем для ведения статистики, баннерных сетей и т.п. Вот тут-то и
начинается самое интересное, потому что разработчики используют всякие
ухищрения, о которых многие пользователи даже не подозревают. В ход идут
различные уловки.

Flash-куки

Все дело в том, что помимо обычных HTTP "плюшек", к которым все давно
привыкли, сейчас активно используются альтернативные хранилища, где браузер
может записать данные на стороне клиента. Первое, что нужно упомянуть - это
хранилище любимого и ненавистного одновременно Flash (для тех пользователей, у
которых он установлен). Данные хранятся в так называемых LSO (Local Shared
Objects) - схожих с cookies по формату файлах, которые сохраняются локально на
компьютере пользователя. Подход во многом аналогичен обычным "плюшкам" (в этом
случае на компьютере пользователя точно так же сохраняется небольшое количество
текстовых данных), но имеет некоторые преимущества:

  • Flash-кукисы являются общими для всех браузеров на компьютере (в отличие
    от классической cookie, которая привязана к браузеру). Настройки, информация
    о сессии, как и, скажем, некий идентификатор для отслеживания пользователя,
    не привязываются к какому-то конкретному браузеру, а становятся общими для
    всех.
  • Flash cookie позволяет сохранять намного больший объем данных (как
    правило, 100 Кб), что увеличивает количество настроек пользователя,
    доступных для сохранения.

На практике LSO становится очень простой и доступной технологией для трекинга
пользователя. Задумайся: если бы я предлагал тебе удалить все "плюшки" в
системе, ты бы вспомнил о Flash-кукисах? Вероятно, нет. А теперь попробуй взять
любой просмотрщик, например, бесплатный

FlashCookiesView и посмотреть, сколько всего интересного записано в
хранилищах Flash. Тут же вырисовывается и список сайтов, которые очень не хотят
потерять твой след, даже если ты подчистишь кэш браузера (вместе с "плюшками").

Кукисы везде с evercookie

Но если об LSO слышали продвинутые пользователи и мало-мальски хорошие
разработчики, то о существовании других техник хранения данных, подчас очень
изощренных (но действенных), многие даже не подозревают. Взять хотя бы новые
хранилища, которые появлялись в
(Session Storage,
Local Storage, Global Storage, Database Storage via SQLite), о которых ты можешь
прочитать в статье " ". Этой проблемой всерьез заморочился польский специалист
по безопасности Samy Kamkar. В результате на свет появилась специальная
JavaScript-библиотека evercookie, которая специально создана для того, чтобы
создавать максимально живучие кукисы в браузере. Кто-то может спросить: "Зачем
это нужно?". Очень просто: для того, чтобы однозначно идентифицировать
посетителя страницы, если он придет вновь. Такие сложно убиваемые кукисы часто
называются Tracking cookies и даже определяются некоторыми антивирусами как
угроза приватности. Evercookie может свести все попытки остаться анонимным к
нулю.

Секрет в том, что evercookie использует сразу все доступные для браузера
хранилища: обычные HTTP-кукисы, LSO, контейнеры HTML5. Кроме того, в ход идет
несколько хитрых приемов, которые с не меньшим успехом позволяют оставить на
компьютере желанную метку. Среди них: генерация особых PNG-изображений,
использование history браузера, хранение данных с помощью тега ETag, контейнер
userData в Internet Explorer - оказывается, что вариантов-то очень много.

В том, насколько это эффективно работает, можно убедиться на сайте
разработчика -
http://samy.pl/evercookie . Если нажать на кнопку "Click to create an
evercookie", в браузере будут созданы кукисы со случайным числом. Попробуй
удалить кукисы везде, где это только возможно. Бьюсь об заклад, сейчас ты
задумался: "Где еще можно удалить кукисы, кроме как в настройках браузера?".
Уверен, что все удалил? Перезагрузи страницу для верности, можешь даже заново
открыть браузер. Вот теперь смело нажимай на кнопку "Click to rediscover cookies".
WTF? Сайту это не помешало откуда-то взять данные - в полях страницы
отобразилось число, которые было сохранено в кукисах. Но мы же их потерли? Как
это получилось? Попробуем разобраться с некоторыми техниками.

Кукисы в PNG

Крайне интересным приемом, используемым в Evercookie, является подход
хранения данных в кэшированных PNG-изображениях. Когда evercookie устанавливает
куки, он обращается к скрипту evercookie_png.php со специальной HTTP "плюшкой",
отличной от той, которая используется для хранения стандартной информации о
сессии. Эти специальные кукисы считываются PHP-сценарием, создающим
PNG-изображение, в котором все значения RGB (цветов) выставляются в соответствии
с информацией о сессии. В конечном итоге PNG-файл отправляется браузеру клиента
с пометкой: "файл необходимо кэшировать 20 лет".

Получив эти данные, evercookie удаляет созданные ранее специальные
HTTP-кукисы, затем выполняет тот же самый запрос к тому же PHP-сценарию, но не
предоставляя информации о пользователе. Тот видит, что интересующих его данных
нет, и сгенерировать PNG он не может. Вместо этого браузеру возвращается
поддельный HTTP-ответ "304 Not Modified", что заставляет его вытащить файл из
локального кэша. Изображение из кэша вставляется на страницу с помощью тега
HTML5 Canvas. Как только это происходит, evercookie считывает каждый пиксель
содержимого Canvas, извлекая RGB-значения и, таким образом, восстанавливая
данные изначальных кукисов, которые были сохранены в изображении. Вуаля, все
работает.

Хинт с Web History

Другой прием напрямую использует историю браузера. Как только браузер
устанавливает плюшку, evercookie с помощью алгоритма Base64 кодирует данные,
которые необходимо сохранить. Предположим, что этими данными является строка,
полученная "bcde" после преобразований в Base64. Библиотека последовательно
обращается в фоновом режиме к следующим URL:

google.com/evercookie/cache/b
google.com/evercookie/cache/bc
google.com/evercookie/cache/bcd
google.com/evercookie/cache/bcde
google.com/evercookie/cache/bcde-

Таким образом, эти URL сохраняются в history. Далее в ход идет специальный
прием - CSS History Knocker, который с помощью JS-скрипта и CSS позволяет
проверить, посещал ли пользователь указанный ресурс или нет (подробнее тут -
samy.pl/csshack). Для
проверки плюшек evercookie пробегается по всем возможным символам Base64 на
google.com/evercookie/cache, начиная с символа "a" и двигаясь далее, но только
на один символ. Как только скрипт видит URL-адрес, к которому было обращение, он
начинает перебор следующего символа. Получается своеобразный брутфорс. На деле
этот подбор осуществляется чрезвычайно быстро, потому что никакие запросы к
серверу не выполняются. Поиск в history осуществляется локально в максимально
короткий срок. Библиотека знает, что достигла конца строки, когда URL будет
заканчиваться символом "-". Декодируем Base64 и получаем наши данные. Как
назвать разработчиков браузеров, которые это позволяют?

Попробуй удали

А что будет, если юзер потрет свои кукисы? Важная фишка самой библиотеки
evercookie в том, что пользователю придется основательно постараться, чтобы
удалить кукисы, оставленные в разных местах - сейчас их 10. Если хотя бы в одном
месте останутся данные куки, то они автоматически восстановятся и во всех других
местах. Например, если пользователь не только удалит свои стандартные кукисы, но
и очистит данные LSO, подчистит HTML5-хранилища, что уже маловероятно, все равно
останутся куки, созданные с помощью кэшированного PNG и web history. При
следующем же посещении сайта с evercookie библиотека не только сможет найти
запрятанную плюшку, но и восстановит их во всех остальных местах, которые
поддерживает браузер клиента. Интересный момент связан с передачей
"плюшек" между браузерами. Если пользователь получает кукисы в одном браузере,
то есть большая вероятность, что они воспроизведутся и в других. Единственное
необходимое для этого условие - сохранение данных в Local Shared Object куке.

Как использовать?

Библиотека Evercookie полностью открытая, поэтому ты можешь свободно
пользоваться ей, подгонять под свои нужды. К серверу не предъявляется никаких
серьезных требований. Все что нужно - это доступ к JS-сценарию, в котором
содержится код evercookie. Чтобы использовать Flash-кукисы (Local Shared Object),
в папке со скриптом должен быть файл evercookie.swf, а для работы техник,
основанных на PNG-кэшировании и использовании хранилища ETag, необходим доступ к
PHP-сценариям evercookie_png.php и evercookie_etag.php. Использовать evercookie
можно на любой страничке сайта, подключив следующий скрипт:





var ec = new evercookie();
// устанавливаем cookie "id" со значением "12345"
// синтаксис: ec.set(key, value)
ec.set("id", "12345");
// восстанавливаем кукису с именем "id"
ec.get("id", function(value)
{
alert("Cookie value is " + value)
});

Есть также другой способ получения кукисов, основанный на использовании более
продвинутой callback-функции. Это позволяет извлечь значения кукисов из
различных используемых хранилищ и сравнить их между собой:

function getCookie(best_candidate, all_candidates)
{
alert("The retrieved cookie is: " + best_candidate + "\n" + "You
can see what each storage mechanism returned " + "by looping through the all
candidates object.");

For (var item in all_candidates) document.write("Storage
mechanism " + item + " returned: " + all_candidates + "
");
}

ec.get("id", getCookie);

Библиотека evercookie доступна каждому. Это немного пугает, особенно если
совершенно не представляешь, что можно против нее предпринять.

Как защититься?

Проблем с тем, чтобы подчистить куки в браузере и Flash"е, нет. Но попробуй
удали данные везде, где наследила evercookie! Ведь если оставишь куки в одном
месте - скрипт автоматически восстановит значение и во всех остальных
хранилищах. По сути, эта библиотека является хорошей проверкой режима
приватности, который сейчас есть практически у всех браузеров. И вот что я тебе
скажу: из Google Chrome, Opera, Internet Explorer и Safari только последний в
режиме "Private Browsing" полностью блокировал все методы, используемые
evercookie. То есть после закрытия и открытия браузера скрипт не смог
восстановить оставленное им значение. Есть повод задуматься. Тем более что в
ближайшее время разработчик evercookie обещал добавить в библиотеку еще
несколько техник хранения данных, в том числе с помощью технологии Isolated
Storage в Silverlight, а также Java-апплета.

Поделиться