Начинающие разработчики часто заглядывают в справочники, чтобы найти разницу между локальным (Local Storage) и сессионным хранилищем (Session Storage) и cookie. Эта короткая статья поможет вам разобраться с вопросом.
Local Storage (локальное хранилище)
- Хранит данные бессрочно.
- Очищается только с помощью JavaScript или очистки кэша браузера.
- Хранит данные объёмом до 5 МБ, это самый большой объём из трёх вариантов хранилища.
- Не поддерживается старыми браузерами, например, IE 7 и ниже.
- Работает по правилу ограничения домена (same origin policy). То есть сохранённые данные доступны только для одного источника.
Session Storage (сессионное хранилище)
- Хранит данные, пока продолжается текущая сессия. Когда пользователь закрывает браузер, данные становятся недоступными.
- Используется контекст браузера верхнего уровня, поэтому каждая вкладка браузера хранит уникальные данные.
- Объём данных больше чем в Cookie.
- Не поддерживается старыми браузерами, например, IE 7 и ниже.
Cookie
- Хранит данные, которые можно передавать на сервер через заголовки.
- Локальное и сессионное хранилище доступны только на клиентской стороне.
- Срок хранения устанавливается при создании cookie.
- Объём данных не превышает 4 Кбайт.
- Cookie могут быть защищёнными, в этом случае их содержимое нельзя получить на стороне клиента. Это важно для аутентификации при хранении пользовательских токенов.
Адаптированный перевод статьи Local Storage vs Session Storage vs Cookie Storage by Paulund.
Фронтенд-разработчик
— с нуля до трудоустройства за
10 месяцев
- Постоянная поддержка от наставника и учебного центра
- Помощь с трудоустройством
- Готовое портфолио к концу обучения
- Практика с первого урока
Вы получите именно те инструменты и навыки, которые позволят вам найти работу
Узнать больше