Блог

в моем приложении Angular, когда я перехожу к URL-адресу, содержащему параметры запроса, по защищенному маршруту canActivate, мой URL-адрес кодируется и, таким образом, не достигает нужного компонента. Пример:

Я копирую вставляю в браузер:

 http://localhost:4200/orders?pickup=irvine-1-ca  

он правильно возвращает true через эту защиту:

 canActivate(  route: ActivatedRouteSnapshot, state: RouterStateSnapshot  ):  | boolean  | UrlTree  | Promiselt;boolean | UrlTreegt;  | Observablelt;boolean | UrlTreegt; {    return this.authService.user.pipe(   take(1),  map(user =gt; {  const isAuth = !!user;   console.log("authGuard", user)   if (isAuth) {  return true;  }   return this.router.createUrlTree(['/account'], { queryParams: { mode: "login" } });  })    );  }  }  

Однако URL-адрес кодирует и перенаправляет следующее после передачи true:

 http://localhost:4200/orders?pickup=irvine-1-ca  

Как правильно сохранить параметры запроса? Спасибо за помощь! Заранее спасибо.

Редактировать:

Нашел довольно грубый обходной путь. На странице ошибки, вызванной маршрутизацией по закодированному маршруту, автоматически декодируйте маршрут и перейдите к правильно закодированной версии. Если у кого-нибудь есть более элегантное решение, я бы с удовольствием его выслушал.

 export class ErrorPageComponent implements OnInit {   constructor(private router: Router) { }   ngOnInit() {  // Fix for guard encoding URL with query params. Decoding the URL and redirecting to it if user lands on error page.  const url = decodeURIComponent(this.router.url);  if (url !== this.router.url) {  this.router.navigateByUrl(url);  }  } }  

Вы можете использовать decodeURIComponent()

 decodeURIComponent('http://localhost:4200/orders?pickup=irvine-1-ca')  

который должен вернуться:

 'http://localhost:4200/orders?pickup=irvine-1-ca'