防止AngularJS中的路线更改

时间:2014-07-03 11:07:23

标签: ajax angularjs angular-ui-router

    $rootScope.$on("$locationChangeStart", function(event, next, current) {

            var partsOfUrl = next.split('/');
            var isLogin = false;
            if(partsOfUrl.indexOf("signin") > 0) {
                isLogin = true;
            }

            var myDataPromise = loginService.getData();

            myDataPromise.then(function(data) {  // this is only run after $http completes
                if(!isLogin) {
                    if(data.logout) {
                        $location.url("pages/signin");
                        event.preventDefault();
                    } else{}
                } else {
                    if(data.logout) {
                    } else {
                    }
                }
            });
            console.log(next);

        });

这是我用来检查用户身份验证并阻止受保护区域的代码。但问题是,如果用户尝试访问受保护,则浏览器立即显示安全页面,然后返回登录页面,而不是首先重定向到登录页面。我认为,由于用户身份验证过程是通过Ajax调用完成的,因此程序永远不会保留响应。这里有什么不对,怎么摆脱它?

1 个答案:

答案 0 :(得分:1)

尝试使用httpInterceptor(来自mean.io堆栈) 顺便说一句,服务器应该以401状态响应

'use strict';

angular.module('mean-factory-interceptor',[])
    .factory('httpInterceptor', ['$q','$location',function ($q,$location) {
        return {
            'response': function(response) {
                if (response.status === 401) {
                    $location.path('/signin');
                    return $q.reject(response);
                }
                return response || $q.when(response);
            },

            'responseError': function(rejection) {

                if (rejection.status === 401) {
                    $location.url('/signin');
                    return $q.reject(rejection);
                }
                return $q.reject(rejection);
            }

        };
    }
    ])
    //Http Intercpetor to check auth failures for xhr requests
    .config(['$httpProvider',function($httpProvider) {
        $httpProvider.interceptors.push('httpInterceptor');
    }]);