拖拽上传XML文件需同时阻止dragover和drop事件默认行为，通过event.dataTransfer.files[0]获取文件，校验类型或后缀，用FileReader.readAsText(file, 'UTF-8')读取，再以FormData.append('xml_file', file)二进制上传。
拖拽区域必须取消默认行为，否则文件会直接在浏览器中打开
XML 文件被拖入浏览器标签页时，默认会触发页面导航（显示 XML 内容），这不是上传，而是浏览器原生行为。要启用拖拽上传，必须对 dragover 和 drop 事件调用 event.preventDefault()，否则后续逻辑根本不会执行。
常见错误是只加了 drop 的 preventDefault，漏掉 dragover——没有它，drop 根本不会触发。
- 必须同时监听并阻止
dragover和drop - 不要在
dragenter上阻止，默认行为不影响，但可能引发重复判断 - 建议给拖拽区加
ondragover="event.preventDefault();"快速兜底（仅限简单场景）
从 DataTransfer 获取 XML 文件要用 files[0]，不是 item(0)
DataTransfer 对象的 files 属性是标准 FileList，而 items 和 types 主要用于跨应用拖拽（如从桌面拖入），对本地文件上传而言，files 更可靠、更直接。XML 文件和其他普通文件一样，走的是 files 路径。
别用 event.dataTransfer.items[0].getAsFile()，它在部分浏览器（尤其是 Safari）上返回 null；也别依赖 event.dataTransfer.files.item(0)，这是过时写法，且类型不安全。
立即学习“前端免费学习笔记（深入）”；
- 正确方式：
const file = event.dataTransfer.files[0] - 务必检查
file.type === 'text/xml'或后缀名（file.name.endsWith('.xml')），避免用户误拖其他格式 - XML 文件可能无 type（尤其 Windows 下），所以后缀校验不能省
读取 XML 内容推荐用 FileReader.readAsText()，别用 readAsDataURL
XML 是纯文本，用 readAsDataURL 会多一层 base64 编码，增加体积、解析成本和出错概率。上传前若需校验结构或提取字段，直接读成字符串最自然。
注意：XML 可能含 BOM 或指定编码（如 <?xml version="1.0" encoding="UTF-8"?>），readAsText(file, 'UTF-8') 显式声明编码可避免乱码，尤其当文件来自不同系统时。
const reader = new FileReader();
reader.onload = function(e) {
const xmlString = e.target.result;
// 可在此处用 DOMParser 解析，或直接发送到后端
};
reader.onerror = function() {
console.error('XML 读取失败');
};
reader.readAsText(file, 'UTF-8');
后端接收时注意 Content-Type 和命名，XML 不是 multipart/form-data 的“普通字段”
前端用 FormData 上传时，XML 文件应作为二进制 Blob 传入，而不是转成字符串再 append。否则后端收到的是文本内容，丢失原始编码与换行处理逻辑。
- 正确：
formData.append('xml_file', file)（file 是 File 对象） - 错误：
formData.append('xml_file', xmlString)（变成普通字段，无 filename、type 等元数据） - 后端需按 multipart 表单解析，例如 Node.js 的
busboy或 Python Flask 的request.files.get('xml_file') - 某些 API 要求
Content-Type: text/xml直接发送（非 form-data），此时要用fetch(url, { method: 'POST', body: file })，并手动设 header
