运行角温泉前等待$ HTTP [英] Waiting for $http before running angular spa

问题描述

我在使用智威汤逊（JSON网络令牌）授权的API一个SPA。问题是，当他们击中刷新浏览器被记录后，我需要验证令牌仍然是通过Ajax请求有效，然后继续加载SPA。我已将此添加哪种作品，但因为我的导航的变化，如果他们登录，令牌之前加载页面的验证。运行（），看起来是错误的。我是新来的角，但猜测这可能与承诺做什么？

  //处理耳目一新的浏览器
如果（$ window.sessionStorage.token＆放大器;＆放大器;！AuthenticationService.isLogged（））{
    UserService.verify（）。成功（功能（数据）{
        AuthenticationService.setLogged（真）;
    }）错误（函数（）{
         删除$ window.sessionStorage.token;
         $ state.transitionTo（'app.login'）;
    }）;
}
 

解决方案

我能获得与以下国家建立这方面的工作：

  $ stateProvider
    .STATE（'应用'，{
        摘要：真实，
        网址：'/'，
        观点：{
            根： {
                templateUrl：TPL / index.html的
            }
        }，
        解析：{
            网友：['$窗口'，'$ Q'，'的AuthenticationService'，'UserService'，函数（$窗口，$ Q的AuthenticationService，UserService）{
                如果（$ window.sessionStorage.token＆放大器;＆放大器;！AuthenticationService.isLogged（））{
                    变种D = $ q.defer（）;
                    UserService.verify（）。成功（功能（数据）{
                        AuthenticationService.setLogged（真）;
                        d.resolve（）;
                    }）错误（函数（）{
                        删除$ window.sessionStorage.token;
                        d.resolve（）;
                    }）;
                    返回d.promise;
                }
            }]
        }
    }）;
 

I have a SPA using JWT (json web tokens) for authorization to the api. The problem is when they hit refresh on the browser after being logged in I need to verify the token is still valid via an ajax request and then continue loading the SPA. I added this to the .run() which kind of works, but since my navigation changes if they are logged in, the page loads before the token is verified, and looks wrong. I'm new to angular, but guess this could be done with a promise?

// 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');
    });
}

解决方案

I was able to get this working with the following state setup:

$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;
                }
            }]
        }
    });

这篇关于运行角温泉前等待$ HTTP的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！