Angular 12 如何通过Http拦截器全局将日期对象转为指定格式字符串
Angular Http 拦截器全局转换请求体日期格式实现方案
核心实现逻辑:在拦截器中新增请求体预处理逻辑,递归遍历请求体所有属性,将Date类型值统一格式化为指定字符串,再克隆原请求替换body即可,原有权限校验、异常处理的逻辑可完全保留。
完整实现代码如下:
import { Injectable, Inject } from '@angular/core'; import { HttpRequest, HttpHandler, HttpEvent, HttpInterceptor, HttpErrorResponse } from '@angular/common/http'; import { Observable, throwError } from 'rxjs'; import { map, catchError } from 'rxjs/operators'; import * as moment from 'moment'; import { ENVIRONMENT, IEnvironment } from '你的环境变量依赖路径'; // 按实际来源调整radarWebUrl的声明/引入 declare const radarWebUrl: string; @Injectable() export class VerifyAuthorisationInterceptor implements HttpInterceptor { constructor(@Inject(ENVIRONMENT) private environment: IEnvironment) {} // 递归转换日期格式的工具方法 private formatDatesInBody(body: any): any { // 跳过空值、非对象/数组类型 if (body == null || typeof body !== 'object') { return body; } // 排除FormData、Blob等非普通JSON请求体,避免文件上传等场景出错 if (body instanceof FormData || body instanceof Blob || body instanceof ArrayBuffer) { return body; } // 处理数组类型 if (Array.isArray(body)) { return body.map(item => this.formatDatesInBody(item)); } // 处理普通对象 const formattedBody = { ...body }; for (const key of Object.keys(formattedBody)) { const value = formattedBody[key]; if (value instanceof Date) { // 可按需调整日期格式 formattedBody[key] = moment(value).format('YYYY-MM-DD HH:mm:ss'); } else if (typeof value === 'object') { // 递归处理嵌套对象/数组 formattedBody[key] = this.formatDatesInBody(value); } } return formattedBody; } intercept( request: HttpRequest<unknown>, next: HttpHandler ): Observable<HttpEvent<unknown>> { // 预处理请求体,替换为转换后的新body const processedRequest = request.clone({ body: this.formatDatesInBody(request.body) }); // 保留原有响应处理、异常捕获逻辑 return next.handle(processedRequest).pipe( map((event: HttpEvent<unknown>) => { return event; }), catchError((error: HttpErrorResponse) => { if (error.status === 401 && error.statusText === 'Unauthorized') { const returnUrl = window.location.href; window.location.href = radarWebUrl; } return throwError(error); }) ); } }
注意事项
- 如果存在不需要转换日期的接口,可在预处理前通过请求URL前缀、请求方法等规则跳过处理
- 日期格式化逻辑可按需调整,若不用moment,替换为dayjs或原生Date格式化方法即可
- 若需要排除指定日期字段的转换,可在递归方法中新增字段名判断逻辑
内容的提问来源于stack exchange,提问作者Mukil Deepthi
相关产品推荐
相关产品推荐

