#javascript #jwt #local-storage
Вопрос:
Я понимаю разницу между аутентификацией на основе файлов cookie и аутентификацией на основе JWT.
Я понимаю, что перед вызовом API через fetch я могу получить доступ к локальному хранилищу, чтобы получить значение токена и передать его по запросу. Как это будет работать, если я перезагрузю страницу? Если бы я использовал файлы cookie, они автоматически отправлялись бы в HTTP-запросе.
Пожалуйста, помогите прояснить это.
Комментарии:
1. Данные в локальном хранилище не будут удалены при перезагрузке страницы.
2. Правильный. Я думаю о том, как браузер передаст строку JWT на сервер, если я перезагрузлю страницу. Если бы это был вызов ajax , я мог бы получить доступ к localstorage и передать его вместе с запросом.
3. Браузер сам по себе ничего не делает с localstorage, поэтому он не будет включать строку JWT.
4. Спасибо @FelixKling: Вы предлагаете, чтобы для многостраничного приложения с включенной авторизацией и аутентификацией мы не могли использовать JWT, хранящийся в локальном хранилище?
Ответ №1:
Ваш сервер должен отправить вашему клиенту файл cookie только по протоколу http. Файл cookie может содержать токен jwt. Затем просто прикрепите этот файл cookie ко всем вашим запросам.
Если вы используете axios, вы можете сделать это с withCredentials: true помощью . Если вы используете ванильный XHR https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Credentials для получения дополнительной информации.
Поэтому, когда пользователь открывает страницу, звонит на сервер и знает, вошел он в систему или нет. Если это так, просто добавьте isLogged: true в хранилище сеансов.
Это было бы простым и безопасным решением.
Комментарии:
1. Привет @DoneDeal0 Итак, могу ли я подтвердить, что использование JWT с локальным хранилищем не подходит для многостраничного приложения?
2. Ты можешь. Это просто совсем небезопасно. Любой и любой скрипт может получить доступ к нему и расшифровать его. Если вы хотите, чтобы ваш токен был безопасным, используйте файлы cookie только по протоколу http.
3. Я все еще не могу понять, как хранение JWT в локальном хранилище работает с многостраничным приложением. Добавим, что в моем приложении есть страница A, Страница B, страница C. Со страницы A я регистрируюсь и перенаправляюсь на страницу B. Со страницы B, если я обновлю страницу , как серверная часть узнает, что я вошел в систему (поскольку JWT хранится в локальном хранилище и автоматически не передается в браузере, чтобы получить запрос на страницу B)?
4. Если у вас есть jwt, хранящийся в локальном хранилище, вы можете проверить его в своем интерфейсе и узнать, что пользователь вошел в систему. Затем вы можете запретить вызов api в соответствии с этой информацией. Но «правильный» способ сделать это-передать файл cookie на все ваши запросы api, чтобы серверная часть могла проанализировать его и проверить его действительность (поступает ли он из нужного домена, все еще ли он действителен и т. Д.), Прежде чем разрешить доступ к маршруту.