Как добавить собственный перехватчик в angular 4
Я написал собственный перехватчик на angular 4. Проблема, с которой я сталкиваюсь, заключается в проверке URL-адреса с помощью переменной динамического пути в URL-адресе. Бэкэнд-приложение имеет Oauth2 и развернуто на отдельном сервере (авторизация и ресурс). Класс перехватчика углового ниже
export class TokenInterceptor implements HttpInterceptor {
private whiteList = [
'http://localhost:8081/Test1app/oauth-server/oauth/token',
'http://localhost:8080/ResourceApp/oauth-resource/ibex/api/signup',
'http://localhost:8080/ResourceApp/oauth-resource/ibex/api/registeration/confirm/**',
'http://localhost:8080/ResourceApp/oauth-resource/ibex/api/user/profile/upload',
'http://localhost:8080/ResourceApp/oauth-resource/ibex/api/profile/edit/password/**'
]
constructor(public auth : AuthenticationService) {}
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
console.info(request.url);
// If request is not in whitlist add header
if (!this.whiteList.includes(request.url)) {
console.info("I was not here");
console.info(request.url);
request = request.clone({
setHeaders: {
Authorization: `Bearer ${this.auth.getToken()}`
}
});
}
return next.handle(request);
}
}
проблема, с которой я сталкиваюсь сейчас, - это всякий раз, когда я пытаюсь получить доступ к http: // локальный: 8080 / ResourceApp / oauth-resource / ibex / api / profile / edit / password / 12345-2333-4444 он выполняется при условии if (запрос находится в белом списке)
Ответы 1
Попробуй это:
export class TokenInterceptor implements HttpInterceptor {
private patterns = [
new RegExp('http://localhost:8081/Test1app/oauth-server/oauth/token'),
new RegExp('http://localhost:8080/ResourceApp/oauth-resource/ibex/api/signup'),
new RegExp('http://localhost:8080/ResourceApp/oauth-resource/ibex/api/registeration/confirm/.*'),
new RegExp('http://localhost:8080/ResourceApp/oauth-resource/ibex/api/user/profile/upload'),
new RegExp('http://localhost:8080/ResourceApp/oauth-resource/ibex/api/profile/edit/password/.*')
];
constructor(public auth : AuthenticationService) {}
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
if (!this.match(request.url)) {
request = request.clone({ setHeaders: { Authorization: `Bearer ${this.auth.getToken()}` } });
}
return next.handle(request);
}
match(url: string): boolean {
for (const pattern of this.patterns) {
if (Array.isArray(url.match(pattern))) { return true; }
}
return false;
}
}
Рекомендации:
Прохождение цикла for повлияет на производительность приложения, поскольку каждый запрос проходит через перехватчик, и в будущем белый список может увеличиться. Спасибо за ответ
@joel includes также зацикливает массив. За этим нет темной магии. Единственный способ избежать этого - вообще не использовать массив. Попробуйте использовать только регулярное выражение, которое соответствует всем URL-адресам, для которых требуется заголовок, или одно регулярное выражение, которое соответствует всем URL-адресам, для которых не требуется заголовок.
Что такое импорт для нового RegExp ()? В машинописном тексте?
Вы пробовали
request.urlWithParams? Также обратите внимание, что/**в элементах массива whiteList, вероятно, работает не так, как вы ожидаете. Array.prototype.includes () использует алгоритм sameValueZero.