0

Tengo ese interceptor que les muestro en el ejemplo, estoy presentando un problema cuando manejo los errores del interceptor, yo quiero que mi interceptor se de cuenta de que la ruta que no tiene token haga el redireccionamiento, el problema es que el redirecciona pero después de 3 segundos, veo que el interceptor tiene un retraso para darse cuenta de que la petición que le envía no tiene token.

    @Injectable()
    export class ProdInterceptorService implements HttpInterceptor {
    
      constructor(private tokenService: TokenService) { }
    
      intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        let request= req;
        const token = this.tokenService.getToken();
        if (token != null) {
          request= req.clone({ headers: req.headers.set('Authorization', 'Bearer ' + token)});
        }
        return next.handle(request).pipe(
      catchError((e: HttpErrorResponse)=> {
        if(!token)
        {
          this.router.navigate(['/login']);
    }
    return throwError(() => e);

);
      }
    }
    
    export const interceptorProvider = [{provide: HTTP_INTERCEPTORS, useClass: ProdInterceptorService, multi: true}];
1
  • con que servidor te conectas ?
    – nestdan
    el 19 jul. 2022 a las 19:31

1 respuesta 1

0

debes retornar la request en cada if de manera particular:

 @Injectable()
export class ProdInterceptorService implements HttpInterceptor {

  constructor(private tokenService: TokenService) { }

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    let request= req;
    const token = this.tokenService.getToken();

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

      return next.handle(request).pipe(
        catchError( error => throwError(error))
      );
    } else {
        this.router.navigate(['/login']);
    }

   
  }
}

export const interceptorProvider = [{provide: HTTP_INTERCEPTORS, useClass: ProdInterceptorService, multi: true}];

Creo que deberias replantear esto, ya que lo mejor es tener un guard que valide si el token es correcto, tu backend deberia proveerte de un End Point para validar que el token es correcto y si es un token emitido por el backend pero esta vencido te dara uno nuevo... los tipicos EPs de /renew/${token_actual} esto para persistir la sesion siempre y no tener que obligar al usuario a reloguearse cada que pasa el tiempo del Token.

Te dejo un ejemplo de este Guard:

@Injectable({
 providedIn: 'root'
})
export class AuthGuard implements CanActivate {

 constructor(
  private auth: AuthService,
  private router: Router){

  }

  canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot) {

    return this.auth.validateToken()
     .pipe(
       tap( isAuth => {
        if(!isAuth) {
        this.router.navigateByUrl('/login');
      }
    })
  );

 }

}

y luego en tu app-routing:

{
   path: '',
   component: LayoutGrlComponent,
   canActivate: [AuthGuard],
   canLoad:[AuthGuard],
   children: [
     {
        path: 'miPathRuta',
        loadChildren: () => import('./ruta/ruta.module').then(m => 
        m.rutaModule)
     },
 ]}

Espero te sea de Ayuda!

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

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