无法触发下载，因浏览器对可预览资源（如pdf、图片）默认打开而非下载；download属性仅对同源url或blob url生效，跨域链接被忽略，且服务端须返回content-disposition: attachment响应头。
为什么直接用 @#@#@#@#@#@#@#@#@#@0，如果服务器没配 Content-Disposition: attachment，PDF 就会在新标签页打开，而不是下载。
download 属性只对同源 URL 和 blob URL 有效
download 属性只对同源 URL 和 blob URL 有效这是最容易踩的坑：download 属性看似万能，实际有严格限制。它仅在以下两种情况生效：
- 链接目标是当前域名下的相对路径或绝对路径（如
<a href="/files/data.csv" download="data.csv"></a>） - 链接目标是通过
URL.createObjectURL()生成的blob:URL（如从 API 响应构造的 Blob） - 跨域 URL（如
https://cdn.example.com/file.zip）加上download属性后，点击会失效——浏览器静默忽略，仍按普通跳转处理
验证方式很简单：右键链接 → “另存为”，如果菜单项灰掉或没反应，基本就是跨域或 MIME 类型问题。
服务端必须返回正确的 Content-Disposition 响应头
前端加 download 不起作用？大概率是后端没配对。关键不是文件后缀，而是 HTTP 响应头：
Content-Disposition: attachment; filename="report.xlsx"
注意三点：
- 值必须是
attachment，不能是inline -
filename参数建议用 ASCII 字符；含中文需编码为filename*=UTF-8''%E6%8A%A5%E5%91%8A.xlsx - 响应状态码应为
200，避免302重定向——重定向后响应头丢失，download失效
Node.js（Express）示例：res.setHeader('Content-Disposition', "attachment; filename*=UTF-8''" + encodeURIComponent(filename));
动态生成文件并触发下载的可靠做法
当文件内容来自 JS 计算、API 响应或用户输入时，必须走 Blob + URL.createObjectURL() 路径：
- 用
fetch获取二进制数据（response.arrayBuffer()或response.blob()） - 创建
Blob对象，显式指定type（如"text/csv;charset=utf-8"） - 调用
URL.createObjectURL(blob)得到临时 URL - 创建
<a></a>元素，设置href和download，然后.click() - 最后记得
URL.revokeObjectURL(url)防止内存泄漏
关键点：Blob URL 是同源的，download 必然生效；且绕过了服务端配置依赖。
download 属性都是摆设。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
