Какую информацию безопасно хранить в sessionStorage?

Нужно чтобы информация после отключения и включения компьютера сохранялось вот для этого использую sessionStorage

Информация из sessionStorage удаляется после закрытия вкладки/браузера, поэтому врядли Вы можете использовать его в случаях включения/выключения ПК. Вместо этого используйте localStorage.

Насчет безопасности: Согласно GDPR Вы не имеется права хранить любую информацию с помощью которой можно идентифицировать пользователя, поэтому оцените данные и решайте.

Рассмотрим localStorage, sessionStorage cookies

localStorage, sessionStorage и файлы cookie - это все клиентские решения для хранения. Данные сеанса хранятся на сервере, где он остается под вашим прямым контролем.

LocalStorage

Плюсы:

1. Веб-хранилище можно рассматривать упрощенно как усовершенствование файлов cookie, обеспечивая гораздо большую емкость. Если вы посмотрите на исходный код Mozilla, мы увидим, что 5120 КБ (5 МБ, равный 2,5 миллионам символов в Chrome) является размером хранилища по умолчанию для всего домена. Это дает вам значительно больше возможностей для работы, чем обычный cookie 4 Кбайт.

2. Данные не отправляются обратно на сервер для каждого HTTP-запроса (HTML, изображения, JavaScript, CSS и т.д.) - уменьшение количества трафика между клиентом и сервером.

3. Данные, хранящиеся в localStorage, сохраняются до явного удаления. Сделанные изменения сохраняются и доступны для всех текущих и будущих посещений сайта.

Минусы:

1. Он работает по политике одного и того же происхождения. Таким образом, сохраненные данные будут доступны только по одному и тому же происхождению.

SessionStorage

Плюсы:

1. Он похож на localStorage.

2. Данные не являются постоянными, т.е. Данные доступны только для каждого окна браузера. Данные доступны только во время сеанса страницы. Сделанные изменения сохраняются и доступны для текущей страницы, а также для будущих посещений сайта в том же окне. После закрытия окна хранилище удаляется.

Минусы:

1. Данные доступны только внутри окна/вкладки, в котором она была установлена.

2. Подобно localStorage, работает с политикой того же происхождения. Таким образом, сохраненные данные будут доступны только по одному и тому же происхождению.

Cookies

Плюсы:

По сравнению с другими, никаких.

Минусы:

1. Предел 4K предназначен для всего файла cookie, включая имя, значение, дату истечения срока годности и т.д. Чтобы поддерживать большинство браузеров, сохраните имя до 4000 байт и общий размер файла cookie под 4093 байтами.

2. Данные отправляются обратно на сервер для каждого HTTP-запроса (HTML, изображения, JavaScript, CSS и т.д.) - увеличение количества трафика между клиентом и сервером.

   Как правило, допускается следующее:

   • Всего 300 куки
   • 4096 байт за куки файл
   • 20 файлов cookie для домена
   • 81920 байт на домен (задано 20 файлов cookie максимального размера 4096 = 81920 байт).

Делаем выводы что для вашего магазина лучше всего хранить в LocalStorage, как сказал Alexandr Tovmach, но вы же храните только не важные данные о цене и о выбранных продуктов, так что тут не нужно напрягаться в плане безопасности. Все эти api выдают пользователю информацию через браузер! Если конечно вы их не закодируете)

Всё, что вы оставляете на клиентской стороне по определнию не безопасно. Все данные, необходимо валидировать на стороне сервера.

Но если вы используете её для информации о корзине товаров, то вполне ок. Главное при оформлении заказа валидируйте наличие товара и цену с сервера.