8wDlpd.png
8wDFp9.png
8wDEOx.png
8wDMfH.png
8wDKte.png

如何使用 axios 下载文件

Austin Wolff 2月前

176 0

我正在使用 axios 进行基本的 http 请求,例如 GET 和 POST,效果很好。现在我也需要能够下载 Excel 文件。使用 axios 可以实现吗?如果可以,有人有示例代码吗?

我正在使用 axios 进行基本的 http 请求,例如 GET 和 POST,效果很好。现在我也需要能够下载 Excel 文件。使用 axios 可以实现这一点吗?如果可以,有人有示例代码吗?如果没有,我还可以在 React 应用程序中使用什么来做同样的事情?

帖子版权声明 1、本帖标题:如何使用 axios 下载文件
    本站网址:http://xjnalaquan.com/
2、本网站的资源部分来源于网络,如有侵权,请联系站长进行删除处理。
3、会员发帖仅代表会员个人观点,并不代表本站赞同其观点和对其真实性负责。
4、本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报
5、站长邮箱:yeweds@126.com 除非注明,本帖由Austin Wolff在本站《express》版块原创发布, 转载请注明出处!
最新回复 (0)
    1. 使用 Axios 下载文件 responseType: 'blob'
    2. 使用 Axios/Server 响应中的 blob 创建文件链接
    3. 创建 <a> HTML 元素,并将 href 链接到步骤 2 中创建的文件链接并单击该链接
    4. 清理动态创建的文件链接和 HTML 元素
    axios({
        url: 'http://api.dev/file-download', //your url
        method: 'GET',
        responseType: 'blob', // important
    }).then((response) => {
        // create file link in browser's memory
        const href = URL.createObjectURL(response.data);
    
        // create "a" HTML element with href to file & click
        const link = document.createElement('a');
        link.href = href;
        link.setAttribute('download', 'file.pdf'); //or any other extension
        document.body.appendChild(link);
        link.click();
    
        // clean up "a" element & remove ObjectURL
        document.body.removeChild(link);
        URL.revokeObjectURL(href);
    });
    

    查看 https://gist.github.com/javilobo8/097c30a233786be52070986d8cdb1743

    全部版权归于: https://gist.github.com/javilobo8

    的更多文档 URL.createObjectURL 释放对象对于防止内存泄漏至关重要 URL.revokeObjectURL 。在上面的函数中,由于我们已经下载了文件,因此我们可以立即撤销该对象。

    每次调用 createObjectURL() 时,都会创建一个新的对象 URL,即使您已经为同一对象创建了一个 URL。当您不再需要它们时,必须通过调用 URL.revokeObjectURL() 来释放它们。

    当文档被卸载时,浏览器会自动释放对象 URL;但是,为了获得最佳性能和内存使用率,如果有可以安全明确卸载它们的时间,则应该这样做。

返回
作者最近主题: