У меня есть служба входа в систему, которая обрабатывает начальное создание JWT, и я получаю пользовательские данные просто отлично из полезной нагрузки.JWT Exists Check - Где это делать?
Проблема, с которой я столкнулась, где я могу поместить код для проверки, чтобы убедиться, что JWT существует и действителен при каждой смене страницы? У меня уже есть служба Auth с функцией под названием isAuthed
, и я просто хочу проверить, чтобы она не была ложной.
Моя первоначальная идея заключалась в том, чтобы поместить этот код в App.run
, но мне не повезло с ним.
if (authSvc.getToken() === undefined || !authSvc.isAuthed(authSvc.getToken())) {
$window.location.href = "http://localhost:3000/#/login";
else {
// Continue to run the rest of the .run function.
}
Первая проверка условного вызова вызывает функцию, которая вытаскивает JWT из локального хранилища. Итак, мы хотим убедиться, что это не определено. Следующая проверка - проверить, действительно ли этот токен. Если какое-либо из этих условий выходит из строя, перенаправляйте пользователя обратно на страницу входа.
То, что я пытаюсь сделать, это убедиться, что если кто-то ударит что-то вроде localhost:3000/#/app/dashboard
, что они будут отброшены назад на страницу входа в систему.
Должен ли я ее обработки с помощью параметра resolve
в маршруте, а не как я действительно есть родитель app
, что я мог бы поставить resolve
в, а затем он должен проверить для проверки подлинности для всех Чайлдс?
Я видел слишком много разных способов проверки подлинности для JWT, что мне действительно нужен четкий ответ на лучшую практику здесь.
AuthService.js
function AuthService($window) {
var self = this;
self.parseJwt = function(token) {
var base64Url = token.split('.')[1];
var base64 = base64Url.replace('-', '+').replace('_', '/');
return JSON.parse($window.atob(base64));
}
self.saveToken = function(token) {
$window.localStorage['jwtToken'] = token;
}
self.getToken = function() {
return $window.localStorage['jwtToken'];
}
self.isAuthed = function() {
var token = self.getToken();
if(token) {
var params = self.parseJwt(token);
return Math.round(new Date().getTime()/1000) <= params.exp;
} else {
return false;
}
}
self.logout = function() {
$window.localStorage.removeItem('jwtToken');
}
}
App.service('authSvc', AuthService);
config.js (Routes часть)
//
// App Routes
// -----------------------------------
$stateProvider
.state('login', {
url: '/login',
templateUrl: basepath('login.html')
})
.state('register', {
url: '/register',
templateUrl: basepath('register.html')
})
.state('recover', {
url: '/recover-password',
templateUrl: basepath('recover.html')
})
.state('app', {
url: '/app',
abstract: true,
templateUrl: basepath('app.html'),
controller: 'AppController'
})
.state('app.users', {
url: '/users',
templateUrl: basepath('users.html'),
controller: 'UserController',
title: 'Users'
})
.state('app.projects', {
url: '/projects',
templateUrl: basepath('projects.html'),
controller: 'ProjectController',
title: 'Projects'
})
.state('app.dashboard', {
url: '/dashboard',
templateUrl: basepath('dashboard.html'),
title: 'Dashboard'
});
AuthIntercepterFactory.js
function AuthInterceptorFactory(API, authSvc) {
return {
// automatically attach Authorization header
request: function(config) {
var token = authSvc.getToken();
if(config.url.indexOf(API) === 0 && token) {
config.headers.Authorization = 'Bearer ' + token;
}
return config;
},
// If a token was sent back, save it
response: function(res) {
if(res.config.url.indexOf(API) === 0 && res.data.token) {
authSvc.saveToken(res.data.token);
}
return res;
},
responseError: function(res) {
if(res.status === 401 || res.status == 403) {
$window.location.href = "http://localhost:3000/#/login";
}
}
}
}
App.service('authInterceptor', AuthInterceptorFactory);
Пожалуйста, дайте мне знать, если вам нужен любой дополнительный код от другого файлы.
Спасибо.
Эй, Даян. Я добавил файл AuthInterceptorFactory.js в начальный пост внизу. Не могли бы вы сказать, где бы вы его добавили? Не пытаясь быть неблагодарным для совета, я просто ищу немного больше направлений, где его можно разместить на самом деле. Вы говорите о проверке его перед каждым запросом, сделанным в перехватчике? – user2077115
Эта строка в документах должна проливать некоторый свет на ваш вопрос. '$ httpProvider.interceptors.push ('myHttpInterceptor');' , если не позвольте мне дать вам ключ, где доступны поставщики? вы получили его во время.config() вашего приложения –
Я работаю над проектом Angular 1.x и ценю, что вы цепляетесь за нас в Interceptor. Я смог успешно сгенерировать токен и отправить заголовок ответа на мои первые запросы на регистрацию/регистрацию/панель, но последующие вызовы API вызывают у меня 401 головную боль. Попробуем и воспользуемся перехватчиком, чтобы сначала проверить токен и посмотреть, смогу ли я найти разрешение. Много поисковых запросов, и никто не обсуждал это; очень признателен! – natureminded