Question

我花了2天的时间解决这个问题，找不到任何解决办法。

我在Ionic 4项目中遇到了角度HTTP拦截器的问题。

成功登录后，路由器将导航到主页并使用令牌调用一些API。

登录成功后，我将令牌存储到localStorage并在HTTP拦截器中使用此令牌，第一次在首页中，令牌未设置到授权标头中。

如果我刷新应用程序，那么它可以正常工作，在这里，我在下面附加了我的代码段。

HTTP拦截器：

    intercept(httpReq: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        if (localStorage.getItem('tokenKey')) {
            const token = localStorage.getItem('tokenKey');
            const req = httpReq.clone({
                setHeaders: {
                    'Authorization': 'Bearer ' + token,
                    'Content-Type': 'application/json'
                }
            });
            return next.handle(req);
        } else {
            const req = httpReq.clone({
                headers: httpReq.headers.set('Content-Type', 'application/json'),
            });
            return next.handle(req);
        }
}

这是我的登录组件代码

 login() {
    this.authService.login(this.user)
        .then((data: any) => {
            this.events.publish('user:created', data.profile);
            this.events.publish('token:created', data.token);
            if (data.token) {
             this.router.navigate(['home']);
          }
      }).catch(error => {
         this.presentAlert(error);
      });
}

这是登录服务代码：

login(user) {
return new Promise((resolve, reject) => {
    this.http.post(ApiEndPoint + 'signin/index', user).subscribe((data: any) => {
        localStorage.setItem('tokenKey', data.data.token);
        this.authState.next(true);
        resolve(data.data);
    }, err => {
        reject(err);
    });
});}

登录后，Angular HttpInterceptor不适用于第一个请求

0 个答案: