如何使用 webapi Core 在 React 中使用 axios.post 下载文件 [英] How to download files using axios.post in React using webapi Core

查看:28
本文介绍了如何使用 webapi Core 在 React 中使用 axios.post 下载文件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我用过这个如何使用 axios 下载文件.从 webapi 发布(它可能是这个的重复)来处理这个场景,但我没有成功.

I have used this How to download files using axios.post from webapi (It could be duplicate of this) to work on this scenario but i am not getting success.

 React: 
   axios.post("URL",{data:data, responseType: "blob"})

  1. 作为回应,我得到的是损坏的数据,而不是字节.
  2. ResponseType 适用于 get 请求,但为什么不适用于 post?

WebAPI 核心:返回文件(数组字节,应用程序/vnd.openxmlformats-officedocument.spreadsheetml.sheet", "test.xlsx");

推荐答案

这里是我如何能够下载托管在 S3 AWS 存储桶上的视频,

Here is how I could be able to download videos that are hosted on S3 AWS buckets,

const handleDownload = () => {
    const link = document.createElement("a");
    link.target = "_blank";
    link.download = "YOUR_FILE_NAME"
    axios
      .get(url, {
        responseType: "blob",
      })
      .then((res) => {
        link.href = URL.createObjectURL(
          new Blob([res.data], { type: "video/mp4" })
        );
        link.click();
      });
  };

然后我使用 onClick 在按钮中触发 handleDownload 功能.

And I trigger handleDownload function in a button with onClick.

函数中的url有来自S3存储桶的视频URL

The url in the function has the video URL from S3 buckets

这篇关于如何使用 webapi Core 在 React 中使用 axios.post 下载文件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆