angular - Obtener ruta/url anterior en AuthGuard
A veces un usuario podría acceder a mi página sin haber iniciado sesión en el dispositivo actual. Para ese caso, tengo un AuthGuard que verifica si un usuario ha iniciado sesión. Si no es así, se redirige a la página /login.
Ahora, a veces necesito que el usuario sea llevado a una página en particular después de iniciar sesión. Además, los parámetros de consulta necesitan ser llevados junto así:
@Injectable()
export class AuthGuard implements CanActivate, CanActivateChild {
private previousUrl: string;
constructor(
private _userService: UserService,
private _router: Router,
private _activatedRoute: ActivatedRoute,
private _logger: NGXLogger
) {
this._router.events
.subscribe((event) => {
this.previousUrl = null;
if (event instanceof NavigationCancel) {
this.previousUrl = event.url;
}
});
}
canActivate() {
console.log('canActivate')
if (AuthenticationService.isLoggedIn()) {
this._logger.debug('User is logged in.');
return true;
}
let loginParams = {};
if (this.previousUrl) {
const url = this._activatedRoute.snapshot.url;
const queryParams = this._activatedRoute.snapshot.queryParams;
const paramsList = [];
for (const k of Object.keys(queryParams)) {
paramsList.push(`${k}=${queryParams[k]}`);
}
const paramsStr = paramsList.length ? `?${paramsList.join('=')}` : '';
const enc = encodeURIComponent(`${this.previousUrl}${paramsStr}`);
loginParams = {redirect: enc};
}
this._router.navigate(['/login'], {queryParams: loginParams});
return false;
}
canActivateChild() {
return this.canActivate();
}
}
para rutas:
{
path: '',
loadChildren: './module/application/application.module#ApplicationModule',
canActivate: [AuthGuard]
},
Ahora, no encontré otra manera de conseguir el URL anterior. El problema con esta solución es que previousUrl no está establecido en el momento en que se ejecuta canActivate(), lo que significa que previousUrl siempre está undefined en ese punto.
¿Cómo puedo obtener la URL anterior antes de que el AuthGuard tome el control?
Ya miré
console.log(this._router.url);
console.log(this._activatedRoute.snapshot.url);
antes de redirigir a /login
pero _router.url ya es */login y la instantánea de url es solo una lista vacía [].
Respuesta #1
Pasa la URL original al componente de inicio de sesión:
import { Injectable } from '@angular/core';
import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
@Injectable()
export class AuthGuard implements CanActivate {
constructor(private router: Router) { }
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
if (localStorage.getItem('currentUser')) {
// logged in so return true
return true;
}
// not logged in so redirect to login page with the return url and return false
this.router.navigate(['login'], { queryParams: { returnUrl: state.url }});
return false;
}
}
Véa aquí: https://jasonwatmore.com/post/2016/12/08/angular-2-redirect-to-previous-url-after-login-with-auth-guard
Editar :
Si no, se redirige a la página /login.
Aquí es donde obtendrías la página actual y usarías el guardia para pasar como parámetro al componente de inicio de sesión
