当在 `` 标签中为 `download` 属性直接赋值包含查询字符串（如 `?1646327099`）的 url 时，浏览器会将非法文件名字符（如 `?`、`/`、`&` 等）自动替换为下划线 `_`，造成下载文件名异常；正确做法是分离 `href`（含完整 url）与 `download`（仅纯文件名）。

在 Web 开发中，利用 HTML5 的 属性实现前端触发文件下载是一种轻量且常用的方式。但一个容易被忽视的细节是：download 属性的值必须是一个合法的文件名（filename），而非完整 URL。浏览器在解析该属性时，会严格校验其内容是否符合操作系统对文件命名的规范——而查询字符串中的 ?、=、& 等字符在绝大多数系统中均属于非法文件名字符。因此，当您传入类似 "/storage/1_aviary-image-1429352137570.jpeg?1646327099" 作为 download 值时，浏览器（如 Chrome、Edge）会静默地将这些非法字符替换为下划线 _，最终生成类似 _storage_1_aviary-image-1429352137570.jpeg_1646327099 的错误文件名。

关键要明确两个职责分离：

• href 属性：负责指定资源的真实访问地址（可含协议、路径、查询参数、签名、缓存 busting 时间戳等）；
• download 属性：仅用于指定用户保存时的建议文件名（basename），不含路径、无协议、无查询字符串。

✅ 正确实现方式如下（Laravel Blade 示例）：

<a href="https://www.php.cn/link/953e2ad25261d78a67bc9b4da4016994'url'] }}" 
   class="btn btn-sm btn-default" 
   download="https://www.php.cn/link/953e2ad25261d78a67bc9b4da4016994'filename'] }}" 
   target="_blank">
    <span class="fa fa-download"></span> 下载
</a>

其中，$item['url'] 应保持完整可访问链接（如 /storage/1_aviary-image-1429352137570.jpeg?1646327099），而 $item['filename'] 必须提取为纯净文件名，例如：

Html2md

使用 Readability + Turndown 将 HTML 页面转换为干净的、Agent 友好的 Markdown。去除导航栏、广告、页脚、Cookie 横幅、社交按钮等干扰元素。支持 URL...

下载

立即学习“前端免费学习笔记（深入）”；

// PHP 后端示例（Laravel Controller 或 Accessor 中）
$filename = basename(parse_url($fullUrl, PHP_URL_PATH)); // → "1_aviary-image-1429352137570.jpeg"

⚠️ 注意事项：

• download 属性仅对同源 URL 生效；若 href 指向跨域资源（如 CDN、S3 公开链接），多数现代浏览器会忽略 download 属性，退化为普通跳转或新标签页打开；
• 不要尝试通过 JS 动态拼接 download 值并保留查询参数——无效且不安全；
• 若需动态生成带时间戳的文件名（如防止缓存），应将时间戳融入文件名本身（如 report_20240301_v2.pdf），而非依赖 URL 查询参数；
• 在服务端返回文件时，更可靠的命名方式是通过 Content-Disposition 响应头（如 attachment; filename="original.jpg"），该方式不受同源限制且完全可控。

总结：download 属性的本质是“客户端重命名提示”，不是 URL 解析器。始终确保其值为合规、简洁、无路径、无协议、无查询字符串的纯文件名。结构清晰的前后端协作（后端提供 url + filename 两个字段）是避免此类问题最稳健的实践。