AxiosStream-使用Axios和Blob对象实现文件流下载（axios二进制流文件下载）

最新推荐文章于 2024-08-18 03:43:14 发布
最新推荐文章于 2024-08-18 03:43:14 发布
阅读量4k 收藏 3
点赞数
分类专栏： vue React 前端 文章标签： axios
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/mehnr/article/details/106141257
版权
AxiosStream是一个用于WEB项目的库，借助axios和Blob对象实现文件流下载。在使用前需先安装axios。它解决了通过Axios进行文件流下载的问题。用户需要导入AxiosStream，指定下载路径和包含扩展名的文件名来调用方法。
摘要由CSDN通过智能技术生成

AxiosStream

通过axios下载流文件

徽标

该库仅适用于使用axios作为HTTP请求库的WEB项目

**请先安装axios，然后再使用axios-stream **

##它解决的问题：

使用Axios和Blob对象实现文件流下载

如何使用：

1.安装

npm install axios-stream或yarn add axios-stream

2.参考

从“ axios-stream”导入AxiosStream；

3.调用方法

const downFileName =<
最低0.47元/天 解锁文章
锐视创想
关注
  • 0
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
使用axios下载文件流
zhao1949的专栏
07-13 832
https://www.jianshu.com/p/ea9e96a4d084 https://www.jianshu.com/p/a79c176688de axios({ method: "post", url: "你的url" // 这里可以在header中加一些东西，比如token }) .then(res => { console.log("response: ", res); // new Blob(
axios教程
绝圣弃智-零的博客
03-06 2822
axios 特性 Make XMLHttpRequestsfrom the browser Make httprequests from node.js 支持 PromiseAPI 拦截 request 和response 传输 request 和response data 取消 requests 自动转换 for JSON data 提供防XSRF漏洞攻击的客户...
Axios 接收导出文件流
我叫陈小皮。
01-04 4575
请求时，用blob格式去接收，设置responseType: ‘blob’ 标题在接口返回错误时，需要将接收到的 blob 转为 json 做错误提示 接口请求 export function exportFile(queryInfo) { return http({ url: 'xxx', method: 'get', params: queryInfo, headers: { 'Content-Type': 'application/octet-strea
六、Vue3网络[axios]
黑日里不灭的light
06-05 2038
解释：主要用到onDownloadProgress方法接收后端传来的流式输出。
Axios的几种不同的responseType处理响应，以及blob与arraybuffer的解析
阿牛哥的博客
07-29 1274
Axios的几种不同的responseType处理响应，以及blob与arraybuffer的解析
axios流输出excel
weixin_34354173的博客
01-28 181
2019独角兽企业重金招聘Python工程师标准>>> ...
axios设置 responseType为 “stream“流式获取后端数据
SunFlower914的博客
06-05 4447
axios+stream这个方法和网上搜索出来的大多数流失接口方法一致，但是在axios中设置responseType为 "stream"，后控制台会警告：The provided value 'stream' is not a valid enum value of type XMLHttpRequestResponseType.因为axios基于XMLHttpRequest原生，而并XMLHttpRequest原生不直接支持responseType: 'stream'这个值。可以使用fetch来发送请求
使用Axios进行文件下载（文件流）
热门推荐
看陌生的风景的博客
11-18 1万+
axios download
axios / fetch 实现 stream 流式请求
天问博客-专注于大前端技术
08-18 8916
axios 是一个支持node端和浏览器端的易用、简洁且高效的http库。本文主要介绍 axios / fetch 如何实现 stream 流式请求，注意这里需要区分 node 环境和浏览器环境。
axios 获取后台stream数据
最新发布
weixin_32921457的博客
08-18 40
我整理的一些关于【Java】的项目学习资料（附讲解～～）和大家一起分享、学习一下：https://d.51cto.com/bLN8S1如何使用 Axios 获取后台 Stream 数据 在现代前端开发中，数据的获取和处理是非常重要的一步。Axios 是一个流行的 HTTP 客户端，它使我们能够轻松地向后端发送请求并获取数...
JavaScript AJAX stream 流式显示
chenqianggang的专栏
11-13 772
当使用AJAX进行信息交互的时候，如果服务器返回的信息比较大，那么相对于传送完成之后的统一显示，流式显示就比较友好了。 　　流式实现 　　原理就是设置定时器，定时的查看AJAX对象的状态并更新内容，如果传送完成，就取消定时器。 　　function ajax_stream(url,data,element) { 　　var xmlHttp=null;
在vue中使用axios实现post方式获取二进制流下载文件(实例代码)
10-15
在Vue.js应用中，使用axios库来实现POST方式获取二进制流并下载文件是一个常见的需求，特别是当需要从服务器获取如Excel、PDF等特定格式的文件时。本篇文章将详细解析这一过程，并提供相关代码实例。 首先，我们来...
vue-以文件流-blob-的形式-下载-导出文件操作
10-14
以下将详细介绍如何以文件流（Blob）的形式在Vue中下载和导出文件。 首先，确定服务器返回的数据类型至关重要。在发送HTTP请求时，我们需要设置`responseType`为`blob`，以便接收二进制大型对象（Blob）。这可以在...
vue+axios展示二进制文件流图片
01-20
在这种情况下，如果图片是以二进制文件流的形式传输，我们需要特殊的方法来处理和显示这些数据。本文将详细讲解如何利用axios库进行二进制文件流的请求，并通过两种方式在Vue组件中展示这些图片。 1. **axios请求二...
Vue——axios请求
weixin_38278993的博客
07-23 771
axios({ method:'get', url:'http://bit.ly/2mTM3nY', responseType:'stream' }) .then((res) => { console.log(res); }) .catch((err) => { console.log(err); }); { // `url` 是用于请求的服务器 URL url: '/user', // `method` 是创建请求时使用的方法 met..
axios中文文档
agg7911的博客
07-25 408
axios中文文档 axios 基于promise用于浏览器和node.js的http客户端 特点 支持浏览器和node.js 支持promise 能拦截请求和响应 能转换请求和响应数据 能取消请求 自动转换JSON数据 浏览器端支持防止CSRF(跨站请求伪造) 安装 npm安装 $ npm install axios b...
axios网络请求
weixin_43294560的博客
02-15 2289
axios网络请求 1、安装 cnpm install axios -S 2、在main.js中引入 import Axios from 'axios' 3、在main.js中将Axios挂载到Vue的原型上 Vue.prototype.$axios=Axios 4、在组件函数中使用 get请求: this.$axios.get("url") .t...
使用自定义流事件处理实现EventStream流式输出
lok_p的博客
12-21 1714
使用自定义流事件处理实现EventStream流式输出
axios 下载二进制文件
09-12
在使用axios下载二进制文件时，你可以将responseType设置为 'blob'，然后将返回的二进制数据保存到文件中。以下是一个示例： ```javascript const axios = require('axios'); const fs = require('fs'); axios({ url: 'http://example.com/file', method: 'GET', responseType: 'blob', // 设置响应类型为二进制数据 }) .then((response) => { const contentDisposition = response.headers['content-disposition']; const filename = contentDisposition.split(';')[1].split('=')[1].replace(/"/g, ''); // 获取文件名 const fileStream = fs.createWriteStream(filename); response.data.pipe(fileStream); fileStream.on('finish', () => { fileStream.close(); console.log('文件下载成功'); }); }) .catch((error) => { console.error('文件下载失败', error); }); ``` 这个示例中，我们发送了一个GET请求，设置响应类型为'blob'。在响应返回后，我们获取文件名并创建一个可写的文件流，然后将响应的数据写入文件流中，最后关闭文件流。这样就能将下载的二进制文件保存到本地了。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

锐视创想

支持作者，是作者创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值