Angulaire HttpInterceptor ne changeant pas d'en-tête

Question

J'ai écrit un HttpInterceptor angulaire (4.3.6) pour ajouter des champs d'en-tête, mais l'en-tête n'est pas mis à jour si je les inspecte dans le débogueur. Une idée?

import {Injectable} from '@angular/core'; 
import {HttpEvent, HttpInterceptor, HttpHandler, HttpRequest} from '@angular/common/http'; 
import {Observable} from 'rxjs/Observable'; 

@Injectable() 
export class AuthInterceptor implements HttpInterceptor { 


    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> { 

     console.log('AuthInterceptor at work'); 

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

     const token = localStorage.getItem('token'); 
     if (token) { 
      const authReq = contentTypeReq.clone({ 
       headers: req.headers.set('Authorization', 'Bearer ' + token) 
      }); 
      return next.handle(authReq); 
     } 

     // Pass on the cloned request instead of the original request. 
     return next.handle(contentTypeReq); 
    } 
} 

Answer 1

Ils sont paresseux. Par exemple keys method ressemble:

keys(): string[] { 
    this.init(); <== initialize 

    return Array.from(this.normalizedNames.values()); 
} 

Si vous voulez les vérifier simplement appeler:

req.headers.keys() 

Si vous voulez vérifier la valeur que vous pouvez utiliser la méthode get ou getAll:

req.headers.getAll('Content-Type') 

Ou vous pouvez appeler init méthode à partir de la console, puis vous serez en mesure de se les en-têtes e dans headers Carte

En outre, lorsque angular adds headers to request il utilise la méthode forEach qui appelle aussi la méthode init.