ReactJs-Chrome中的触发文件下载

Question

我正在尝试在我的React应用程序中添加指向网络文件的链接，以便在单击时下载文件。 像这样：

<a href="\\server\Test\test.xlsx">Direct link Test</a>

它在常规的html页面中可以正常工作，但是在Chrome的ReactJS应用中，出现错误：

不允许加载本地资源：file：//server/Test/test.xlsx

有什么建议或解决方法吗？ 我尝试了各种正斜杠，反斜杠，window.open等。

更新：当我检查浏览器中的链接时，该路径似乎以站点根URL开头。 因此，当我将鼠标悬停在代码检查器中的路径上时，会看到以下内容：

http：//some-intranet-site.com/ \\ \\ server \\ Test \\ test.xlsx

“ / \\\\”不是错字。

Answer 1

尝试将target="_blank"到标签中

注意：正如其他人提到的，这只是工作范围。 解决此问题的最佳方法是向端点发出http请求。

Answer 2

首先导入文件，然后尝试处理下载功能。 检查以下代码。

import template from '../server/Test/test.xlsx';
...
...
...
<input type="button" onClick={() => setTimeout(() => window.open(template), 100)} value="Download file" />

这将为您工作！

Answer 3

使用定位标记上的download属性。

<a href="\\server\Test\test.xlsx" download>Direct link Test</a>

请记住，这不是执行此操作的好方法。 诸如此类的最佳做法是对端点进行http调用，或使用javascript的fetch方法