html文件上传需用accept=".html,.htm"限定类型，配合js校验扩展名和type，formdata字段名须与后端约定一致，后端须启用multipart解析、校验真实类型并调大服务器体大小限制。
HTML 文档上传（.html 或 .htm 文件）和其他二进制文件本质一致，但容易在类型限制、服务端解析和安全校验上翻车。核心不是“能不能传”，而是“怎么传得准、收得到、防得住”。
如何用 <input type="file"> 限定只选 HTML 文件
accept 属性必须写对后缀名，不能只靠 MIME 类型——text/html 在 Chrome/Firefox 中常被忽略或不触发过滤。
- ✅ 正确写法：
accept=".html,.htm"（点不能漏） - ❌ 错误写法：
accept="text/html"或accept=".html, .htm"（空格会导致第二个后缀失效） - ⚠️ 注意：
accept只影响文件选择器界面，默认仍可切到“所有文件”并绕过，必须配合 JS 校验
前端 JS 校验 HTML 文件的两个必要动作
光靠 accept 不够，用户可能拖入 .txt 改名成 .html，或上传恶意内嵌脚本的 HTML。需双保险：
- 检查扩展名：
file.name.toLowerCase().endsWith('.html') || file.name.toLowerCase().endsWith('.htm') - 检查
type字段（虽不可信但有参考价值）：file.type === 'text/html'；若为空字符串，说明浏览器没识别，以扩展名为准 - ⚠️ 避免只读
file.type：它由文件头和扩展名共同推断，某些编辑器保存的 HTML 可能返回''或application/octet-stream
用 FormData 上传时字段名和服务端约定必须一致
后端框架（如 Express + multer、Flask 的 request.files）靠字段名定位文件。传错名字=后端收不到。
- 前端 append 时写死字段名：
formData.append('html_file', file) - 后端必须匹配这个键：
req.file（multer 默认是file）或request.files.get('html_file')（Flask） - ⚠️ 常见坑：
formData.append('file', file)却在 Express 里配了multer({ dest: 'uploads/' })而没指定fieldname，结果req.file为undefined
服务端接收不到？优先查这三处
前端控制台显示 200，但后端 req.files 或 request.files 为空，90% 是以下配置问题：
- Express：没装
multer，或用了app.use(express.json())等中间件拦截了multipart/form-data请求 - Flask：用
request.form读文件（错），正确是request.files.get('html_file') - Nginx：默认
client_max_body_size 1m，而一个带图片的 HTML 可能超 2MB，需显式调大
HTML 文件上传真正难的不是选中和发送，而是校验链路是否完整：前端扩展名 → 前端 type 推断 → 后端字段名匹配 → 后端 multipart 解析器启用 → 服务器体大小放行。漏一环，文件就“消失”在半路。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
