accept属性仅优化体验而非安全防线，须配合前端js校验与后端魔数识别；正确写法为mime类型与扩展名双写、逗号分隔无空格；file.type不可信，应结合扩展名与文件头魔数校验；后端必须用魔数识别真实类型并重命名存储。
accept 属性本身不拦截文件上传，只让浏览器在文件选择框里默认过滤显示——用户点“所有文件”、拖拽上传、改 DOM 或用 curl 都能绕过。真正限制格式必须靠前端 JS 校验 + 后端魔数识别双保险。accept 的作用是优化体验，不是安全防线。
accept 值怎么写才在多数浏览器生效
单写 MIME 类型或单写扩展名都容易失效：iOS Safari 依赖 MIME，安卓 WebView 常忽略 MIME 只认扩展名，Windows 下同一张 JPG 可能报 image/jpeg 或 image/pjpeg。必须 MIME + 扩展名双写，逗号分隔且不能有空格：
-
图片类：
accept="image/jpeg,image/png,image/gif,.jpg,.jpeg,.png,.gif" -
PDF/Word：
accept="application/pdf,application/vnd.openxmlformats-officedocument.wordprocessingml.document,.pdf,.docx" -
CSV：
accept="text/csv,.csv"（仅写.csv在部分 Safari 下直接被忽略） -
通配兜底：
accept="image/*,.jpg,.png"（image/*覆盖主流图片，补扩展名防漏）
以下写法基本无效：accept=".jpg,.png"（iOS Safari 忽略）、accept="jpg,png"（非法值）、accept="image/jpg"（非标准 MIME）、accept="image/png , .jpg"（逗号后空格 → Safari 解析失败）。
为什么不能只靠 file.type 判断类型
file.type 是浏览器根据文件名或系统注册信息推测的，不是文件真实内容的反映。它可能为空（尤其 Windows 下双击选中），也可能被轻易伪造：把 malware.exe 改名为 report.jpg，file.type 就可能变成 image/jpeg，但实际仍是可执行文件。
更可靠的做法是：
- 取扩展名：
file.name.toLowerCase().endsWith('.pdf')或正则file.name.match(/\.(pdf|docx)$/i) - 关键业务必须加 magic bytes 校验：用
FileReader读前 4 字节，PDF 是%PDF（25 50 44 46），PNG 是\x89PNG（89 50 4E 47） - 设了
multiple后，event.target.files是FileList，必须遍历每一项，不能只检查第一个
后端为什么必须校验文件头（magic bytes）
前端传来的 Content-Type 请求头、PHP 的 $_FILES['file']['type']、Node.js 的 req.file.mimetype 全部可被伪造，毫无可信度。服务端收到的文件，必须读取二进制流前若干字节，用魔数识别真实类型：
- Node.js 推荐用
file-type库解析 buffer 前 12 字节 - Python 用
python-magic，注意初始化成本 - PHP 用
finfo_file($finfo, $tmpFile)，别碰$_FILES里的type字段
确认 MIME 类型与允许列表一致（如 .jpg 必须对应 image/jpeg）后，再重命名存储，剥离原始扩展名，由服务端附加安全扩展名。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
