Cookies хранят небольшие объемы текстовой информации (до 4KB) на стороне клиента, отправляются с каждым HTTP-запросом к домену, установившему их. Могут иметь срок истечения. Используются для авторизации, отслеживания пользователей, сохранения пользовательских предпочтений.
localStorage хранит данные без срока действия (пока пользователь не очистит хранилище или не удалит браузер) на стороне клиента (до 5-10MB в зависимости от браузера). Данные доступны между сессиями браузера, но только для скриптов того же происхождения (домена, протокола, порта). Не отправляются автоматически с HTTP-запросами. Используется для долговременного хранения данных, сохранения настроек приложения.
sessionStorage хранит данные в течение одной сессии браузера (пока вкладка или окно открыты). Данные удаляются при закрытии вкладки или окна. Объем хранения схож с localStorage (до 5-10MB). Данные также доступны только для скриптов того же происхождения. Не отправляются автоматически с HTTP-запросами. Используется для временного хранения данных, специфичных для текущей сессии.
| Характеристика | Cookies | localStorage | sessionStorage |
|---|---|---|---|
| Срок хранения | Срок истечения или закрытие браузера | Пока не удалены пользователем/приложением | Пока открыта вкладка/окно |
| Размер данных | До 4KB | До 5-10MB | До 5-10MB |
| Доступность | Отправляются с HTTP-запросами к домену | Только через JavaScript того же происхождения | Только через JavaScript того же происхождения |
| Доступность между вкладками | Да | Да | Нет (для разных вкладок) |
| Назначение | Авторизация, отслеживание, предпочтения | Долговременное хранение, настройки | Временное хранение в рамках сессии |
Пример использования localStorage:
javascriptПример использования sessionStorage:
javascript