连接/授权/回调无法从 Angular 父应用程序验证 Angular 子应用程序的用户 - IdentityServer4 SSO

Question

我们使用 IdentityServer4 在父 MVC 应用程序和客户端 Angular 应用程序之间建立了有效的 SSO。 我们想要将父 MVC 应用程序迁移到 Angular [端口：4200]，我就是这么做的。登录机制适用于父应用程序，但它无法授权子应用程序 [端口：4202]。

端口：44308是AuthIssuer IdentityServer4

当我启动子应用程序时 => 它会将我带到父角度应用程序登录页面，其中 ReturnUrl 为 http://localhost:4200/login?ReturnUrl=https:%2F%2Flocalhost:44308%2Fconnect%2Fauthorize%2Fcallback%3Fresponse_type%3Dcode%26client_id%3DMyApp-client%26state%3DclE1U3VPRnpRfnZmOGdCbFVQelh2ZF9oVU81TUpIOEluREVGZENjRk ZIWmd1%26redirect_uri%3Dhttp%253A%252F%252Flocalhost %253A4202%252Findex.html%26scope%3Dopenid%2520profile%2520MuApp.api%26code_challenge%3DYJzQ_Afi5Ldd4pjNvXOlVipMTh8--zzcDq6ip9LOKgY%26code_challenge_method%3DS256%26nonce%3DclE1U3VPR npRfnZmOGdCbFVQelh2ZF9oVU81TupIOEluREVGZENjRkZIWmd1

我在父应用程序上执行登录并重定向到 ReturnUrl（我完成了解析和所有操作）， 通过 window.localtion.href= returnUrl; 但我在 Web api 控制台中收到“用户未经过身份验证”消息。我被扔回到登录页面。预计会将我带到redirectUrI中提到的子应用程序的索引页面

我真的陷入困境，不明白如何验证子应用程序。

当我调试旧的 MVC 应用程序时，我从登录控制器看到，它正在执行 Redirect(model.ReturnUrl) ，这与上面的 ReturnUrl 类似。 [我也使用 window.location 对父角度应用程序执行了相同的操作] 从这里开始，它会进行身份验证，然后重定向到子应用程序的 index.html，登录参数如下：（4202 是子应用程序） http://localhost:4202/index.html?code=3C5A72C8AA7BACC3E24C236FC347F36E55BA1D15A62B8B91F8F0EE57D0FB5B17&scope=openid%20profile%20MyAPP.api&state=ZktubWVxR2xlSDNuZVIzc3I2cHU0fi5vZUpDUU1 MVUpqaEtVSVJ1ZEFsd0Fu&session_state=r2rsCHhkiNNw8V8xUW84M_yzxbaPefV6cxU6E3AT9kw.DF08ACCBE8165BC00909A453EEFB005D

非常感谢任何帮助。 我到处都看到当人们使用identityServer4进行SSO时，登录机制是在MVC中。找不到任何与Angular相关的内容。

我从 window.location.href = this returnUrl 调用了连接/授权/回调？.....这里用户没有得到身份验证。 不知道如何处理来自角度的回调。

我可以确认redirectUri和所有条目都在数据库中正确映射，因为使用了相同的clientId，而子项的迁移和端口号也相同。它适用于旧的MVC应用程序，而不适用于新的角度应用程序

Answer 1

您的问题与第 3 方 Cookie 限制有关。

localhost:4200

和

localhost:4202

是完全不同的域，因此它们无法访问其 cookie。

当您登录时，身份验证服务器将 cookie 专门设置为 localhost:4202。然后，当您导航到子应用程序 -

localhost:4200

- 时，它无法读取身份验证 cookie，因为它在完全不同的域中工作。

有两种不同的选项可以解决这个问题。

1。在您的浏览器中允许第 3 方 cookie

铬：

1. 打开 Chrome。
2. 点击右上角的更多，然后点击设置
3. 单击隐私和安全，然后单击第三方 cookie。
4. 选择一个选项：允许第三方 cookie

参考：Chrome 文档

2。让它们在同一个域中运行以便能够让它们 阅读彼此的cookie。

您可以简单地构建一个反向代理，使它们在同一个域中运行。它需要是这样的；

反向代理：

localhost:4200

家长应用程序：

localhost:4201

子应用程序：

localhost:4202/child

（您还需要配置基本引用）

反向代理应该执行以下操作；

• 从

  /child/*

  导航至

  localhost:4201/child/*

• 剩下的就是

  localhost:4200/*

如果您将两个应用程序部署在不同的域中，则会出现相同的问题。他们必须在同一域中工作。