带有下载属性的锚标签打开文件而不是下载

Question

在我的 Reactjs 应用程序中，我使用锚标记下载了如下所示的 txt 文件。

<a href="http://textfiles.com/......./sample.txt" download>download</a>

在那里我添加了下载属性来强制它下载而不是在浏览器选项卡中打开它。

但它仍然在同一个选项卡中打开而不是下载。任何人都可以帮我解决这个问题。

Answer 1

查看您的示例似乎您没有使用相同的来源，这可能会导致问题。

如果您尝试下载存在于同一来源的文件，那么我建议您使用相对 url 而不是绝对 url。

例子：

<a href="/public/sample.txt" download>download</a>

请看一下文档中的注释：

属性：下载

笔记：

• 此属性仅适用于同源 URL。
• 尽管 HTTP(s) URL 需要同源，但允许blob: URL和 data: URL，以便可以下载 JavaScript 生成的内容，例如在图像编辑器 Web 应用程序中创建的图片。
• 如果 HTTP 标头Content-Disposition : 给出与此属性不同的文件名，则 HTTP 标头优先于此属性。
• 如果 Content-Disposition: 设置为 inline，Firefox 会优先考虑 Content-Disposition，就像文件名大小写一样，而 Chrome 会优先考虑下载属性。