Какие существуют способы хранения токенов на клиенте?

Способы хранения токенов на клиенте

Хранение токенов аутентификации (например, JWT) на клиенте — критически важная задача для безопасности веб-приложений. Основные способы включают использование localStorage, sessionStorage и cookies. Каждый из них имеет свои преимущества и недостатки, особенно в контексте защиты от XSS и CSRF атак.

localStorage и sessionStorage

localStorage и sessionStorage — это хранилища браузера, доступные через JavaScript. Они просты в использовании, но уязвимы для XSS-атак: если злоумышленник внедрит скрипт, он сможет прочитать токен. sessionStorage очищается при закрытии вкладки, что снижает риск, но не устраняет его полностью.

// Сохранение токена в localStorage
localStorage.setItem('token', 'my-jwt-token');

// Чтение токена
const token = localStorage.getItem('token');

// Удаление токена
localStorage.removeItem('token');

Cookies

Cookies — более безопасный вариант, если установлены флаги HttpOnly (недоступен для JavaScript) и Secure (только по HTTPS). Это защищает от XSS, но требует дополнительных мер против CSRF-атак, например, использование SameSite атрибута или CSRF-токенов.

// Установка cookie с флагами (на сервере)
Set-Cookie: token=my-jwt-token; HttpOnly; Secure; SameSite=Strict

Хранение в памяти

Токен можно хранить в переменной JavaScript (в памяти приложения). Это самый безопасный способ, так как токен не сохраняется в браузере, но при перезагрузке страницы он теряется, и требуется повторная аутентификация.

Вывод

Для максимальной безопасности рекомендуется использовать httpOnly cookies с флагами Secure и SameSite. Если требуется доступ к токену из JavaScript (например, для отправки в заголовках), рассмотрите хранение в памяти с коротким сроком жизни и использованием refresh-токенов в cookies.