Саша Бизиков

Работаем с куками через JavaScript

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

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

Запись

Сейчас поговорим о том, как записывать куки.

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

var cookie = navigator.cookieEnabled;

Если получаем значение true, значит браузер поддерживает куки. Можем действовать!

Хранятся они в виде «имя=значение». Простая функция, которая записывает новую куку:

function setCookie(name, value) { 
 document.cookie = name + "=" + value;
}

Помимо этого у куки еще есть время жизни. Например:

expires=Tue, 1 Jan 2014 01:00:01 GMT

Дата истечения куки в формате GMT. Получить нужную дату можно, используя объект Date.

Чтение

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

function getCookie(name) { 
 var cookie = " " + document.cookie; 
 var search = " " + name + "="; 
 var setStr = null; 
 var offset = 0; 
 var end = 0; 
 if (cookie.length > 0) { 
 offset = cookie.indexOf(search); 
 if (offset != -1) { 
 offset += search.length; 
 end = cookie.indexOf(";", offset);
 if (end == -1) { 
 end = cookie.length; 
 } 
 setStr = unescape(cookie.substring(offset, end)); 
 } 
 } 
 return(setStr); 
}

Удаление

Если кука вам больше не нужна, ее можно удалить:

function deleteCookie(name) { 
 var cookieDate = new Date(); 
 cookieDate.setTime(cookieDate.getTime() - 1); 
 var cookie = name += "=; expires=" + cookieDate.toGMTString(); 
 document.cookie = cookie;
}

Использование

setCookie('bizikovru', 'hello');

Если посмотреть в консоли document.cookie, то увидим результат bizikovru = hello.

Извлекаем значение куки по ее имени с помощью функции getCookie.

getCookie('bizikovru');

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

Ещё заметки

С чего начать изучение вёрстки

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

Правильный перенос сайта Вордпрес на новый домен

Рассказываю как правильно перенести сайт на WordPress на новый домен с помощью Search Replace DB.

Перенос записей в WordPress

В заметке рассмотрим как перенести большое количество записей в формате CSV на WordPress. Решение подойдёт даже для случая больше 100 000 записей.

Неделя @cssunderhood

На прошлой неделе мне довелось побывать ведущим последнего и самого молодого коллективного твиттера — @cssunderhood.

Двухфакторная аутентификация в WordPress

Если у вас есть сайт или блог на WordPress, то его можно обезопасить от взлома. Один из таких способов повышения безопасности сайта — настройка двухфакторной аутентификации.

Что выбрать: Jekyll или WordPress?

Целый год мой блог работал на Jekyll и размещался на GitHub. Месяц назад вернулся обратно к WordPress и в заметке расскажу почему.

IBM Process Designer 8.5: чтение и запись данных в Coach View

В Coach View среды IBM Process Designer 8.5 взаимодействие с переменными происходит через JavaScript, который разделён на блоки.

Как перевести тему WordPress на русский язык

В большинстве тем для WordPress присутствует папка languages, которая позволяет перевести на необходимый язык весь её интерфейс. Перевод заключается в редактировании .po-файла. В заметке рассказываю как перевести тему WordPress на русский язык.

Оптимизация сайта: включаем gzip-сжатие

У Google есть хороший сервис: PageSpeed Insights, который подскажет, что необходимо оптимизировать у вас на сайте. Одним из советов является включение gzip сжатия на хостинге (или сервере), где размещается ваш сайт.

Меняем фон верхней панели браузера

С выходом Android 5.0 мобильный браузер Chrome начал поддерживать метатег theme-color. Для примера сделаем верхнюю панель красной.

Страница в Sharepoint 2013 c областями для веб-частей

Мне тут по работе довелось верстать под Sharepoint 2013. Многие вещи оказались для меня далеко не тривиальными. Поэтому свой опыт хочу задокументировать в виде статьи, где опишу процесс создания .aspx-страницы с зонами для вставки веб-частей.

Эффективное использование mixin в LESS

Я люблю LESS. Правда. Это очень клевая штука, которая позволяет упростить написание CSS. В этой записи пойдет речь о Mixin.

Система сеток с использованием LESS

В этой заметке пойдет речь о примере использования LESS с целью упрощения верстки проектов.

Полезные ресурсы по Sharepoint

В этой заметке собирал ссылки на различные статьи, видео с конференций, тренинги и туториалы по брендингу Sharepoint.

Как сделать сайт WordPress мультиязычным

Данное решение подойдет только для тех, кто использует WordPress, в качестве основы сайта. Весь необходимый функционал предоставляет плагин qTranslate. Русский файл перевода уже включён в последние версии плагина qTranslate, но по неизвестным причинам, его нет в списке.

Что такое LESS и как его использовать

Коротко рассказываю о том, что такое LESS и как его использовать.

Бесплатный хостинг на Гитхаб

Рассказываю как использовать GitHub Pages в качестве хостинга сайта.

Перенос Вордпрес на новый домен

Описываю как правильно выполнить перенос сайта на WordPress.

Установка и настройка Git

Описываю по шагам как установить Git к себе на компьютер.

Отключить топик-ссылки и фотосеты в LiveStreet

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

Настройка виртуального сервера для работы с LiveStreet

Мне необходимо было перейти на выделенный сервер, где будет работать сайт на LiveStreet. Настраивал сервер впервые, узнал много нового. В заметке опишу основные этапы настройки.

Настройка файла .htaccess после установки LiveStreet

Решение ошибки когда главная страница работает, а при переходе на любую другую — получаю 404 ошибку.