我们正在尝试使用Angular 1.5和新的组件路由器位构建一个应用程序。我们遇到了一个边缘情况,我们想知道是否有办法解决这个问题。
关键参与者
-
IdentityServer v2
:我们的客户端当前将此用于OAuth。它造成了这个问题的一部分。这是传统,我们无法控制它的使用。
-
角度JS 1.5
作为我们的前端框架。
-
新型角形路由器
,我相信现在被称为ngComponentRouter?我们认为这种风格将有助于我们在Angular v1.5和Angularv2之间架起桥梁,而且它很容易移植。
-
oauth-ng
作为OAuth隐式流的包装器。。
-
较旧的浏览器
:我们必须支持IE9+,这意味着我们不能使用Angular的HTML5模式。
目标
我们希望使用以下URL
http://mysite/#!/auth/#auth_token=xyz123
(不受我们控制的结构,例如无法删除第二个哈希)和:
-
将其放入实际的身份验证控制器
-
通过参数或直接通过
$location
.(在它到达控制器之前,它当前被清除)。
背景/问题
我们的客户端有一个中央登录系统,他们使用IdentityServer v2
#auth_token=xyz123
到您的重定向URL。当它认为你会有
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通常会导致错误/不一致的行为。
我们认为我们的选择是什么
-
使用全部捕获/未找到控制器
。如果我们让路线一直下降到
/**
,我们可以从中检索令牌值
$位置
这有点恶心;我们想避免它。
-
找到一种方法将完整的URL获取到控制器中
。我们可以捕获路由并将其发送到控制器,但此时URL不可用。
-
回到使用旧的路由器或ui路由器(我们现在不想这样做)。
任何能为我们指明正确方向的事情都将不胜感激!
