accept属性仅影响浏览器文件选择过滤，不校验文件类型；正确写法需同时提供MIME类型和扩展名，如"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,.xlsx"，且后端必须校验文件头和真实类型。
先说一个核心结论：accept 属性本质上是个“礼貌的提示”，它只能帮你过滤浏览器文件选择框里的选项，根本拦不住用户上传任何他们想传的文件。指望它来保证安全，可就大错特错了。
为什么你的 accept 选不到 .xlsx 文件？
这个问题太常见了：明明给文件上传框设置了 accept=".xlsx"，结果用户点开选择器，要么压根看不到Excel文件，要么选了文件也没反应。
- 关键在于，
accept的值必须符合规范——要么是标准的MIME类型（比如application/vnd.openxmlformats-officedocument.spreadsheetml.sheet），要么是带点的扩展名（比如.xlsx）。但麻烦在于，不同浏览器的“脾气”不一样。 - Chrome和Edge对
.xlsx这类扩展名支持还算友好；可到了Safari，尤其是iOS上，它经常“无视”扩展名，只认MIME类型。 - 所以说，最稳妥、兼容性最好的写法是什么？答案是两者都写上：
accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,.xlsx"。这样一来，不管浏览器认哪种格式，都能正确过滤。
accept 与后端校验：谁是真正的守门员？
这里必须划清界限：前端用 accept，纯粹是为了提升用户体验，让操作更顺手。它绝对不是，也绝不能替代后端的安全检查。用户有太多方法可以绕过它：用开发者工具直接修改网页HTML、通过命令行工具（比如curl）直接上传、甚至简单地把文件拖拽到上传区域。
- 真正的安全防线，必须建在服务端。后端需要做两件至关重要的事：一是读取文件真实的
Content-Type，二是解析文件的二进制头（也就是常说的magic bytes）。例如，一个真正的.xlsx文件，其文件头通常以PK\x03\x04开头。 - 技术栈不同，工具也不同。Node.js环境可以用
file-type库来解析；Python开发者可以考虑python-magic；如果是Ja va项目，Apache Tika是个不错的选择。 - 还得提醒一点：即使文件的MIME类型对得上，也要验证它的扩展名是否与文件实际内容一致。这是为了防止“文件伪装”——比如把一个
.exe可执行程序，简单地改名为.xlsx来上传。
这些常见错误写法，你踩坑了吗？
很多代码看似写了，实则效果大打折扣，甚至完全失效。下面这几个坑，看看你遇到过没有：
- 错误写法：
accept="xlsx"（漏了那个点）
→ 正确姿势：必须是.xlsx。 - 错误写法：
accept=".pdf .docx"（用空格分隔多个类型）
→ 正确姿势：必须使用英文逗号：accept=".pdf,.docx"。 - 错误写法：
accept=application/pdf,.pdf（混用类型但没加引号）
→ 正确姿势：属性值必须用引号括起来：accept="application/pdf,.pdf"。 - 错误理解：以为
accept="image/*"能限制所有图片子类型就万事大吉。
→ 需要警惕的是：像Safari浏览器可能会允许上传image/svg+xml类型的SVG文件，而某些SVG文件内可以嵌入脚本，存在安全风险，需要后端单独进行拦截和处理。
归根结底，实现一个真正安全的文件上传功能，accept 属性仅仅是最外层、最基础的体验优化层。核心的安全逻辑，永远在于服务端对文件内容的严格解析和坚定拒绝。太多项目上线后出问题，就是因为开发者错误地认为“前端设置了 accept 就安全了”，最终被恶意文件轻易攻破。这才是关键所在。
