enctype="multipart/form-data" 是文件上传的硬性前提，必须显式写在form标签上且小写，否则浏览器按默认编码丢弃二进制内容，后端无法接收文件。
enctype="multipart/form-data" 是文件上传的硬性前提
只要表单里有 ，就必须显式设置 enctype="multipart/form-data"。不设、写错、或依赖默认值，文件字段在后端一定为空——不是后端没写对，是前端根本没发过去。
浏览器默认用 application/x-www-form-urlencoded 编码，它会把 type="file" 的值转成空字符串或不可靠的路径名（如 C:\fakepath\abc.jpg），二进制内容直接丢弃。只有 multipart/form-data 才会让浏览器把文件切分成带 Content-Disposition 和 Content-Type 头的二进制块（part），后端中间件（如 Multer、Flask request.files）才可能解析出来。
form 标签上必须显式声明，大小写要统一
不能省略，不能只靠 JS 补救；即使表单里只有一个文件输入框、其余全是文本框，也得写：
-
enctype必须写在标签上，写在或其他地方无效 - HTML 不区分大小写，但写成
MULTIPART/FORM-DATA容易让协作者误以为是拼写错误，统一小写最稳妥 - 如果用 Vue/React 动态渲染表单，检查 DevTools 里的最终 HTML，确认
enctype确实存在且值正确——框架模板漏写很常见
JavaScript 提交时，enctype 属性其实不生效
当你用 fetch() 或 XMLHttpRequest 手动发请求时， 这个属性被完全忽略。起作用的是你构造的数据对象：
- ✅ 正确：用
new FormData(formElement)收集数据，再传给fetch()—— 浏览器自动设Content-Type: multipart/form-data; boundary=... - ❌ 错误：手动拼
JSON.stringify(...)并设Content-Type: application/json，input.files[0]会被转成[object File]字符串，后端收不到任何二进制流 - ⚠️ 注意：
FormData.append('file', input.files[0])中的第二个参数必须是File实例，不是input.value（那是只读路径字符串，无用）
后端收不到文件？先看请求头是否匹配
抓包（如 Chrome DevTools Network 面板）看真实发出的请求：
- 检查
Content-Type请求头是不是以multipart/form-data; boundary=开头 - 如果看到
application/x-www-form-urlencoded，说明前端没走对路：要么表单漏了enctype，要么 JS 阻止了默认提交但没用FormData - Node.js + Multer 场景下，
req.file为undefined90% 是这个原因，不是中间件没挂载好 - FastAPI 中
File()参数为空、Flask 中request.files为空字典，也优先排查这个环节
真正容易被忽略的是：这个属性看似简单，却横跨 HTML 渲染、浏览器编码逻辑、HTTP 协议规范三层；一旦出问题，现象是“后端收不到”，但根因永远在前端表单配置那一行。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
