17370845950

IE9及以下不支持File API和FormData，需用onchange属性和表单提交；IE10–11支持FormData但拒绝Blob对象，且禁用手动设置Content-Type，须维护两套上传逻辑。

IE 浏览器（尤其是 IE9 及更早版本）根本不支持 HTML5 的 File API 和 Fo

rmData，所谓“HTML5 文件上传”在这些版本里压根无法运行——不是配置问题，是能力缺失。

IE9 及以下版本连 input[type="file"] 都不触发 change 事件？

这是典型的表现：点击选择文件后，document.getElementById('file').files 始终为空，addEventListener('change', ...) 完全不执行。因为 IE9- 没有 files 属性，也不支持现代事件绑定方式。

• 必须改用 onchange 属性写法（而非 addEventListener），且仅对表单提交有效
• 是唯一可靠入口
• 不要试图读取 this.files[0]——IE9 返回 undefined，只能走表单提交或 ActiveX

IE10–IE11 能用 FormData，但不支持 append('file', file) 传入 Blob？

IE10/11 实现了部分 FormData，但存在严重兼容缺陷：它只接受原生 的 files[0]，拒绝接受通过 new Blob([...]) 或 canvas.toBlob() 生成的 Blob 对象。

• 上传前务必检查 file instanceof Blob，IE 下若为 false（比如是 File 子类但被 polyfill 扰乱），需绕过处理
• 避免在 IE 中调用 formData.append('file', new Blob([...]))，会静默失败或报错 InvalidStateError
• 如需预览或裁剪，上传时仍要回退到原始 input.files[0]，而不是加工后的 Blob

用 XMLHttpRequest 上传时，IE10+ 报错 Access is denied？

这通常发生在尝试手动设置 xhr.setRequestHeader('Content-Type', ...) 上传文件时。IE 对 multipart/form-data 请求头有硬性限制：一旦使用 FormData，就不能手动设置 Content-Type，否则触发安全拦截。

• 删除所有类似 xhr.setRequestHeader('Content-Type', 'multipart/form-data; boundary=...') 的代码
• 让浏览器自动设置请求头——send(formData) 时 IE 会自动生成正确的 Content-Type 和 boundary
• 若需带 token，改用 URL 参数或 Authorization header（IE10+ 支持）

var xhr = new XMLHttpRequest();
xhr.open('POST', '/upload');
// ✅ 正确：不设 Content-Type，由浏览器自动生成
xhr.send(formData);
// ❌ 错误：IE 会立即报 Access is denied
// xhr.setRequestHeader('Content-Type', 'multipart/form-data; boundary=...');

真正麻烦的不是“怎么写”，而是得同时维护两套逻辑：一套走 FormData + fetch/XHR，另一套 fallback 到隐藏 表单提交或 ActiveX（仅限企业内网可信环境）。别指望一个 polyfill 能填平 IE 的底层断层。