Question

我尝试通过令牌验证用户身份。如果我登录，则会创建令牌并将其存储在本地存储中。只要路线发生变化，我就会遇到快速js中构建的api，给出解码后的用户值。一切都有效，没有重新压缩页面。刷新页面后，我无法点击API。为了获得解码的用户值，我想点击登录按钮，这是在标题中，这会触发路线更改，然后一切正常。请帮帮我。

.controller('mainController', function($rootScope, $location, $window ,Auth){

        var vm = this;
        $rootScope.loggedIn = Auth.isLoggedIn();
        $rootScope.$on('$locationChangeStart', function(){
          $rootScope.loggedIn = Auth.isLoggedIn();
            Auth.getUser()
                .then(function(data){
                    $rootScope.user = data.data;
                });
        });

        vm.login = function(){
        ......
        }

        vm.logout = function(){
        ......
        }
})

服务

.factory('Auth', function($http, $q, AuthToken){
    var authFactory = {};

    authFactory.login = function(username, password){

        return $http.post('/api/login', {
            username: username,
            password: password
        })
        .success(function(data){
            AuthToken.setToken(data.token);
            return data;
        });
    };

    authFactory.logout = function(){
        AuthToken.setToken();
    };

    authFactory.isLoggedIn = function(){
        if(AuthToken.getToken()){
            return true;
        } else {
            return false;
        }
    };

    authFactory.getUser = function(){
        if(AuthToken.getToken()){
            return $http.get('/api/me');
        } else {
            return $q.reject({ message: "User has no token"});
        }
    };

    return authFactory;
})

用于设置令牌和拦截器代码的工厂

.factory('AuthToken', function($window){
    var authTokenFactory = {};

    authTokenFactory.getToken = function(){
        return $window.localStorage.getItem('token');
    };

    authTokenFactory.setToken = function(token){

        if(token){
            $window.localStorage.setItem('token', token);
        } else {
            $window.localStorage.removeItem('token');
        }
    };

    return authTokenFactory;
})

.factory('AuthInterceptor', function($q, $location, AuthToken){
    var interceptorFactory = {};

    interceptorFactory.request = function(config){
        var token = AuthToken.getToken();

        if(token){
            config.headers['x-access-token'] = token;
        }

        return config;
    };

    interceptorFactory.responseError = function(response){
        if(response.status == 403){
            $location.path('/login');
        }
        return $q.reject(response);
    };

    return interceptorFactory;

});

Answer 1

可能需要在刷新时重置$ http默认标头。在我的情况下使用cookies，我在$ on（＆＃39; $ stateChangeStart＆＃39;）的开头打电话给以下函数：

service.RefreshGlobalVars = function () {
    if ($http.defaults.headers.common.RefreshToken == null) {
        $http.defaults.headers.common.Authorization = "Bearer " + $cookieStore.get('_Token');
        $http.defaults.headers.common.RefreshToken = $cookieStore.get('_RefreshToken');
    }
   };

编辑 - 澄清，因为我还没有看到你的setToken（）函数，你的实现可能会有所不同，但这几乎是它的主旨。

Answer 2

我得到了答案，通过检查主app.js中的路线变化，在运行区内进行了解决。

MyApp.run(function ($rootScope, $location, Auth){

  $rootScope.loggedIn = Auth.isLoggedIn();
    $rootScope.$on('$locationChangeStart', function(){
      $rootScope.loggedIn = Auth.isLoggedIn();
        Auth.getUser()
            .then(function(data){
                $rootScope.user = data.data;
            });
    });

重新加载页面

2 个答案: