应使用标准 MIME 类型配合扩展名，如 accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel,.xlsx,.xls"，且逗号分隔无空格；accept 仅优化界面过滤，非安全控制，需前后端协同校验文件真实格式。
accept 怎么写才能让 Excel 文件在文件选择器里可见
很多开发者设了 accept=".xlsx" 却发现 Safari 或旧版 Edge 里根本看不到 Excel 文件——这不是 bug，是浏览器对扩展名支持不一致。真正起效的写法必须包含 MIME 类型，且优先用标准 Office MIME。
-
accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,.xlsx"（推荐，覆盖 .xlsx） -
accept="application/vnd.ms-excel,.xls"（覆盖 .xls） - 要同时支持两种，写成：
accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel,.xlsx,.xls" - 别写
accept="xlsx"或accept=".xls,.xlsx"单独用扩展名——移动端 Safari 基本无视 - 多个值之间**必须用英文逗号分隔，不能有空格**，否则整个属性失效
为什么 accept 无法阻止用户上传非表格文件
用户点开文件选择框后，几乎都能手动切换到“所有文件”选项，然后选一个 report.exe 或 data.zip。accept 只影响界面过滤，不触发任何校验逻辑，也不拦截提交。
- DevTools 里直接删掉
accept属性，就能上传任意类型 - 拖拽文件进 Drop 区域完全绕过 accept 界面
- curl 或 Postman 发请求时，
accept根本不参与传输 - 所以它只是体验优化，不是安全控制——这点容易被误判为“已限制”
JavaScript 怎么补上 accept 没干完的事
监听 change 事件，从 input.files[0] 提取真实扩展名做白名单比对，比依赖 file.type 更可靠（后者常为空或被伪造）。
const input = document.querySelector('input[type="file"]');
const allowedExts = ['.xls', '.xlsx'];
input.addEventListener('change', (e) => {
const file = e.target.files[0];
if (!file) return;
const ext = '.' + file.name.split('.').pop().toLowerCase();
if (!allowedExts.includes(ext)) {
alert('仅支持 .xls 和 .xlsx 表格文件');
e.target.value = ''; // 清空输入框，避免残留非法文件
}
});
- 注意：用
file.name解析扩展名，而不是file.type - 大小写要统一转小写，避免
.XLSX被拒 - 清空
e.target.value是关键一步，否则用户改完提示后还能点提交 - 如果支持多文件上传，得遍历
e.target.files全部检查
后端才是唯一能拦住恶意表格的地方
前端所有检查都可被跳过，服务端必须读文件头（magic bytes）确认真实格式。比如 .xlsx 文件开头一定是 PK\x03\x04，而伪造的 .xlsx 实际是 PE 头（MZ\x90），一读就露馅。
立即学习“前端免费学习笔记（深入）”；
- Node.js 推荐用
file-type库解析 buffer 前 12 字节 - Python 用
python-magic或openpyxl.load_workbook()尝试加载（失败即非真 Excel） - 别信
req.file.mimetype或$_FILES['f']['type']——这是客户端传的，可篡改 - 上传后重命名文件，剥离原始扩展名，按检测结果附加安全后缀（如
upload_abc.xlsx→safe_7d2a.xlsx）
最容易被忽略的是：即使 MIME 和扩展名都匹配，也要打开文件验证结构有效性。有些攻击者会把恶意脚本藏在 Excel 的宏或 XML 引用里，光看头信息不够。
