angular - 使用 "browser refresh/reload"或 F5 刷新页面时拦截器未执行

Question

我目前正在学习 Angular 7，但我遇到了问题，希望您能帮助我了解发生了什么。我正在使用 JWT 身份验证(Spring Boot Security)，每次单击时都会调用我的拦截器以在将请求发送到服务器之前设置 token 。当我使用浏览器后退/前进时，一切正常。但是如果点击“浏览器刷新”，拦截器不会调用，我会收到一个 Whitelabel 错误页面。我的问题是:1-为什么刷新不调用我的拦截器？2- 你知道如何解决这个问题吗？

import { Injectable } from '@angular/core';
import { HttpInterceptor, HttpRequest, HttpHandler, HttpErrorResponse, 
HttpEvent } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { Router } from '@angular/router';
import { TokenStorage } from './public/portal/token.storage';
import 'rxjs/add/operator/do';

 const TOKEN_HEADER_KEY = 'Authorization';
@Injectable()
export class Interceptor implements HttpInterceptor {
constructor(private token: TokenStorage, private router: Router) {
}
intercept(req: HttpRequest<any>, next: HttpHandler): 
Observable<HttpEvent<any>> {
let authReq = req;
if (this.token.getToken() != null) {authReq = req.clone({ 
    headers:req.headers.set(TOKEN_HEADER_KEY, 'Bearer ' + 
    this.token.getToken()) });
}
return next.handle(authReq).do(
  (err: any) => {

    if (err instanceof HttpErrorResponse) {
      if (err.status === 401) {
        this.router.navigate(['login']);
      }
    }
    console.log(err.status);
  }
);
}
}

谢谢你帮助我

Answer 1

好吧，我发现了。如果您希望 httpinterceptor 在重新加载后触发，您的路由需要有一个 canactivate 守卫。

  {
    path: "members/edit", component: MembersEditComponent, canActivate: [AutoLoginAllRoutesGuard],
  },
  {
    path: "members/edit/:id", component: MembersEditComponent, canActivate: [AutoLoginAllRoutesGuard],
  },

如果没有 canActivate，拦截器似乎不会在按 F5 时触发。