#javascript #angular #typescript #http #interceptor
#javascript #угловой #typescript #http #перехватчик
Вопрос:
Здравствуйте, у меня есть 3 разных API для разных сервисов. У каждого API есть свой собственный токен аутентификации. Я хочу создать 3 http-перехватчика, по одному для каждого API. Я знаю, что создайте HttpInterceptor для всего проекта, но как я могу создать другой перехватчик для каждой службы api?
Ответ №1:
Вы можете использовать один перехватчик, и поскольку в этом у вас есть доступ для чтения URL-адреса, вы можете создать функцию, которая в зависимости от этого использует другой токен, например:
intercept(request: HttpRequest<unknown>, next: HttpHandler): Observable<HttpEvent<unknown>> {
let token;
if (request.url.indexOf(PATH_ROUTE_ONE) !== -1) {
token = localStorage.getItem(TK1);
} else if(request.url.indexOf(PATH_ROUTE_TWO) !== -1) {
token = localStorage.getItem(TK2);
} else {
token = localStorage.getItem(TK3);
}
if (token) {
request = request.clone({
setHeaders: {
authorization: `Bearer ${token}`,
},
});
}
return next.handle(request).pipe(
tap((res) => {
if (res instanceof HttpResponse) {
// TODO: Update token info
}
}),
catchError((err: HttpErrorResponse) => throwError(err)),
);
}
Если вы хотите использовать 3 пути, вы можете сделать то же самое, и вы только читаете URL, чтобы узнать, применяете ли вы его или позволяете ему продолжаться долго
intercept(request: HttpRequest<unknown>, next: HttpHandler): Observable<HttpEvent<unknown>> {
let token = localStorage.getItem(TK1)
if (request.url.indexOf(PATH_ROUTE_ONE) !== -1) {
request = request.clone({
setHeaders: {
authorization: `Bearer ${token}`,
},
});
}
return next.handle(request).pipe(
tap((res) => {
if (res instanceof HttpResponse) {
// TODO: Update token info
}
}),
catchError((err: HttpErrorResponse) => throwError(err)),
);
}