使用 axios 获取文件（内容和文件名）

Posted 2023-02-22

【中文标题】使用 axios 获取文件（内容和文件名）

【英文标题】：GET file (content and filename) with axios

【发布时间】：2019-06-12 04:13:26

【问题描述】：

有一个提供可下载文件的 API 端点 - 当直接从浏览器访问 url 时 - 文件会自动保存。但是，我想从我的应用程序中定位给定的端点，并将文件名和内容获取到我的应用程序的 redux 商店中的减速器。

我对所有 API 请求都使用 axios。在这种情况下，我试图这样做：

axios(
    url: API_ENDPOINT_URL,
    method: "GET",
    headers,
).then((response) => 
    // do some stuff 
    console.log("response ", response)
)

在此设置中，response 仅包含 data，没有文件名。这个怎么办？

【问题讨论】：

那么response.data 包含什么？

“浏览器不支持通过 AJAX 请求下载文件。您可以查看此 ***.com/questions/32545632/... 以及此 ***.com/questions/35206589/… 以获得更多见解和一些解决方法“来自 ***.com/questions/49832836/…

见Get a file name before saving it。是在response.data.headers吗？

@MaieonBrix - 虽然您对此用例的假设可能是准确的，但做出该评估还为时过早。 OP 可能正在查看可用作 BLOB 的字节（流）数据。

@RandyCasburn 是的，你是绝对正确的，我确实急于回答。对不起

【参考方案1】：

您可以在 axios 中添加响应类型，可以是流或 blob（取决于文件类型）

axios(
  method:'get',
  url:'endpoint_url',
  responseType:'stream'
)
  .then(function (response) 
    response.data.pipe(fs.createWriteStream('file_name.jpg'))
  )

这直接来自 axios 文档。如果您还需要其他东西，请告诉我

【讨论】：

这是如何获取文件名的？

嘿，Jacopo - 我没有对你投反对票，但你的答案假设是 NodeJS。 OP 使用了术语“reducer”，这意味着 ReactJS 在浏览器中运行。 fs 在浏览器中不可用。

是的，我明白你的意思，“问题”是对于上面的示例，我在节点上对其进行测试，以便能够重新组装文件。问题是在前端部分你可以创建一个 Blob 而不是使用 fs