Chrome上传无效大文件至NestJS接口时响应加载失败问题求助

问题出在请求生命周期的时机：你的拦截器是在文件完全上传到服务器后才触发验证，而Chrome在大文件上传过程中，若服务器突然中断连接（抛400错误），会因为未完整接收响应数据而显示“Failed to Load Response Data”。Postman对这类场景的处理更宽松，所以表现正常。

直接的修复方式是在文件上传阶段就提前验证扩展名，而不是等到文件接收完成后再通过拦截器处理，具体步骤如下：

1. 使用Multer的fileFilter提前拦截无效文件 #

在NestJS的FileInterceptor配置中添加fileFilter，让Multer在文件开始上传前就检查扩展名，直接拒绝无效文件并返回错误：

import { BadRequestException } from '@nestjs/common';
import { FileInterceptor } from '@nestjs/platform-express';
import * as path from 'path';

// 在你的控制器方法中
@Post('upload')
@UseInterceptors(FileInterceptor('file', {
  fileFilter: (req, file, callback) => {
    // 提取并统一转为小写的文件扩展名
    const fileExt = path.extname(file.originalname).toLowerCase();
    // 验证扩展名是否为.xls
    if (fileExt !== '.xls') {
      // 抛出INVALID_FILE_FORMAT错误，直接终止上传
      return callback(new BadRequestException('INVALID_FILE_FORMAT'), false);
    }
    // 验证通过，继续上传
    callback(null, true);
  },
  // 可选：可以添加文件大小限制，避免不必要的大文件上传
  limits: {
    fileSize: 10 * 1024 * 1024 // 限制为10MB
  }
}))
async handleFileUpload(@UploadedFile() file: Express.Multer.File) {
  // 后续业务逻辑
}

2. 移除原拦截器中的扩展名验证逻辑 #

既然已经在Multer层面提前拦截，原拦截器中针对扩展名的验证可以删除，避免重复处理。

这样调整后，服务器会在文件上传开始前就返回400错误，Chrome能完整接收响应数据，不会再出现“Failed to Load Response Data”的问题。

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