Saltar al contenido

angular 5: redirige la página anterior después de iniciar sesión

Solución:

Cuando redirige a la página de inicio de sesión con un guardia, puede poner la URL de origen en el queryParams como tal:

canActivate(next: ActivatedRouteSnapshot,
            state: RouterStateSnapshot) {
    if (this.authService.isAuthenticated()) {
        return true;
    } else {
        console.log('Could not authenticate');
        this.router.navigate(['login'],{queryParams:{'redirectURL':state.url}});
        return false;
    }
}

Después de iniciar sesión, puede obtener la URL de la página original de los parámetros de consulta:

let params = this.route.snapshot.queryParams;
    if (params['redirectURL']) {
        this.redirectURL = params['redirectURL'];
    }

...

if (this.redirectURL) {        
    this.router.navigateByUrl(this.redirectURL,)
        .catch(() => this.router.navigate(['homepage']))
} else {

    this.router.navigate(['homepage'])
}

Puede enviar la URL antes de ir a la página de inicio y usarla allí.

@Component({ ... })
class SomePageComponent {
  constructor(private route: ActivatedRoute, private router: Router) {}
  checkLogin() {
    if (!this.auth.loggedIn()) {
      this.router.navigate(['/homepage`], { queryParams: { redirectTo: this.route.snapshot.url } });
    }
  }
}

Entonces, en su componente de inicio de sesión, puede acceder a queryParams como este

@Component({...})
class LoginComponent {
  constructor(private router: Router, private route: ActivatedRoute) {}

  backToPreviousPage() {
    this.router.navigate(
         [this.route.snapshot.queryParams.get('redirectTo')]
    );
  }
}

para mí, queryParams no funciona correctamente porque si el usuario va a iniciar sesión y luego va a la ruta de registro, entonces debe conservar los parámetros de consulta. Pero si tiene más pasos antes de iniciar sesión, o el usuario actualiza la página, o Internet estaba mal en el metro o algo más sucedió y perdió sus parámetros y será redirigido a quién sabe … Pero si configuró la URL necesaria para redirigir a localStorage y después de iniciar sesión / registrarse / algún otro paso, puede redirigirlo a la URL necesaria, previamente elimine la cadena de localStorage.

// needed page
localStorage.setItem('redirectTo', this.router.url);
this.router.navigateByUrl('/login');
// login/signup/else step page
success => {
  const redirect = localStorage.getItem('redirectTo');
  if (redirect) {
    localStorage.removeItem('redirectTo');
    this.router.navigate(redirect);
  } else {
    this.router.navigate('defaultpath');
  }
}
¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *