如何在使用angularJS的服務頭中的localstorage中傳遞值存儲？

Question

我有兩個api一個用於登錄，另一個用於註銷，並且在succcessfulll登錄時我得到acesstoken，並且基於acesstoken，我必須通過在頭中傳遞acesstoken來註銷。

所以對於註銷我做什麼，我存儲在localStorage的acesstoken值，並通過在頭，但我得到的錯誤

這裏是services.js「的accessToken無效」：

angular.module('server', []) 
.factory('api', function($http) { 
    var token = localStorage.AccessToken; 
    console.log(token); 
    var server = "http://myapi-nethealth.azurewebsites.net"; 
     return { 
      //Login 
      login : function(formdata) { 
       return $http({ 
        method: 'POST', 
        url: server + '/Users/Login', 
        data: $.param(formdata), 
        headers: { 'Content-Type' : 'application/x-www-form-urlencoded'}, 
       }); 
      }, 
      logout : function() { 
       return $http({ 
        method: 'POST', 
        url: server + '/Users/Me/Logout', 
        headers: { 'Content-Type' : 'application/x-www-form-urlencoded', 'Authorization' : 'token ' + token}, 

        /*headers: { 'Content-Type' : 'application/json', 'Authorization' : 'token ' + token},*/ 
       }).success(function (data, status, headers, config){ 
        alert(JSON.stringify(status)); 
       }); 
      } 
     }; 

    }); 

//Controller.js ..

ctrl.controller('logout', function($scope, $window, $state, api) { 
    $scope.logout = function() { 
     api.logout() 
      .success(function(data) { 
       console.log(data); 
       $scope.response = data; 
       $state.go('home'); 
       }) 
      .error(function(data) { 
       console.log(data); 
       $scope.response = data; 
      }); 
    } 
}); 
ctrl.controller('search', function($scope, $state) { 
       $scope.search = function() { 
      $state.go('clinic-list'); 
      }; 

    }); 
ctrl.controller('clinicCtrl', function($scope, $state, $window, api) { 
    $scope.formData = {}; 
    $scope.clinicCtrl = function() { 
    /*$scope.loading = true;*/ 
     api.login($scope.formData) 
      .success(function(data, status) { 
       console.log(data); 
       $scope.response = data; 
       if (data.hasOwnProperty('AccessToken') && data.AccessToken.length > 5) { 
        $state.go('home'); 
        window.localStorage['AccessToken'] = angular.toJson(data.AccessToken); 
        var accessData = window.localStorage['AccessToken']; 
        console.log(accessData); 
        } else { 

         $state.go('login'); 
        } 
       /*$scope.loading = false;*/ 
      }) 
      .error(function(data) { 
       console.log(data); 
       $scope.response = data; 
       $window.alert($scope.response.Message); 
       console.log($scope.response.Message); 
     }); 
    } 

}); 

請告訴我，我怎麼能做到這一點....

Answer 1

angular.module('server', []).factory('authInterceptor',function($q,$location) { 
    return { 
     request: function(config) { 
      config.headers = config.headers || {}; 
      if(localStorage.AccessToken) { 
       config.headers.AccessToken = localStorage.AccessToken; 
      } 
      config.headers.requestResourse = $location.$$url; 
      return config; 
     }, 
     responseError: function(response) {    
      return $q.reject(response); 
     } 
    } 
}).config(function($httpProvider) { 
     $httpProvider.interceptors.push('authInterceptor'); 
    })..factory('api', function($http) { 
var token = localStorage.AccessToken; 
console.log(token); 
var server = "http://myapi-nethealth.azurewebsites.net"; 
    return { 
     //Login 
     login : function(formdata) { 
      return $http({ 
       method: 'POST', 
       url: server + '/Users/Login', 
       data: $.param(formdata), 
       headers: { 'Content-Type' : 'application/x-www-form-urlencoded'}, 
      }); 
     },............... 

這將令牌附加到所有請求，U獲得效應初探後，你可以重新設置令牌控制器:) 根據你的變量