Могу ли я хранить токен jwt в локальном хранилище при использовании Next.js?
Мы хотим использовать Next.js для нашего приложения, но мы будем использовать в основном рендеринг на стороне клиента для выборки данных. API — это внешний API, который мы будем вызывать. Только домашняя страница будет использовать рендеринг на стороне сервера. Основной API потребует входа в систему для доступа к информационной панели, а содержимое информационной панели зависит от пользователя. Итак, мы хотим использовать выборку данных на стороне клиента в next.js. JWT использовался во внешнем API для авторизации пользователя, а роль пользователя вместе с другими данными пользователя хранилась в токене доступа JWT. Мы новички в Nextjs и хотели знать, как это сделать. Нам нужно, чтобы каждый пользователь отправлял свой токен доступа как часть своего запроса при выполнении запроса API, находясь внутри панели инструментов. Можем ли мы хранить этот токен доступа в их локальном хранилище и передавать его их носителю заголовка при выполнении запросов API?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Да, ты можешь. После того, как будет сделан запрос на вход и API вернет JWT, вы можете вызвать localstorage, чтобы установить элемент . Затем при выполнении запроса на стороне клиента вы должны вызвать localstorage, чтобы получить элемент, а затем передать его в заголовках запроса. Имейте в виду, вам нужно будет управлять сроком действия.
Другой способ сделать это — при входе в систему API возвращает заголовок для установки файла cookie , который сохраняет JWT в файлах cookie. Затем при выполнении запроса (предоставленного на том же хосте) он будет автоматически передаваться по куки, если вы установите заголовок Access-Control-Allow-Credentials
Лично я бы выбрал файлы cookie, потому что, если они настроены только на HTTP, это повысит безопасность. Это также дает преимущество в том, что у него есть время истечения срока действия, поэтому файл cookie очищается, когда он больше не действителен, и пользователь может закрыть страницу и снова открыть ее, оставаясь при этом в системе.
Надеюсь это поможет.
@kingNodejs да, вам также нужно будет установить файл cookie для токена обновления, а затем обработать обновление в API. По сути, если токен аутентификации недействителен, но токен обновления действителен, сгенерируйте новый токен и отправьте ответ с set-cookie и новым токеном. Эта статья может помочь вам разобраться с использованием файлов cookie для управления ими (geeksforgeeks.org/jwt-authentication-with-refresh-tokens)
Да, можете, но не храните токен в локальном хранилище!!
Auth0 рекомендует хранить токены в памяти браузера как наиболее безопасный вариант.
Для этого: используйте либо веб-воркер для отправки токена в ваш код, когда это необходимо, либо просто сохраните токен в памяти. Например, когда вы получаете свой токен, поместите его в переменную, доступную для вашего приложения.
Таким образом, вы защищаете себя от межсайтового скриптинга (XSS), поскольку доступ к локальному хранилищу может получить любой скрипт, загруженный конечным пользователем.
Атаки с использованием межсайтовых сценариев (XSS) — это тип внедрения, при котором вредоносные сценарии внедряются [...]
Наконец, я могу порекомендовать просто хранить ваш токен внутри файла cookie только для http:
Я думаю, что буду использовать только http-подход. Если я собираюсь использовать только http, можно ли хранить его там? Его больше не нужно будет где-то хранить, верно?
Да, точно. Не забудьте сделать его не только http-only, но и «тот же сайт», чтобы предотвратить CSRF Cheatsheetseries.owasp.org/cheatsheets/…
Могу ли я внедрить систему токенов обновления с помощью этого метода cookie?