本文详解为何直接 json 传输无法上传文件，并提供基于 formdata 的完整前后端解决方案，确保头像、姓名、邮箱三者均可成功更新。
在 Web 开发中，更新用户资料（如姓名、邮箱、头像）是常见需求。但一个典型误区是：试图用 JSON.stringify() 将文件对象（File 实例）一并序列化发送——这会导致文件数据丢失，因为 File 对象无法被 JSON 序列化（JSON.stringify({ image: file }) 中 image 会变成 {} 或 null），后端自然收不到文件流。
你的原始前端代码正是如此：
body: JSON.stringify({ name, email, image }), // ❌ 错误：image 是 File 对象，JSON 不支持
headers: { 'Content-Type': 'application/json' },
而 Express + Multer 的中间件链（upload.single(‘photo’)）明确要求请求为 multipart/form-data 类型，并期望字段名 photo 对应上传的文件——这与 JSON 请求完全不兼容。
✅ 正确解法：使用 FormData API 构建表单数据，它原生支持文件上传，并自动设置正确的 Content-Type（含 boundary），无需手动指定 headers：
立即学习“前端免费学习笔记（深入）”；
