Javascript 查看/下载API在React功能组件中返回的文件

我有一个返回文件（附件）的API。如何创建React功能组件，以便在浏览器中打开API返回的文件（如果是PDF或图像），或者在浏览器中无法浏览时下载？ 我的组件如下所示：

从“React”导入React
从“Axios”导入Axios；
//const file=agent.Attachments.get（'b9e7b6d2-a2b5-47a1-bc6a-08d7e9176cd3'）；
const file=Axios.get（'localhost:5000/api/attachments/b9e7b6d2-a2b5-47a1-bc6a-08d7e9176cd3'）；//这将返回一个文件
导出常量附件=（）=>{
返回(
{/*我想打开或下载我从axios获得的文件*/}
)
}
导出默认附件；

按如下方式更改组件：

import React，{useState，useffect，useCallback}来自'React'；
从“Axios”导入Axios；
常量附件=（）=>{
const[file，setFile]=useState（未定义）；
const axiosGetFile=useCallback（异步（）=>{
试一试{
const res=等待Axios.get(
'本地主机：5000/api/attachments/b9e7b6d2-a2b5-47a1-bc6a-08d7e9176cd3'
);
console.log（res）；//{
axiosGetFile（）；
}, []);
返回；
};
导出默认附件；

---

通过使用

setFile

您的组件在获得文件后会重新渲染，然后您可以处理它，但我应该知道您的文件类型。

您的问题就像一个梯子，我们应该先解决第一步。然后再解决第二步。因此我的问题有两个步骤。首先我留下答案，然后您帮助我解决请看你的文件是什么，毕竟，我会编辑我的答案以获得最终结果。我从axios那里得到一个承诺（这是登录到控制台的内容）：promise{}proto:promise-catch:ƒcatch（）构造函数：ƒpromise（）最终：ƒfinally（）然后：ƒthen（）符号（Symbol.toStringTag）：“promise”proto:Object[[PromiseStatus]：“已解决”[[承诺价值]：“主键！2�单程飞行�[内容类型]。xml@HaniDraidi，好的，现在检查新的编辑并将console.log放入您的问题中。现在我在控制台上得到了这个：PK。它似乎以二进制格式记录文件（它是一个docx文件），如果浏览器无法打开，我如何查看或下载该文件。您只需使用

窗口。打开

并将URL放入

打开

功能`但是，后端应向您传递扩展名，然后您意识到它是否可在浏览器上显示，如果可显示，则显示，如果不可显示，则使用

窗口。打开（URL）

。我不想传递URL，因为这将允许任何人在不使用受保护的api的情况下直接预览/下载文件。是否有其他方法可以打开/下载api返回的文件而不使用URL？