UI路由器StateChange事件经过，即使重定向 [英] ui-router StateChange event go through even with redirection

问题描述

我的深化发展提供的OAuth应用程序，使用AngularJS和UI路由器。
对于每一个状态变化，我做以下检查：

I am developping an OAuth Provider application, using AngularJS and ui-router. For each state change, I do the following check:

1. 如果用户已经登录：
   1.1如果用户不是管理员 - >重定向他到callBackUrl
   1.2如果用户是管理员，什么也不做

1. If the user is already logged in: 1.1 If the user is not an admin -> redirect him to the callBackUrl 1.2 If the user is an admin, do nothing

如果用户没有登录：
2.1如果用户试图访问一个管理页面 - >重定向他回到登录
2.2如果没有，什么也不做

If the user is not logged in: 2.1 If the user tries to access an admin page -> redirect him back to login 2.2 If not, do nothing

我的UI路由器运行的方法如下：

my ui-router run method is the following:

.run(function ($rootScope, $state, $auth, accountService, $window, $stateParams) {
    $rootScope.$on('$stateChangeStart', function (e, toState, toParams, fromState, fromParams) {
        accountService.getUser({ token: $auth.getToken() }).$promise
            .then(function (response) {
                if (response.isAdmin === false) {
                    e.preventDefault();
                    $window.location.href = $stateParams.callBackUrl;
                    return;
                }
            })
            .catch(function (response) {
                if (toState.name.split(".")[0] === 'admin') {
                    e.preventDefault();
                    $state.go('root.login');
                }
            });
    });
});

一切都只是我的地方使用redirectthe用户回调URL部分确定$窗口

Everything is OK except for the part where I redirectthe user to the callback URL using $window

$window.location.href = $stateParams.callBackUrl;

此重定向需要2-3秒，在此期间我的用户可以看到他正试图在我的应用程序访问该页面。我想用preventDefault（）会解决，但事实并非如此。你知道我怎么能保持$ statechangeevent使用户直接重定向到回调URL？

This redirection takes 2-3 seconds, and in the meantime my user can see the page he is trying to access on my application. I thought the use of preventDefault() would solve that but it doesn't. Do you know how I could hold the $statechangeevent so that the user is redirected directly to the callback URL?

感谢

推荐答案

我把这种方式：

上面的方法让用户的一切，直到他是不是真的被证明是联合国认证。为什么？因为code为呼叫服务和一旦数据被接收评估所有的东西。同时 - 我们相信用户

The above approach allows user everything, until he is not really proven to be UN-authenticated. Why that? Because the code is calling service and evaluating all the stuff once the data are received. Meanwhile - we trust the user.

所以，我建议改变做法

永远不要相信用户。他/她必须做的最好证明他/她是正确的，得到的地方... （当然，那种认为...）的

NEVER trust the user. He/she must to do the best to prove he/she is the right one, to get somewhere ... (well, kind of that...)

我描述了一种可能的方式的（带工作的例子）的位置：

I described one possible way (with working example) here:

混淆$ locationChangeSuccess和$ stateChangeStart

只是一张code的举

钍的第一部分中的 $ rootScope在$（'$ stateChangeStart，... ：

    // if already authenticated...
    var isAuthenticated = userService.isAuthenticated();
    // any public action is allowed
    var isPublicAction = angular.isObject(toState.data)
                       && toState.data.isPublic === true;    


    // here - user has already proved that he is the one
    // or the target is public (e.g. login page)
    // let him go, get out of this check

    if (isPublicAction || isAuthenticated) {
      return;
    }

第二部分，用户不被信任，他需要获得私人的东西。

The second part, user is not trusted, he requires access to private stuff

    // now - stop everything
    // NO navigation
    // we have to be sure who user is, to continue

    // stop state change
    event.preventDefault();

    // async load user 
    userService
       .getAuthObject()
       .then(function (user) {

          var isAuthenticated = user.isAuthenticated === true;

          if (isAuthenticated) {
            // let's continue, use is allowed
            $state.go(toState, toParams)
            return;
          }    
          // log on / sign in...
          $state.go("login");
       })

检查，在行动上，这里

这篇关于UI路由器StateChange事件经过，即使重定向的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！