Хранение токена JWt в Cookie с помощью Http и Secure вместо LocalStorage в Javascript

Question

Добрый день, ребята,

Я работаю над проектом, в котором есть решения Web API (RestAPI) и SPA (одностраничное приложение).

Основано на видео, на котором я следилв Udemy он сохранил токен jwt в локальном хранилище, но поздно я обнаружил, что хранение в локальном хранилище немного рискованно, поскольку злоумышленник может скопировать настоящий токен и сделать запрос в будущем.

Я прочиталнекоторые блоги, в которых токен хранится в cookie, это нормально, поскольку вы можете установить cookie как httpOnly и безопасный.Но проблема в том, что я не знаю, как это реализовать.

Вот мой пример кода, когда у пользователя есть действительный логин:

axios.post('api/login/', this.account).then(response=>{
    if(response){
        localStorage.setItem('token', response.data.token); // will successfully save to localstorage
        // navigation here
    }
}).catch(error=> console.log(error); );

Как я могу сохранить это в cookie сбезопасные настройки?

Answer 1

Вы не можете установить cookie HttpOnly из кода завершения клиента (например, Javascript).Так как такие куки не предназначены для чтения с использованием Javascript.Вы должны установить такие куки с сервера.Вы можете отправить куки с ответом сервера и браузер будет хранить их чтение из заголовков.После этого браузер будет отправлять этот файл cookie на сервер с каждым запросом, отправляемым на сервер, до тех пор, пока срок действия файла cookie не истечет.

Вы можете установить cookie с сервера следующим образом.

Cookie cookie = new Cookie(name, value); //name and value of the cookie
cookie.setMaxAge(expire); //expire could be 60 (seconds)
cookie.setHttpOnly(true);
cookie.setPath("/");
response.addCookie(cookie);

Answer 2

Это выглядит примерно так: Установить cookie для HttpOnly через Javascript

Чтобы добавить к ответу этот источник цитаты:

Для предотвращения атак с использованием межсайтовых сценариев (XSS) файлы cookie HttpOnly недоступны для JavaScript API Document.cookie

Чтобы сохранить токены с использованием флагов httpOnly и secure, сервер должен будет ответитьс этим в заголовке (снова взято из вышеуказанного источника):

Set-Cookie: id = a3fWa;Истекает = ср, 21 октября 2015 г. 07:28:00 по Гринвичу;Безопасный;HttpOnly

Итак, я не думаю, что вы можете безопасно сохранить куки, если сервер не отвечает заголовком Set-Cookie, а скорее возвращает токен как тело ответа.