angular4 使用HttpClient拦截器检查token失效，返回登录页面

最新推荐文章于 2024-08-04 13:43:15 发布

夏迎春

最新推荐文章于 2024-08-04 13:43:15 发布

阅读量3.8k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： angularJs 文章标签： angular4 HttpClient拦截器

本文链接：https://blog.youkuaiyun.com/wsqwsq1596/article/details/82706564

angularJs 专栏收录该内容

6 篇文章

订阅专栏

本文详细介绍了如何在Angular项目中创建并使用自定义的HTTP拦截器。通过在app.module.ts中引入并配置InterceptorService，可以实现对所有HTTP请求的统一处理，包括请求前后的操作，如错误处理、消息提示等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、首先创建一个拦截器服务：InterceptorService.ts
2、在app.module.ts文件里引入拦截器
import {InterceptorService} from ‘./InterceptorService’;
import {HTTP_INTERCEPTORS, HttpClientModule} from ‘@angular/common/http’;
接着在提供器里声明服务
providers: [
{provide: NZ_I18N, useValue: zh_CN},
{provide: HTTP_INTERCEPTORS, useClass: InterceptorService, multi: true}
],
3、InterceptorService.ts：
import {Injectable} from ‘@angular/core’;
import {HttpEvent, HttpInterceptor, HttpHandler, HttpRequest, HttpResponse} from ‘@angular/common/http’;
import {Observable} from ‘rxjs/internal/observable’;
import {mergeMap} from ‘rxjs/internal/operators/mergeMap’;
import {Router} from “@angular/router”;
import {NzMessageService} from “ng-zorro-antd”;

@Injectable()
export class InterceptorService implements HttpInterceptor {
constructor(private router: Router, private message: NzMessageService) {
}
intercept(req: HttpRequest, next: HttpHandler): Observable