使用ui-router-ng2的通配符路由?

时间:2017-02-24 17:07:15

标签: angular angular-ui-router auth0

我正在尝试将ui-router-ng2与Auth0一起使用,Auth0是一种身份验证即服务提供商。问题是登录后Auth0将用户重定向到一个如下所示的URL:

http://localhost:3000/#access_token=alCUyTW2WKLkV8Fq& {等...}

我已经尝试更改该重定向网址,因此它会命中一个组件,但使用auth0似乎不可能。

使用ui-router 1,可以添加一个http拦截来处理这个问题,但此时角度2中没有http拦截功能。

当使用带有角度2默认路由器的auth0时,重定向的处理方式如下:

  this
    .router
    .events
    .filter(event => event.constructor.name === 'NavigationStart')
    .filter(event => (/access_token|id_token|error/).test(event.url))
    .subscribe(() => {
      this.lock.resumeAuth(window.location.hash, (error, authResult) => {
        if (error) return console.log(error);
        localStorage.setItem('id_token', authResult.idToken);
        this.router.navigate(['/']);
      });

我已经浏览了ui-router-ng2文档,但没有办法做类似的事情。

有什么想法吗?

1 个答案:

答案 0 :(得分:0)

我通过在我的应用程序的根组件中执行以下操作来解决此问题:

export class AppComponent {

  constructor() {
    console.log("App root component created");

    // Auth0 doesn't redirect properly to /#/ URLs so we have to capture token here 
    var regex = /(id_token=)([^&]*)/;
    var vals = regex.exec(window.location.hash);
    if (vals != null) {
      localStorage.setItem('id_token', vals[2]);
      if(localStorage.getItem('preAuthURL') != null) { window.location.href = localStorage.getItem('preAuthURL');}
    }

  }
}