Estoy tratando de aprender a usar HttpInterceptor para agregar un par de encabezados a cada solicitud HTTP que la aplicación hace a la API. Tengo este interceptor:
import { Injectable } from '@angular/core'; import { HttpEvent, HttpInterceptor, HttpHandler, HttpRequest } from '@angular/common/http'; import { Observable } from 'rxjs/Observable'; @Injectable() export class fwcAPIInterceptor implements HttpInterceptor { intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> { const authReq = req.clone({ headers: req.headers.set('Content-Type', 'application/json') }); console.log('Intercepted HTTP call', authReq); return next.handle(authReq); } } Además del encabezado 'Content-Type' , necesito agregar una 'Authorization' pero no sé cómo hacerlo (la documentación de Angular HttpHeaders es solo la lista de métodos, sin ninguna explicación).
¿Cómo puedo hacerlo? ¡Gracias!
Dado que el método set devuelve objetos de encabezado cada vez, puede hacer esto. De esta forma, también se conservarán los encabezados originales de la solicitud interceptada.
const authReq = req.clone({ headers: req.headers.set('Content-Type', 'application/json') .set('header2', 'header 2 value') .set('header3', 'header 3 value') });Editar: siguiendo las sugerencias en los comentarios, he unificado ambas respuestas.
Sobrescribir todos los encabezados
@Injectable() export class fwcAPIInterceptor implements HttpInterceptor { intercept (req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> { const authReq = req.clone({ headers: new HttpHeaders({ 'Content-Type': 'application/json', 'Authorization': 'my-auth-token' }) }); console.log('Intercepted HTTP call', authReq); return next.handle(authReq); }Agregar más encabezados sin sobrescribir (créditos a Ketan Patil ; vea la respuesta en esta publicación)
const authReq = req.clone({ headers: req.headers.set('Content-Type', 'application/json') .set('header2', 'header 2 value') .set('header3', 'header 3 value') });Como se mencionó anteriormente, el método aceptado anula los encabezados, para agregarlos me gusta el enfoque de la documentación de la API :
const authReq = req.clone({ setHeaders: { Authorization: authToken } });