У меня есть проект Angular 6 с авторизацией JWT, развернутый в AWS Elastic Beanstalk и использующий CloudFront, которым я управляю с помощью библиотеки @ auth0 / angular-jwt.Все отлично работает, у меня есть ссылка на мою страницу, которая добавляет к запросу токен авторизации:
https://myapp.com/?authorization=my_token
Это обрабатывается моей службой AuthGuard:
...
canActivate(
next: ActivatedRouteSnapshot,
state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
const token = next.queryParams[AUTHORIZATION_PARAMETER];
if (token) {
this.authService.login(token);
}
if (!this.authService.isLoggedIn()) {
this.router.navigate(['login']);
return false;
}
return true;
}
...
В моих AppRoutes:
export const AppRoutes: Routes = [
{ path: '', redirectTo: 'dashboard', pathMatch: 'full' },
{ path: 'dashboard', component: DashboardComponent, canActivate: [AuthGuard] }
];
В моем AuthService:
...
private jwtHelper: JwtHelperService;
private userAuthenticated: BehaviorSubject<boolean> = new BehaviorSubject(false);
constructor(
private authStore: AuthStore
) {
this.jwtHelper = new JwtHelperService();
}
login(token: string) {
this.authStore.setToken(token);
this.updateState();
}
logout() {
this.authStore.clearToken();
this.updateState();
}
isLoggedIn(): boolean {
this.updateState();
return this.userAuthenticated.getValue();
}
updateState() {
this.userAuthenticated.next(this.isTokenValid());
}
isTokenValid(): boolean {
const token = this.getAsyncToken();
return !this.jwtHelper.isTokenExpired(token);
}
getAsyncToken() {
return this.authStore.getToken();
}
...
В моем AuthStore:
...
setToken(token: string) {
localStorage.setItem(JWT_TOKEN_STORAGE_KEY, token);
}
getToken() {
return localStorage.getItem(JWT_TOKEN_STORAGE_KEY);
}
clearToken() {
localStorage.removeItem(JWT_TOKEN_STORAGE_KEY);
}
...
Поэтому, когда я нажимаю на ссылку, приложение корректно загружает компонент панели мониторингаи измените URL следующим образом:
https://myapp.com/dashboard
Когда я нажимаю клавишу F5, чтобы обновить страницу, я получаю эту ошибку:
<Error>
<Code>AccessDenied</Code>
<Message>Access Denied</Message>
<RequestId>the_request_id</RequestId>
<HostId>the_host_id</HostId>
</Error>
Заранее спасибо.
ОБНОВЛЕНИЕ: Это проблема, связанная с CloudFront, ресурс «панель мониторинга» не существует, поэтому он возвращает Отказано в доступе, как предотвратить / управлять такими событиями (клавиша F5) в угловом режиме?