Question

我在AngularJS中使用ui-router开发了一个前端。要从后端使用REST API，我需要获得OAuth2访问令牌（隐式授权）。

我的问题在于OAuth舞蹈的最后一步，当我从网址中的身份验证服务器获取访问令牌时

mydomain.com/home/#access_token=hdzjkdnba89fenbjkéz38U0D903ç&...

显然，

mydomain.com/home是重定向URI。

重定向后只需几分之一秒，AngularJS会更改类似

的URL

mydomain.com/#/my-default-view

因此，访问令牌将从URL中删除。

现在有一些事情：

我不允许为OAuth2客户端定义包含哈希（'＃'）的重定向URI。因此mydomain.com/#/auth-complete/之类的内容
我使用$routeProvider.otherwise('/')。
我尝试设置$locationProvider.html5Mode(true);以删除中间的'＃'，但问题是相同的（重定向后URL和访问令牌会立即删除）。
由于即使在Angular修改了URL后，仍然可以在HTTP响应中访问访问令牌，我可能会使用$http拦截器，但这对于这个常见任务来说听起来有点太多了不是吗？

有什么建议吗？

Answer 1

这个适用于Google，作为客户端应用程序的OAuth2提供程序：

$urlRouterProvider.otherwise('/');

$stateProvider.state('access_token', {
    url: '/access_token={accessToken}&token_type={tokenType}&expires_in={expiresIn}',
    template: '',
    controller: function($stateParams) {
        var token = $stateParams.accessToken;
        // do something usefull with token
    }
})

Answer 2

我不再使用ui-router，但对于那些仍需要解决方法的人，您只需要在正则表达式中捕获令牌。从the documentation开始，您可以执行类似

的操作

.state('oauth.token', {
        url: "/o/#{authToken:[0-9a-zA-Z]+}",
        ...
 })

并在authToken中获取您的访问令牌。

AngularJS ui-router与OAuth2 access_token冲突

2 个答案: