等待AngularJS $ http中的响应

时间:2016-02-15 13:03:08

标签: javascript angularjs promise deferred

好的,所以我很确定我已多次找到答案 - 我只是不理解。

构建单个页面应用程序,在每个$routeChangeStart上检查用户是否已登录。如果用户未登录,则重定向到登录页面。 我的问题是configService.isLoggedIn()正在使用$http,这意味着它是异步的,其余的代码不会等待它被解决。

所以简而言之:在继续使用任何其他代码之前,我需要解析isLoggedIn()函数。

我在$q.defer()上看到过很多,但我无法绕过它。

提前致谢。

app.service('configService', ['$http', '$q', '$location', '$rootScope', function ($http, $q, $location, $rootScope) {
    var self = this;

    this.isLoggedIn = function () {
        $http.get('/internalAPI.php?fn=login').then(function (result) {
            if (result.data.isLoggedIn === true) {
                $rootScope.isLoggedIn = true;
            }
            else {
                $rootScope.isLoggedIn = false;
            }
        }, function() {
            $rootScope.isLoggedIn = false;
        });
        return $rootScope.isLoggedIn;
    }
}]);

app.service('navigationService', ['$rootScope', '$location', '$timeout', 'configService', function ($rootScope, $location, $timeout, configService) {

    var self = this;

    $rootScope.$on('$routeChangeStart', function (event, next, current) {
        if (configService.isLoggedIn() !== true) {
            // no logged in user, redirect to /login
            if (next.templateUrl != "resources/views/login.php") {
                $location.path("/login");
                $rootScope.subTitle = 'Login';
            }
        //user is logged in but is trying to view the login page, redirect
        } else if (next.templateUrl == 'resources/views/login.php') {
            $location.path('/');
        }

2 个答案:

答案 0 :(得分:1)

您可以从函数返回promise并对此promise对象进行操作。根据{{​​3}},<cfset doc = XmlParse(xmlResults)> <cfloop index="node" array="#XmlSearch(doc, '//item')#"> <p> #node.title.xmlText# </p> </cfloop> 对象基于Angular $http documentation

$http

答案 1 :(得分:0)

非常感谢。寻找Rene M.提到的关于构建拦截器并让服务器端脚本处理身份验证的方法。

绝对可以解决问题,如果返回403状态,则将用户重定向到登录页面并更新isLoggedIn变量。重构代码以删除rootScope的使用,这是一个肮脏的解决方法,直到我得到了整个角度认证方式的挂起。

附上一个简单的例子,以防将来有人偶然发现这一点。

app.config(['$routeProvider', '$locationProvider', '$httpProvider', function ($routeProvider, $locationProvider, $httpProvider) {
    $httpProvider.interceptors.push('responseObserver');

app.factory('responseObserver', ['$location', '$q', function ($location, $q) {
    return {
        'responseError': function (errorResponse) {
            switch (errorResponse.status) {
            case 403:
                //Place logic here
                break;
            case 500:
                //Place logic here
                break;
            }
            return $q.reject(errorResponse);
        }
    };
}]);