HTML5的accept属性仅作前端友好提示，无法真正限制文件类型；可靠校验需结合JavaScript读取文件头（magic number）与后端基于文件内容的双重验证。
HTML5 本身不能真正限制文件类型，
属性只是提示浏览器过滤文件选择器中的可选文件，用户仍可手动取消过滤、拖入任意文件，或通过开发者工具绕过。真正的类型校验必须在 JavaScript 中读取
或检查文件头（magic number），并在后端再次验证。
用
属性做
前端
友好筛选
它只影响文件选择对话框的默认过滤行为，不提供安全保证，但能提升用户体验：
：显示所有图片类型（
、
等）
：按扩展名匹配（注意开头的点不能省略）
：按 MIME 类型匹配（依赖浏览器对文件头的识别能力）
多个值用逗号分隔，如
该属性对
有效，对拖放上传无直接影响
用 JavaScript 检查
和扩展名
是浏览器根据文件头或扩展名推测出的 MIME 类型，不可靠（例如空文件、改后缀的文件会返回空字符串或错误类型），需配合扩展名二次判断：
更可靠的校验：读取文件头（Magic Number）
绕过扩展名和
的欺骗，直接读取文件前几个字节判断真实类型。例如 PNG 文件头是
，JPEG 是
：
立即学习
“
前端免费学习笔记（深入）
”；
Eclipse导入Android或其他的JAVA项目的正确方法 WORD版
本文档主要讲述的是Eclipse导入Android或其他的JAVA项目的正确方法；希望本文档会给有需要的朋友带来帮助；感兴趣的朋友可以过来看看
下载
使用
读取前 4 字节
用
解析字节序列
比对预定义的 magic bytes 表（注意字节序和长度）
适合关键业务场景（如头像上传、证件扫描件），但增加 JS 开销
示例片段（校验 JPEG）：
后端必须重复校验，且不能信任任何前端传来的字段
前端所有校验都可被跳过：
可被移除，JS 可被禁用或篡改，
请求头可伪造。后端必须：
忽略客户端传来的
和
用服务端库（如 Python 的
、Node.
js
的
）读取文件头识别真实类型
对图片类文件，尝试用图像解码库打开（如
、
），防止恶意构造的“图片”触发解析漏洞
限制文件大小、存储路径、执行权限（如禁止上传到可执行目录）
最常被忽略的一点：即使前端做了完整校验，只要没在服务端重做一遍，就等于没做。文件类型限制不是「前端做一次 + 后端做一次」，而是「后端必须做，前端只是辅助」。
acceptFile.typeacceptaccept="image/*"image/jpegimage/pngaccept=".pdf,.docx"accept="application/pdf"accept="image/png,image/jpeg,.svg"File.typeFile.type
File.type89 50 4E 47FF D8 FFFileReader.readAsArrayBuffer()Uint8Arrayconst reader = new FileReader();
reader.onload = function(e) {
const buffer = e.target.result;
const view = new Uint8Array(buffer, 0, 3);
if (view[0] === 0xFF && view[1] === 0xD8 && view[2] === 0xFF) {
console.log('确认是 JPEG');
}
};
reader.readAsArrayBuffer(file.slice(0, 3));acceptContent-TypefilenameContent-Typepython-magicfile-typePILsharp