Хранить пользовательские роли в JWT для использования в React SPA?

Question

Я очень новичок в React и разделении разработки внешнего интерфейса и бэкэнда (ранее все мои приложения были связаны друг с другом, например, ASP. NET веб-сайт). В последнее время я создаю чистый React SPA в качестве моего внешнего интерфейса. NET CORE в качестве внутреннего бэкэнда, ADFS 4.0 в качестве моего сервера intr anet auth и мои роли пользователей надежно хранятся в OracleDB.

Мой текущий дизайн выглядит следующим образом:

1) Приложение React получит токен доступа из ADFS с заявками пользователей (используя реагирование)

2) Приложение React вызовет мой Базовый бэкэнд с токеном на предъявителя; backend будет обрабатывать JWT и проверять ADFS

3) При проверке подлинности роль пользователя будет извлечена из базы данных

4) Роль будет возвращена приложению React в виде JWT или объекта пользователя

Вопросы:

1) Должен ли я сохранить роль пользователя в совершенно новом JWT, который я создаю сам (и подписал его своими собственными сертификатами) из моего базового бэкэнда ( В основном мне нужна роль для маршрутизации, чтобы администратор мог получить доступ к функциям администратора, а обычные пользователи - нет). Я защищаю свои конечные точки Core с помощью атрибута Jwt Bearer, поэтому считаю, что я создам свой собственный токен Jwt для своего бэкэнда API.

2) Предположим, что я использую токен Jwt для хранения своей роли пользователя для мое приложение React для использования, должен ли я хранить JWT в sessionStorage, чтобы токен был удален вместе с сеансом, когда пользователь закроет веб-браузер? Учитывая, что сеанс будет уничтожен при закрытии браузера, я могу установить время экспозиции JWT на более длительный период, скажем, истечь в конце дня?

Answer 1

Вот рекомендации по обеспечению безупречной безопасности:

1. токен JWT всегда должен быть зашифрован и проверен только серверной службой.

2. Пользовательский интерфейс просто хранит токен с собой и отправляет его на сервер для каждого запроса.

3. Пользовательский интерфейс никогда не сможет расшифровать / понять содержимое (утверждения) токена.

Самый простой способ реализовать этот механизм - это интегрировать серверную часть с OpenID Connect сервисом, таким как Keycloak, Okta, OpenAM, ForgeRock, et c

Дополнительная информация:

https://scalac.io/user-authentication-keycloak-1/

https://developer.okta.com/code/react/

https://github.com/dasniko/keycloak-reactjs-demo

https://www.npmjs.com/package/react-keycloak

Answer 2

TL; DR Храните пользовательский объект в хранилище редуксов, сохраняйте JWT в cookie-файлах.

Если вы получаете пользовательский объект с вашего сервера, то сохраните этот пользовательский объект вместо JWT , Вы можете использовать Redux для хранения объекта пользователя, чтобы вы могли получить доступ к роли и другим атрибутам пользователя в любом компоненте, когда захотите. Кроме того, вам лучше хранить JWT в ваших куки. Есть хороший пакет реакции для этого https://www.npmjs.com/package/react-cookie

Если вы хотите, чтобы пользовательский сеанс завершился sh при закрытии браузера, то вы можете go с сеансами. Это дизайнерское решение. Но в настоящее время почти все сайты используют куки для хранения токенов.