在使用Angular进行HTTP请求时,需要将JWT Token添加到请求的Headers中以进行认证。然而,有时候会出现将JWT Token添加到lazyUpdate中而不是Headers中的情况。这会导致未经授权的访问。
以下是解决此问题的代码示例:
import { Injectable } from '@angular/core'; import { HttpInterceptor, HttpHandler, HttpRequest, HttpEvent } from '@angular/common/http'; import { Observable } from 'rxjs/Observable';
@Injectable() export class AuthInterceptor implements HttpInterceptor {
intercept(req: HttpRequest
const token = localStorage.getItem('jwt');
if (token) {
const authReq = req.clone({
headers: req.headers.set('Authorization', `Bearer ${token}`)
});
return next.handle(authReq);
}
return next.handle(req);
}
}
import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { AppComponent } from './app.component'; import { AuthInterceptor } from './auth-interceptor';
@NgModule({ declarations: [AppComponent], imports: [BrowserModule, HttpClientModule], providers: [ { provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true } ], bootstrap: [AppComponent] }) export class AppModule { }
通过创建一个HTTP拦截器并在应用中提供它,就可以确保JWT Token被正确地添加到HttpHeaders头文件中,从而确保HTTP请求的安全性和可靠性。