表单提交文件最稳，需设enctype="multipart/form-data"且input加name；fetch+FormData更灵活但勿设Content-Type；XMLHttpRequest支持上传进度；拖拽上传须preventDefault；后端校验至关重要。
form 表单提交文件最稳
浏览器里发文件，<form> 是最直接、兼容性最好、服务端也最省心的方式。不用额外写 JS 就能触发上传，连 fetch 都可能绕弯子。
- 必须设
enctype="multipart/form-data"，漏了就变成纯文本发送，后端收不到二进制内容 -
<input type="file">要加name属性，否则后端拿不到字段名（比如name="avatar"） - 如果用
multiple，后端收到的是文件列表，不是单个文件，别按单文件逻辑处理 - 不要给
<form>加onsubmit="return false"却不手动 submit，会静默失败
fetch + FormData 发送更灵活
需要控制进度、取消、或和 JSON 混传时，fetch 配合 FormData 是实际项目里的主力方案。
-
FormData.append()传文件时，第二个参数要是File对象（比如input.files[0]），不是路径字符串 - 别手动设
Content-Type头——fetch会自动生成带 boundary 的 multipart header，设了反而破坏格式 - 如果同时 append 字符串字段（如
FormData.append("id", "123")），后端得按 multipart 解析，不能当纯 JSON 读 - 注意
File对象的lastModified和name会一并传过去，有些后端靠这个做校验
XMLHttpRequest 上传大文件要监听 progress
传几百 MB 文件时，用户需要知道卡在哪，XMLHttpRequest 的 upload.onprogress 是唯一可靠选择。
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
-
fetch目前不支持上传进度，别硬套 - 监听的是
xhr.upload.onprogress，不是xhr.onprogress（后者是下载） -
event.loaded和event.total可能为 0，尤其在 CORS 场景下，得加event.lengthComputable判断 - 别在
onload里直接 parseresponseText，大文件响应体可能被截断，优先用response.json()
拖拽上传要注意 drop 事件默认行为
实现拖拽上传时，drop 事件不阻止默认行为，页面会直接打开文件，上传就没了。
立即学习“前端免费学习笔记（深入）”；
- 必须在
dragover和drop两个事件里都调event.preventDefault() -
event.dataTransfer.files和input.files类型一致，可直接塞进FormData - 拖多个文件时，
dataTransfer.items可能包含目录（kind === "file"才安全），别无脑遍历 - 移动端不支持
drag系列事件，拖拽上传本质是桌面端功能，别把它当全平台方案
真正难的不是“怎么发”，而是后端怎么接：边界解析、临时文件清理、大小限制、文件类型白名单、病毒扫描……前端发得再准，后端漏一条校验，就等于裸奔。
