0

Estoy utilizando ngx-Admin con Angular 7 contra un api rest desarrollado en java con spring-boot. Al momento de hacer el login,con mi usuario y password, el api rest responde OK y me dá el token. Luego, yo en mi frontend, creé un HttpInterceptor para setear mi token en las peticiones sucesivas. Hasta aca no hay problemas...el problema es que no lo envia. Yo seteo el token en el header y lo imprimo en la consola del navegador, y me lo muestra correctamente. En la linea siguiente, lo envio y dicho header llega sin el token. Se les ocurre que puede estar sucediendo?. Les dejo el codigo de mi HttpInterceptor y algunas imagenes de la salida por consola.

import { Inject, Injectable, Injector } from '@angular/core';
import { HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
import { Observable } from 'rxjs';
import { switchMap, map  } from 'rxjs/operators';
import { NbAuthJWTToken } from '@nebular/auth';
import { NbAuthService } from '@nebular/auth';
import { NB_AUTH_TOKEN_INTERCEPTOR_FILTER } from '@nebular/auth';

@Injectable()
export class AuthInterceptor implements HttpInterceptor {

  constructor(private injector: Injector,
          @Inject(NB_AUTH_TOKEN_INTERCEPTOR_FILTER) protected filter) {
  }

      intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
// do not intercept request whose urls are filtered by the injected filter

if (!this.filter(req)) {
    return this.authService.isAuthenticatedOrRefresh()
      .pipe(
        switchMap(authenticated => {

          if (authenticated) {

              return this.authService.getToken().pipe(
                switchMap((token: NbAuthJWTToken) => {
                  const JWT = `Bearer ${token.getValue()}`;

                  req = req.clone({
                    setHeaders: {
                      Authorization: JWT
                    },
                  });
                  console.log('Ahora muestro el request!!!');
                  console.log(req);
                  return next.handle(req);
                }),
              )
          } else {
              // Request is sent to server without authentication so that the client code
              // receives the 401/403 error and can act as desired ('session expired', redirect to login, aso)
            return next.handle(req);
          }
        }),
      )
  } else {
  return next.handle(req);
  }
  }

  protected get authService(): NbAuthService {
    return this.injector.get(NbAuthService);
  }

}

En las siguientes imagenes les muestro los resultados. introducir la descripción de la imagen aquí

En la imagen anterior se ve que imprimo el httprequest justo antes de mandarlo.

introducir la descripción de la imagen aquí

En la imagen anterior se observa que el httprequest, justo antes de enviarlo tiene los valores deseados

introducir la descripción de la imagen aquí

Y en la imagen anterior vemos que el request llega al destino sin el header y el token seteado. Se les ocurre que puede estar pasando?. Gracias a todos por al menos leerlo

1
  • Bueno, he encontrado el problema (no la solucion). El problema es cuando en el modulo agrego el componente ng2-smart-table. Si utilizo este componente, simple, sin ni siquiera mostrar los datos obtenidos del api rest, el token en el header no se setea. Si quito dicho componente, el header va seteado con el token...si a alquien se le ocurre que puede ser, se lo agradezco. Gracias Commented el 1 may. 2019 a las 23:36

1 respuesta 1

0

Creo que he encontrado la solución a tu problema, ya que a mí me pasaba exactamente lo mismo. En este comentario de GitHub explican cómo: https://github.com/akveo/ngx-admin/issues/1875#issuecomment-455308347

Parece que ng2-completer está interfiriendo de alguna forma y a partir de la versión 3.0.0-beta.2 lo corrigieron. Yo estaba teniendo el mismo problema utilizando ng2-smart-table 1.4.0 en ngx-admin (Angular 7) con ng2-completer 2.x y esto lo solucionó. Actualmente estoy utilizando la versión 3.0.2 de ng2-completer.

Espero que te sirva aunque sea un poco tarde.

2
  • gracias por la data, lo estaré probando a la brevedad!. En mi proyecto, cambié el ng2-smart-table por material table, dado que encontré mucha documentacion sobre como hacer paginacion y busqueda del lado del server. Con ng2-smart-table, se puede hacer server side pagination? si tenes info te agradeceria. Commented el 12 ago. 2019 a las 12:14
  • Sí, hay un ServerDataSource que proporciona la librería que puedes utilizar en lugar del LocalDataSource, es muy sencillo. En versiones anteriores no existía pero lo podías implementar tú extendiendo de LocalDataSource. Igualmente, en las versiones más recientes de ng2-smart-table puedes sub-implementar ServerDataSource (aunque es bastante configurable tal y como está) para personalizar el tipo de petición que lanza, los parámetros que envía, etc. Commented el 13 ago. 2019 a las 15:49

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.