在运行 angular spa 之前等待 $http

Posted 2023-03-08

【中文标题】在运行 angular spa 之前等待 $http

【英文标题】：Waiting for $http before running angular spa

【发布时间】：2014-10-31 17:59:50

【问题描述】：

我有一个使用 JWT（json Web 令牌）来授权 api 的 SPA。问题是当他们登录后在浏览器上点击刷新时，我需要通过 ajax 请求验证令牌仍然有效，然后继续加载 SPA。我将它添加到 .run() 哪种工作方式中，但由于我的导航在登录后会发生变化，因此页面在验证令牌之前加载，并且看起来错误。我是 Angular 的新手，但猜猜这可以通过承诺来完成？

// handle refreshing browser
if ($window.sessionStorage.token && !AuthenticationService.isLogged()) 
    UserService.verify().success(function (data) 
        AuthenticationService.setLogged(true);
    ).error(function () 
         delete $window.sessionStorage.token;
         $state.transitionTo('app.login');
    );

【问题讨论】：

我相信你可以使用$routeProvider或$stateProvider的resolve属性；无论您使用哪个。它可以让你等到一个 promise 完成，然后再返回一个路由/状态的视图。

【参考方案1】：

我能够通过以下状态设置来完成这项工作：

$stateProvider
    .state('app', 
        abstract: true,
        url: '/',
        views: 
            root: 
                templateUrl: 'tpl/index.html'
            
        ,
        resolve: 
            User: ['$window', '$q', 'AuthenticationService', 'UserService' , function($window, $q, AuthenticationService, UserService) 
                if ($window.sessionStorage.token && !AuthenticationService.isLogged()) 
                    var d = $q.defer();
                    UserService.verify().success(function (data) 
                        AuthenticationService.setLogged(true);
                        d.resolve();
                    ).error(function () 
                        delete $window.sessionStorage.token;
                        d.resolve();
                    );
                    return d.promise;
                
            ]
        
    );