Перейти к основному содержимому

[Medium] 📄 cookie, sessionStorage, localStorage

Сравнение (Comparison)​

СвойствоcookiesessionStoragelocalStorage
Время жизниУдаляется при закрытии страницы, если не установлен срок истечения (Expires) или максимальный возраст (Max-Age)Удаляется при закрытии вкладкиСохраняется до ручного удаления
HTTP-запросДа, отправляется на сервер через заголовок CookieНетНет
Лимит хранения4КБ5МБ5МБ
Область доступаМежду окнами/вкладкамиТолько в текущей вкладкеМежду окнами/вкладками
БезопасностьJavaScript не может получить доступ к HttpOnly cookiesНет специальной защиты по умолчаниюНет специальной защиты по умолчанию

Терминология (Terminology)​

Что такое постоянные cookies (persistent cookies)?

Постоянная cookie (также называемая permanent cookie) хранит данные в браузере пользователя в течение длительного времени. Как упоминалось выше, это достигается установкой значения срока истечения (Expires или Max-Age).

Практический опыт (Practical Experience)​

1. Проверка безопасности​

В некоторых устаревших проектах была слабая безопасность и частые кражи аккаунтов, что значительно увеличивало операционные расходы. Я сначала использовал Fingerprint (Community-версия официально описывается как точная примерно на 60%, а платная версия включает 20 000 бесплатных запросов в месяц). Каждый авторизованный пользователь идентифицировался как уникальный ID визита на основе параметров устройства и геолокации. Затем, используя тот факт, что cookies отправляются с каждым HTTP-запросом, бэкенд мог проверять, сменил ли пользователь устройство или наблюдалось подозрительное изменение местоположения. При обнаружении аномалии процесс входа принудительно запускал OTP-верификацию (email или SMS, в зависимости от политики компании).

2. URL с реферальным кодом​

При работе с продуктовым сайтом партнёрский маркетинг является обычной практикой: каждый промоутер получает выделенный URL для атрибуции. Чтобы обеспечить привязку пользователей, пришедших через этот трафик, к промоутеру, я реализовал решение с атрибутом expires cookie. Как только пользователь заходил по реферальной ссылке, реферальный код оставался действительным в течение 24 часов (временное окно настраивается операционной командой). Даже если пользователь удалял реферальные параметры из URL, регистрация всё равно читала значение из cookie до его автоматического истечения.

localStorage​

1. Хранение пользовательских предпочтений​

  • Обычно используется для хранения пользовательских предпочтений, таких как тёмная тема и локаль i18n.
  • Также может хранить токены входа.