当使用 html `

浏览器会尝试将 download 属性的值（即含 ? 的整个字符串）作为本地保存的文件名。但根据 html 规范，download 属性值必须是有效的文件名（valid filename），而 ?、/、: 等字符在绝大多数操作系统中均不被允许出现在文件名中。因此，主流浏览器（chrome、edge、firefox）会执行“静默规范化”（graceful sanitization）：自动将非法字符替换为下划线 _，最终导致下载文件名为：

_storage_1_aviary-image-1429352137570.jpeg_1646327099

✅ 正确做法是职责分离：

• href：承载完整可访问的资源地址（含查询参数，用于服务端鉴权、缓存控制或 CDN 签名）；
• download：仅提供用户期望的原始文件名（不含协议、路径、查询字符串）。

因此，在后端（如 Laravel Controller 或 Blade 上下文）中，需额外提取纯净文件名。推荐方式如下：

// 示例：从 URL 中安全提取文件名（忽略查询参数）
$url = $item['url']; // "/storage/1_aviary-image-1429352137570.jpeg?1646327099"
$filename = basename(parse_url($url, PHP_URL_PATH)); // "1_aviary-image-1429352137570.jpeg"

// 传递给视图
return view('your-view', ['item' => array_merge($item, ['filename' => $filename])]);

对应 Blade 模板代码应改为：

使用华数设计生成高保真HTML原型、演示文稿、动画和设计评审

使用经过文档化的设计技能，从真实的品牌或项目背景中生成HTML原生原型、幻灯片、动态演示、可视化图表和评审流程。

下载

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

⚠️ 注意事项：

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

• download 属性仅对同源 URL 生效（跨域链接即使设置了 download，浏览器也会忽略并执行普通跳转）；
• 若服务端使用重定向（如 302 到真实资源），download 属性可能失效，建议确保 href 直接指向可下载的静态资源或支持 Content-Disposition: attachment 的接口；
• 不要依赖客户端解析 href 提取文件名（如用 JS 截取），既不健壮也不安全；应在服务端完成净化；
• 对于用户上传文件，务必校验 $item['filename'] 的合法性（防止路径遍历或 XSS 风险），建议使用白名单过滤或 basename() + pathinfo() 组合处理。

总结：download 属性的本质是“用户侧文件名提示”，而非“资源定位”。始终确保其值为符合操作系统规范的纯净文件名，将 URL 中的语义信息（如签名、版本、追踪参数）保留在 href 中——这是兼顾安全性、兼容性与用户体验的最佳实践。