在HttpClient攔截器中製作全局授權標頭

Question

我在我的應用程序中製作一個全局授權標頭。我使用過攔截器，所以我不會在我的get（）函數中聲明授權頭。我是否正確實現了攔截器，因爲當我調用get（）函數時，它仍然要求輸入令牌。它說沒有提供令牌。我的auth.interceptor有問題嗎？我應該在每個get（）函數中聲明授權頭持票人標記嗎？我認爲每次發送/接收請求時都會調用攔截器？

auth.interceptor.ts

@Injectable() 
export class AuthInterceptor implements HttpInterceptor { 
    private authService: AuthService; 

    constructor(private injector: Injector) {} 

    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> { 
     // Get the auth header from the service. 
     this.authService = this.injector.get(AuthService); 
     const token = this.authService.getToken(); 
      if (token) { 
       req = req.clone({ headers: req.headers.set('Authorization', 'Bearer ' + token) }); 
      } 

      if (!req.headers.has('Content-Type')) { 
       req = req.clone({ headers: req.headers.set('Content-Type', 'application/json') }); 
      } 

      req = req.clone({ headers: req.headers.set('Accept', 'application/json') }); 
      return next.handle(req); 
     } 
} 

products.component.ts

getAll() { 
    return this.httpClient.get<any>(this.url).map(response => response.json()); 
    } 

Answer 1

你正在做正確的方式！

攔截器用於攔截所有http調用，您可以更改全局請求。

我覺得在這些情況下的問題。你可以調試它們並解決它們。

  if (token) { 
       req = req.clone({ headers: req.headers.set('Authorization', 'Bearer ' + token) }); 
      } 

      if (!req.headers.has('Content-Type')) { 
       req = req.clone({ headers: req.headers.set('Content-Type', 'application/json') }); 
      } 

也許一些他們返回null！

但是，如果計時是獲取令牌的問題，則可以進行異步調用以獲取令牌。

this.authService.LoginUser().subscribe((token) => { 
    if (token) { 
    req = req.clone({ headers: req.headers.set('Authorization', 'Bearer ' + token) }); 
    } 

    if (!req.headers.has('Content-Type')) { 
    req = req.clone({ headers: req.headers.set('Content-Type', 'application/json') }); 
    } 

    req = req.clone({ headers: req.headers.set('Accept', 'application/json') }); 
    return next.handle(req); 
} 
});