要求ごとにAuthorizationヘッダーにJson Webトークンを渡し、ローカルストレージに格納します。ユーザーが「ログアウト」をクリックすると、ローカルストレージ内のトークンが削除され、コンソールにもトークンが記録され、Nullと表示されます。しかし、次のリクエストでは、Authorizationヘッダーは削除されてもJson Webトークンを使用します。ブラウザ上のリフレッシュボタンを押すまでは有効にならず、リクエストは更新された値を使用して開始されます。私はAngular.jsでシングルページアプリケーションを構築しています。ローカルストレージから削除されたJson Webトークンを依然として使用している承認ヘッダー
これは私は、ローカルストレージを設定しています方法である：
User.authUser($scope.credentials).then(function(res) {
console.log(res);
if(res.success === true){
console.log('User is authenticated!');
localStorage.setItem('jwt', JSON.stringify(res.token));
} else {
console.log('User is NOT authenticated.');
}
});
これは私がAuthorizationヘッダを設定し、ローカル・ストレージを削除しています方法である：私は上記の方法を使用して各ページに
angular.module('App.user', [])
.factory('User', function($http, $location, $state, $window) {
var jwt = localStorage.getItem('jwt');
$http.defaults.headers.common.Authorization = JSON.parse(jwt);
var apiUrl = 'http://localhost:8080/api';
return {
authUser: function(credentials) {
return $http.post(apiUrl + '/authenticate', credentials).then(function(res){
return res.data;
});
},
getMe: function() {
return $http.get(apiUrl + '/users/me').then(function(res) {
return res.data;
});
},
logOut: function(){
console.log('Logging user out');
localStorage.removeItem('jwt');
$state.go('home');
}
};
});
ユーザーが有効かどうかを確認するためのUser.getMe（）。だから問題の1つは、ユーザーが自分のプロフィールにログインした後にログアウト（ストレージを削除）した場合、ホームページにリダイレクトされますが、ホームページでは "User.getMe（）"を使用してユーザーがログインし、Authorizationヘッダーは引き続き古いJWTを使用しているため、ユーザーがログインしていると表示されます。これは、手動でページを更新するときにのみ機能します。
私は何時間も見つけられず、何も見つかりませんでした。コンソールにlocalstorageから 'jwt'を記録すると、nullと表示されますが、Chromeのデベロッパーツールでリクエストを確認すると、依然として古いjsonウェブトークンをリクエストが使用されていることがわかります。
私はおそらくページがキャッシュされていると思っていたので、キャッシュをオフにしようとしましたが、それは助けになりませんでした。
ご協力いただきましてありがとうございます。
'$ httpProvider.interceptors'にプッシュされるファクトリを作成しません。 $ http docsの "interceptors"セクションを参照してください – charlietfl
今後はあなたはより専門的なレベル – charlietfl