Local Storage vs Session Storage vs Cookie

В этой короткой статье мы с Вами изложим суть трех технологий - Local Storage, Session Storage, Cookie, работающих в браузере, рассмотрим их особенности, с тем, чтобы использовать данную статью как шпаргалку для памяти.

При работе с JavaScript, вам часто приходится выбирать способы сохранения пользовательской информации. И, если Вы часто, озадачиваетесь выбором между session storage, local storage и cookie, то эта статья как раз для вас.

LocalStorage:

• Хранит данные постоянно, так как дата истечения срока хранения информации не устанавливается. Очищается исключительно через средства, предоставляемые JavaScript или посредством очистки кэша браузера и локально сохраненных данных в настройках браузера.
• Самый большой объем хранения данных среди всех трех технологий

SessionStorage:

• Объект sessionStorage хранит данные только в рамках сессии, т.е. это означает, что данные сохраняются до тех пор пока не закрыт браузер или вкладка браузера.
• Данные никогда не отправляются на сервер.
• Объем для сохранения данных намного больше чем у Cookie - по крайней мере 5MB.

Cookie:

• Хранит данные, которые должны быть отправлены на сервер с последующими запросами. Срок экспирации различающийся, в зависимости от типа и продолжительности срока хранения, может быть установлен либо на стороне сервера или на стороне клиента (хотя, как правило, на стороне сервера).
• Cookie, в первую очередь, предназначены для чтения на стороне сервера, однако могут быть прочитаны и на стороне клиента. В свою очередь localStorage и sessionStorage могут быть прочитаны только на стороне клиента.
• Размер должен быть менее 4KB.
• Cookie можно сделать защищенными, установив флаг httpOnly равным true. Это приведет к недоступности Cookie на стороне клиента.

Таким образом, в данной мини-статье мы перечислили все основные особенности браузерных технологий сохранения данных у клиента, вам лишь остается выбрать то, что подходит лучше всего.