angular - 使用 HashLocationStrategy 时，Angular 应用程序在 OAuth2 登录后无法重定向

Question

我正在开发一个现有的、生产中的 Angular 7 应用程序。我的任务是从本地身份验证方案迁移到现有的公司范围内的身份提供者。身份提供者符合 OAuth2。我正在使用 oidc-client 库来尝试完成此操作。

Angular 应用程序正在使用 HashLocationStrategy，我相当肯定这个要求不会改变。我不是这个应用程序的原作者，所以我不知道选择 HashLocationStrategy 而不是默认 PathLocationStrategy 的确切原因。现在，我宁愿不去更改为 PathLocationStrategy 的兔子洞。我可能会要求更多的麻烦。

身份提供者不允许在重定向 URI 中使用哈希字符，如 OAuth 2.0 规范中所述：https ://www.rfc-editor.org/rfc/rfc6749#section-3.1.2 （“端点 URI不得包括一个片段组件。”）。

对于开发，我希望成功登录后的重定向URI为“http://localhost:8080/#/dashboard”，但由于上述限制，我不能这样做。拥有身份提供者 API 的开发人员告诉我在重定向 URI 中编码哈希字符，例如：“http://localhost:8080/%23/dashboard”。我已经尝试过了，但是当我的应用程序遇到重定向时，它不会对其进行解码，因此我收到此错误：

无法获取 /%23/仪表板

从身份提供者返回到应用程序的登录后重定向 URL 如下所示：

http://localhost:8080/%23/dashboard?code=7d25a8af920d219631a15019fc243ca2&state=9821f4153a1b45d3b6ed9a6813bd70c9&session_state=5c59c99f31156aa805b7267f82b0aa8e499d3f81cf5caab0335595c6e397bbf8.8_QJpOLj75eOfarD091Snw

我的 authservice 的登录功能如下所示，为了调用登录页面：

  login() {
    const idSettings = {
      scope: 'openid',
      response_type: 'code',
      authority: this.baseUrl,
      client_id: this.clientId,
      redirect_uri: 'http://localhost:8080/%23/dashboard', // This is what the ID provider will allow.
    };
    this.userManager = new UserManager(idSettings); // oidc-client UserManager
    return this.userManager.signinRedirect();
  }

我的问题是：在尝试路由之前，我可以在 Angular 应用程序中监听一个事件来捕获和解码登录后重定向 URL 吗？如果是这样，我可以将 %23 转换为 # 并继续重定向。

或者，有没有办法可以暂时暂停对这条路线使用 HashLocationStrategy ？如果这是可能的，我也许可以使用“http://localhost:8080/dashboard”作为我的重定向 URI，并且仍然让它路由到正确的组件。

我一直在网上寻找，但到目前为止，我看到的所有 Angular 示例都使用 PathLocationStrategy 而不是 HashLocationStrategy。

我也在这里搜索过，没有发现和我一模一样的问题。所以我不认为这是一个重复的问题。

感谢您的任何建议。

更新：不管怎样，我永远无法解决这个问题，除非将应用程序从使用 HashLocationStrategy 更改为使用 PathLocationStrategy。所以，这就是我所做的。我对我们的源代码控制进行了更多研究，发现了对 HashLocationStrategy 进行更改的人员和时间，基于此，我猜测原作者没有意识到 Web 服务器上的某些配置是支持 PathLocationStrategy 所必需的，这（希望）是他选择使用 HashLocationStrategy 的唯一原因。我们将 webpack dev-server 用于我们的开发（localhost）Web 服务器，因此将“historyApiFallback: true”添加到 webpack.config.js 以支持重新加载相同的 URL 是一件相对简单的事情。当我可以访问使用 nginx 的登台和生产服务器时，

标签： angularoidc-clienthash-location-strategy