Javascript 无法从URL下载图像

在我的react应用程序中，我尝试使用以下代码从S3URL下载一个图像

<a href={ele.payment_receipt} download target="_blank" class="text-link-3 fw-3 ">
                        <i class="icon-download mr-2"></i>Download</a>

其中ele.payment\u receive是文件的链接。但当我点击链接时，它会打开新的标签，而不是下载。我尝试过在线解决方案，但所有在线解决方案都使用相同的下载方法。有人能告诉我我在这里做错了什么吗？提前谢谢

编辑

---

映像的URL是s3存储桶映像的签名URL，该映像将在60秒后过期。

您不能使用

下载
属性下载位于不同URL（跨源）中的文件，以获取更多信息

相反，您可以做的是，进行API调用，将其转换为blob并下载。您可以参考下面的操作方法。
有关您的信息，Firefox和Chrome 65+仅支持同源下载链接，可能是为了安全措施

Web超文本应用程序技术工作组（WHATWG）还建议，承载相关图像/文件的Web服务器需要发送一个内容处置HTTP头，以便下载

简言之：

只有在以下情况下，才能使用强制下载图像/文件：

承载图像/文件的服务器也表示应该下载该图像/文件，
或
图像/文件来自同一域

请检查来自服务器的内容处置标头是否来自服务器。希望这能有所帮助。
一个从客户端缓存（如flux、redux）下载数据的简单组件

设计用于browserify或webpack

安装时使用：

npm i react下载链接

import DownloadLink from "react-download-link";

<DownloadLink
    label="Save"
    filename="myfile.txt"
    exportFile={() => "My cached data"}
/>

从“反应下载链接”导入下载链接；
“我的缓存数据”}
/>
尝试删除
target=“\u blank”
@HardikChaudhary现在在同一个选项卡中打开图像，而不是新的选项卡工作示例：@HardikChaudhary该示例不适用于不同的源URL，您可以从下面的文章中获得帮助：但是，如果请求是向其他域发出的，那么CORS问题将出现，这需要与服务器端支持CORS。我已经使用了这个答案。我有django后端，它为s3对象提供SignedUrl，我正在使用该url下载它