如何处理路由中的额外哈希？ （AngularJS 1.5 +新/组件路由器）

Question

我们正在尝试使用Angular 1.5和新的组件路由器位构建应用程序。我们遇到了一些边缘情况，我们想知道是否有任何解决方法。

主要玩家

• IdentityServer v2 ：我们的客户目前将此用于OAuth。它导致了这个问题的一部分。这是遗产，我们无法控制其使用。
• AngularJS 1.5 作为我们的前端框架。
• 新的角度路由器，现在我相信ngComponentRouter？我们认为这种风格可以帮助我们在Angular v1.5和Angular v2之间架起桥梁，并且很容易移植。
• oauth-ng 作为OAuth隐式流程的包装器..
• 较旧的浏览器：从某种意义上说，我们必须支持IE9 +，这意味着我们无法使用Angular的HTML5模式。

目标

我们想要使用http://mysite/#!/auth/#auth_token=xyz123之类的网址（不受我们控制的结构，例如无法移除第二个哈希）和：

• 将其置于实际的身份验证控制器
• 通过参数或直接通过$location提供auth_token值。 （它现在在它到达控制器之前被擦洗了。）

背景/问题

我们的客户端有一个中央登录系统，他们使用的是IdentityServer v2。据我所知，当我们从IdSrv v2请求令牌时，它会通过将#auth_token=xyz123附加到您的重定向网址来做出响应。当它认为你有my.com/login.html时会被写回来，从而产生login.html#auth_token=xyz123。

对于已经使用哈希的Angular应用程序，它会成为一个问题，因为URL最终会沿着mysite.com/#/auth#auth_token=xyz123行。

正如您所料，这让Angular感到愤怒。我们还能找到一种方法让它在组件路由器下工作。

如何使用较旧的路由器

根据oauth-ng docs，如果我们使用未启用html5的旧路由器，我们会执行以下操作：

angular.module('app').config(function ($routeProvider) {
  $routeProvider
    .when('/access_token=:accessToken', {
      template: '',
      controller: function ($location, AccessToken) {
        var hash = $location.path().substr(1);
        AccessToken.setTokenFromString(hash);
        $location.path('/');
        $location.replace();
      }
    })

我们尝试过什么

• 以类似方式定义组件路由。这不起作用，因为/access_token=:accessToken包含=，组件路由器似乎不允许。
• 看看我们是否可以通过IdentityServer v2来更改响应的格式。看起来似乎不太可能;响应似乎是硬编码到[URL we define]#auth_token=xyz123。
• 使用其他哈希等伪造URL。通常会出现不良/不一致的行为。

我们认为我们的选择

• 使用全能/未找到控制器。如果我们让路线一直落到/**，我们就可以从$location检索令牌值。虽然这有点严重;我们想避免它。
• 找到一种将完整网址放入控制器的方法。我们可以捕获路径并将其传递给控制器​​，但此时URL不可用。
• 返回使用较旧的路由器或ui-router（此时我们不想这样做）。

任何能够指引我们朝着正确方向发展的事情都将非常感激！

Answer 1

为了跟进这一点：最后，我们认为这是一个奇怪的边缘案例，因此需要返回ui-router。

虽然我们认为组件路由器最有意义，但不幸的是，这里的决定因素是我们没有100％控制我们的路由。路由约束包括边缘情况组件路由器似乎无法在当前处理。

对于那些使用较旧的oauth服务器系统的人，我希望这可以作为警告/一些背景，因为您选择了路由器。

希望ngComponentRouter将来会更好地支持这种边缘情况，但我不会责怪他们将其遗漏。