[Medium] 📄 cookie, sessionStorage, localStorage
Сравнение (Comparison)
| Свойство | cookie | sessionStorage | localStorage |
|---|---|---|---|
| Время жизни | Удаляется при закрытии страницы, если не установлен срок истечения (Expires) или максимальный возраст (Max-Age) | Удаляется при закрытии вкладки | Сохраняется до ручного удаления |
| HTTP-запрос | Да, отправляется на сервер через заголовок Cookie | Нет | Нет |
| Лимит хранения | 4КБ | 5МБ | 5МБ |
| Область доступа | Между окнами/вкладками | Только в текущей вкладке | Между окнами/вкладками |
| Безопасность | JavaScript не может получить доступ к HttpOnly cookies | Нет специальной защиты по умолчанию | Нет специальной защиты по умолчанию |
Терминология (Terminology)
Что такое постоянные cookies (persistent cookies)?
Постоянная cookie (также называемая permanent cookie) хранит данные в браузере пользователя в течение длительного времени.
Как упоминалось выше, это достигается установкой значения срока истечения (Expires или Max-Age).
Практический опыт (Practical Experience)
cookie
1. Проверка бе зопасности
В некоторых устаревших проектах была слабая безопасность и частые кражи аккаунтов, что значительно увеличивало операционные расходы. Я сначала использовал Fingerprint (Community-версия официально описывается как точная примерно на 60%, а платная версия включает 20 000 бесплатных запросов в месяц). Каждый авторизованный пользователь идентифицировался как уникальный ID визита на основе параметров устройства и геолокации. Затем, используя тот факт, что cookies отправляются с каждым HTTP-запросом, бэкенд мог проверять, сменил ли пользователь устройство или наблюдалось подозрительное изменение местоположения. При обнаружении аномалии процесс входа принудительно запускал OTP-верификацию (email или SMS, в зависимости от политики компании).
2. URL с реферальным кодом
При работе с продуктовым сайтом партнёрский маркетинг является обычной практикой: каждый промоутер получает выделенный URL для атрибуции.
Чтобы обеспечить привязку пользователей, пришедших через этот трафик, к промоутеру, я реализовал решение с атрибутом expires cookie. Как только пользователь заходил по реферальной ссылке, реферальный код оставался действительным в течение 24 часов (временное окно настраивается операционной командой). Даже если пользователь удалял реферальные параметры из URL, регистрация всё равно читала значение из cookie до его автоматического истечения.
localStorage
1. Хранение пользовательских предпочтений
- Обычно используется для хранения пользовательских предпочтений, таких как тёмная тема и локаль i18n.
- Также может хранить токены входа.