HTML上传文件怎么限制只能选txt格式-html教程-PHP中文网

accept 属性仅能默认过滤文件选择对话框中的文件类型，无法阻止用户手动切换“所有文件”后上传非法类型，真正安全限制必须依赖后端基于文件内容（如 magic bytes）的校验。

html上传文件怎么限制只能选txt格式

accept 属性只能过滤文件选择对话框的默认视图，不能阻止用户手动切换“所有文件”后选中非法类型——真正限制必须靠后端校验。

用 `accept` 让浏览器默认只显示 .txt 文件

给 <input type="file"> 加上 accept=".txt" 或更准确的 MIME 类型 accept="text/plain"：

<input type="file" accept=".txt,text/plain">

这样在大多数桌面浏览器（Chrome、Edge、Firefox）打开文件选择框时，默认只列出 .txt 文件。但注意：

Windows 上用户点下拉菜单仍可选“所有文件”，然后手动挑一个 evil.jpg 也能通过
移动端 Safari 对 text/plain 支持差，必须加 .txt 才生效
不要写成 accept="txt"——漏掉点号会完全失效

用 JavaScript 检查 `files[0].name` 后缀名

前端拦截体验更好，但仅作提示，不能替代后端：

Wechat HTML Publisher

直接上传HTML富文本到微信公众号草稿箱。支持完整的HTML格式,无需Markdown转换。

下载

document.querySelector('input[type="file"]').addEventListener('change', function (e) {
  const file = e.target.files[0];
  if (!file) return;
  const ext = file.name.split('.').pop().toLowerCase();
  if (ext !== 'txt') {
    alert('请上传 .txt 文件');
    e.target.value = ''; // 清空 input，防止提交
  }
});

关键点：

别依赖 file.type：空值、""、或误报（比如记事本另存为 ANSI 编码时可能返回 text/plain，但 UTF-8 BOM 可能被识别为 application/octet-stream）
用 file.name 提取扩展名最稳，大小写统一转小写再比对
这个检查只防手误，绕过 JS 非常容易（禁用脚本、直接发 POST 请求）

后端必须校验真实内容，不是扩展名

用户把 malware.exe 改名为 notes.txt 就能骗过所有前端检查。安全做法是读文件头（magic bytes）：

Node.js：用 file-type 包解析 buffer 前几字节，确认是纯文本类 MIME（如 text/plain），且不含可执行特征
Python：用 python-magic 调 magic.from_buffer()，拒绝 application/x-dosexec 等类型
PHP：用 finfo_open(FILEINFO_MIME_TYPE) + finfo_file()，别信 $_FILES['f']['type']
Java：Spring 中禁用 MultipartFile.getContentType()，改用 Files.probeContentType() 或 Tika