重定向到新的 SPA 页面时在标头中传递身份验证令牌

Question

假设这些：

       A -----------------------> B
(Sender website)          (Angular website)

我们实现了一个普通的 Angular SPA (B)，它的 index.html 和其他资源只是托管在 IIS 中，并且有一个简单的重写规则来处理 Angular 中的路由。Angular 中的用户需要登录并获得 JWT 令牌，并将其存储在浏览器存储中。

有一个网站(A)想要将用户重定向到 Angular 网站，但我们也希望将 JWT 令牌从 A 传递到 B，因为令牌是相同的，并且我们希望防止用户再次登录。

网站 A 可以在重定向到 B 时在post 请求标头中发送令牌。问题是 JS (Angular) 无法直接获取标头参数，因为它们正在发送到 IIS。

问题：

IIS中有没有一种方法，我们可以从请求中获取令牌，并在检索index.html时将其设置在html属性中？这样，JS 就可以检查它的 html 元素并找到令牌。
上述技术正确吗？如果没有，您能给出您的建议吗？

Answer 1

我对此的思考过程是使用查询参数或路由参数将用户重定向到角度页面。它同样安全/不安全，因为任何人都可以看到标头值（如果您担心将 JWT 暴露给最终用户）。

我会让你的登录页面接受 JWT（或者你的页面被重定向到的任何内容）

然后，在您的登录页面中，您可以从 url 中获取该 JWT 令牌

const jwt = ActivatedRoute.snapshot.queryParamMap.get('jwt');

现在，您可以将该值放入localStorage：

localStorage.setItem('jwt', jwt);

然后，在 Angular 中，只需创建一个HttpInterceptor从 localStorage 获取 JWT 令牌并将其应用于每个请求的标头：

const jwt = localStorage.getItem('jwt');
const request = req.clone({ withCredentials: true, headers: jwt });

您可以将此视为与您注册某些服务时相同的事情，他们通过电子邮件向您发送链接以确认您的电子邮件。您点击的链接将带您返回他们的网站，并带有电子邮件确认令牌。当您使用该令牌访问该网站时，它会根据该令牌知道您是谁。

Answer 2

仅靠 IIS 无法实现这一目标，最后我们编写了一个简单的 Node.js 应用程序作为后端，当您调用它时，它会加载 Angular 文件。

站点 A 通过 Post 请求在标头中将令牌传递给站点 B（托管 Node.js 后端）。然后节点应用程序返回 cookie 中的令牌。因此，当角度应用程序加载时，它会从 cookie 中读取令牌。

最后我们将Node应用程序放入IIS中。

希望它能帮助其他人。