MSWJS 拦截 FormData 请求时在 Node.js 20+ 版本中的超时问题分析

问题背景

在 Node.js 环境中使用 MSWJS 拦截包含文件上传的 FormData 请求时，开发者报告在 Node.js 18 版本中可以正常工作，但在 Node.js 20 及以上版本会出现请求超时的问题。这个问题特别出现在使用 JSDOM 作为 DOM 实现的环境中。

技术细节分析

FormData 和文件上传的拦截机制

MSWJS 作为一个 API 模拟库，需要能够拦截和处理各种类型的 HTTP 请求，包括包含文件上传的多部分表单数据请求。当使用 request.formData() 方法尝试解析请求体时，在 Node.js 20+ 环境中会出现阻塞，导致请求超时。

Node.js 版本差异

从技术角度看，Node.js 20 引入了一些底层变更，特别是在处理 Web Streams API 和 Blob 对象方面。这些变更可能影响了 JSDOM 对 FormData 的实现方式：

1. Blob 处理逻辑变更：Node.js 20+ 对 Blob 对象的实现进行了调整，可能导致 JSDOM 中的 FormData 解析逻辑出现兼容性问题
2. 流处理优化：Node.js 20 对流处理进行了优化，可能改变了请求体的解析时序
3. 缓冲区管理：底层缓冲区管理策略的变化可能影响了文件数据的读取

解决方案

官方推荐方案

1. 避免使用 JSDOM：MSWJS 官方已明确表示不正式支持 JSDOM，建议开发者迁移到其他 DOM 实现方案
2. 使用 Undici 的 FormData：直接使用 Node.js 内置的 Undici 库中的 FormData 实现可能更稳定

临时解决方案

对于仍需要使用 JSDOM 的开发者，可以尝试以下方法：

1. 添加 Blob polyfill：安装并使用 blob-polyfill 包，在测试设置文件中导入

   import 'blob-polyfill';
   

2. 降级 Node.js 版本：在过渡期间暂时使用 Node.js 18 版本
3. 更新依赖：确保所有相关依赖（JSDOM、MSWJS）都更新到最新版本

最佳实践建议

1. 测试环境标准化：确保开发、CI 和生产环境使用相同的 Node.js 版本
2. 逐步迁移策略：如果必须从 JSDOM 迁移，建议制定渐进式迁移计划
3. 监控依赖更新：关注 Node.js 和 MSWJS 的更新日志，特别是与网络请求处理相关的变更

总结

这个问题本质上是 Node.js 版本升级带来的底层变更与特定 DOM 实现之间的兼容性问题。开发者应当评估长期维护成本，考虑按照官方建议迁移到更稳定的技术栈。对于短期需求，使用 polyfill 可以提供临时解决方案，但需要注意这可能会带来其他潜在的兼容性问题。