reactjs - 如何使用 .net core api 保护 react.js spa

Question

我正在尝试使用 adal 登录保护 react.js spa 应用程序并使用 .net core wepApi 进行身份验证。

我能够从 react SPA 调用的 azure 中获取 JWT（使用 react-adal 模块）并检索基本用户信息。

现在快乐开始了 由于大多数 MSFT 示例都是基于他们的 mvc 方法，他们在 webconfig 文件中有一个密码来签署令牌，前端应用程序无法访问该密码。

那么我如何使用密码签署 JWT 令牌而不将其推送到 SPA 应用程序，因为它可以在 Web 控制台中读取？

我的一个想法是在 SPA 中启动登录，然后使用 webapi 端点作为重定向链接（并在状态字段中提供连接 ID），然后通过 ajax 我可以在 SPA 上进行重定向，但仍然没有签名智威汤逊。

标签： reactjsazure-active-directoryadaladal.js

Answer 1

我目前的部分解决方案是：

1. react-adal用于验证用户是否已登录
2. 当没有令牌时，然后进行react-adal身份验证，但是当我抓取令牌并将其存储在数据库中时，重定向位于特殊页面上。这里的诀窍是：需要更改hash为query-string以获取令牌服务器端（因为所有在 # 之后不会转发到 Web 服务器），所以一个简单的 javascrip 替换#并?重定向到另一个端点。
3. 然后重定向到主应用程序

由于 URL 仅用于重定向（在 adal login 之后） - 这是一个典型的man-in-the-middle场景，但可以生成自己的令牌。