如何判断请求的body参数是FormData类型还是普通对象类型

直接使用instanceof运算符即可准确区分FormData类型和普通对象类型：

// 核心判断逻辑
if (request.body instanceof FormData) {
  // FormData 类型处理逻辑
} else {
  // 普通对象/其他类型处理逻辑
}

完整拦截器代码示例（Angular 场景） #

import { Injectable } from '@angular/core';
import {
  HttpRequest,
  HttpHandler,
  HttpEvent,
  HttpInterceptor
} from '@angular/common/http';
import { Observable } from 'rxjs';

@Injectable()
export class ProjectIdInterceptor implements HttpInterceptor {
  // 替换为实际的项目ID获取逻辑
  private projectId = 'your_project_id';

  intercept(request: HttpRequest<unknown>, next: HttpHandler): Observable<HttpEvent<unknown>> {
    // 仅当请求体存在时处理
    if (request.body) {
      if (request.body instanceof FormData) {
        // 处理FormData类型请求体
        // 可选：如果需要覆盖已存在的project参数，先执行request.body.delete('project')
        const modifiedBody = request.body;
        modifiedBody.append('project', this.projectId);
        request = request.clone({ body: modifiedBody });
      } else if (typeof request.body === 'object' && !Array.isArray(request.body)) {
        // 处理普通对象类型请求体
        request = request.clone({
          body: {...request.body, project: this.projectId}
        });
      }
    }
    return next.handle(request);
  }
}

补充说明 #

• 如果你不想修改原始的FormData对象，可以先遍历复制原有内容到新实例后再追加参数：

  const newFormData = new FormData();
  request.body.forEach((value, key) => {
    newFormData.append(key, value);
  });
  newFormData.append('project', this.projectId);
  request = request.clone({ body: newFormData });
  

• 上述代码默认过滤了数组类型的请求体，如果你的业务需要给数组类型的请求体也追加参数，可以自行调整类型判断逻辑。
• 可以新增request.body.has('project')判断逻辑，避免重复添加相同参数。

内容的提问来源于stack exchange，提问作者Mehrnoosh