0

Estoy tratando de que el token me aparezca en el navegador en network, pero me aparece null(Authorization: Bearer null). Este es mi codigo:

export class TokenInterceptorService implements HttpInterceptor {
  constructor(private auth: AuthService) {}

  intercept(req, next) {
    console.log(this.auth.obtenerToken());
    const tokenReq = req.clone({
      setHeaders: {
        Authorization: 'Bearer' + this.auth.obtenerToken(),
      },
    });
    return next.handle(tokenReq);
  }
}

En consola me aparece el token, pero en network del navegador no.

En auth.service.ts tengo la funcion obtenerToken() asi:

  obtenerToken(){
    return localStorage.getItem('token');
  }

2 respuestas 2

0

te paso mi implementación

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

Una recomendación en auth.service.ts Declara token: String; en tu contructor this.token = localStorage.getItem('token');

Crea un metogo get get token(){return token} un método set set token(value){this.token = value; localstorage.setItem('token', this.token)} la idea es que manejes todo el token desde el serivicio, tu código queda mas limpio.

Ahora en el interceptor tu token quedaría así:

tokenReq = req.clone({
headers: req.headers.set('Authorization', 'Bearer ' + this.auth.token)
});
0

Puedo compartirte una sugerencia para que realices la implantación de esta manera.

intercept(
    req: HttpRequest<any>,
    next: HttpHandler
  ): Observable<HttpEvent<any>> {
    return from(this.handleAccess(req, next));
  }

  private async handleAccess(
    req: HttpRequest<any>,
    next: HttpHandler
  ): Promise<HttpEvent<any>> {
    const token = localStorage.getItem('token');
    let customHeaders;
    if (token) {
      customHeaders = req.clone({
        headers: req.headers
          .set('Content-Type', 'application/json')
          .append('Authorization', `Bearer ${token}`)
      });
    } else {
      customHeaders = req.clone({
        headers: req.headers
          .set('Content-Type', 'application/json')
      });
    }
    return next.handle(customHeaders);
  }

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.