Angular 4 如果集中会话过期处理

Angular 4 if centralize session expire handling

我正在使用 angular 4.x

在开发环境中,如果有人重新启动服务器或用户从另一个选项卡注销,然后用户继续尝试从另一个选项卡执行某些操作,he/she 会一直在页面上看到错误。

我想使用 Angular 的 HTTP 服务集中解决方案,这样如果用户尝试执行任何操作并且由于会话过期而发生错误,我们想要刷新页面。

所以这是我从 here (full plunker here 获得的 HttpInterceptor class 的示例。

@Injectable()
export class MyHttpLogInterceptor implements HttpInterceptor {
  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    console.log('processing request', request);

    const customReq = request.clone({
      headers: request.headers.set('app-language', 'it')
    });

    return next
      .handle(customReq)
      .do((ev: HttpEvent<any>) => {
        if (ev instanceof HttpResponse) {
          console.log('processing response', ev);
        }
      })
      .catch(response => {
        if (response instanceof HttpErrorResponse) {
          console.log('Processing http error', response);
        }

        return Observable.throw(response);
      });
  }
}

catch 块可能是您感兴趣的内容。您可以检查错误并检查它是否来自会话过期,然后对其做出正确反应。

您需要在 app.module 中提供此拦截器。

providers: [
    { provide: HTTP_INTERCEPTORS, useClass: MyHttpLogInterceptor, multi: true }  
  ]