文件流如何转换成url，三行代码搞定

最新推荐文章于 2024-03-07 21:36:23 发布
最新推荐文章于 2024-03-07 21:36:23 发布
阅读量5.1k 收藏 4
点赞数
分类专栏： 工作中遇到的问题 文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44738158/article/details/127725590
版权

最近在开发客服聊天的时候遇到后端给我返回文件流，需要我自己转换成url的需求

后端返回的文件流：
在这里插入图片描述
那么如何把文件流转换成url呢
首先需要在自己的请求中配置一下responseType:'blob'，把请求相应类型设为blob
在这里插入图片描述
然后在代码中就可以直接把自己的请求相应数据转换为url了
const blob = new Blob([res]); this.url = window.URL.createObjectURL(blob)

王巨饿
关注
  • 0
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
Android如何实现URL转换成二维码
08-30
主要为大家详细介绍了Android实现URL转换成二维码的方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
当后端接口使用文件流下载文件，前端通过blob转换url下载
西凉的悲伤博客
03-06 5108
当后端通过文件流的方式下载文件，其返回的是文件流 public CodeNoteResponse downloadFile(HttpServletResponse resp, String fileAddress, String fileName) { String fileDirName = fileAddress.endsWith("/") ? fileAddress + f...
遇到问题四：接口返回一个Blob类型，转化为URL使用
GTbond的博客
01-11 1471
接口返回一个Blob类型，转化为URL使用 //html <img :src="verifyIMG" alt=""> //方法 getVerify().then(res => { let url = window.URL.createObjectURL(res); // 会产生一个类似 blob:d3958f5c-0777-0845-9dcf-2cb28783acaf 这样的URL字符串 // 你可以像使用普通 URL 那样使用它，比如用在 img.src 上。
【SpringBoot】-- 实现本地文件/图片上传到服务器生成url地址
最新发布
张修宇的博客
03-07 1435
如何实现上传本地图片生成url地址？阿里云OSS存储的使用。
前端将blob转换为可下载的url及下载
qq_36566924的博客
11-27 2008
【代码】前端将blob转换为可下载的url。
通过url获取网络位置上的文件流
02-08
java通过url获取网络位置上的文件流，自己封装的工具类
python实现文件路径和url相互转换的方法
09-21
主要介绍了python实现文件路径和url相互转换的方法,以URL转换成文件路径为例分析了Python实现地址转换的技巧,需要的朋友可以参考下
将文件流blob或文件file读取成url
i_am_a_div的博客
09-29 2865
将文件流blob或文件file读取成url
blob、url、base64相互转换
weixin_45630345的博客
03-23 1117
相互转换文章中有以下四种转换方式：以下两种可通过间接转换：
js blob文件转url， base64转blob
q879936814的博客
01-04 8765
目前使用过两种方法 URL.createObjectUrl(blob)：这个方法便捷，且是同步的，但需要基于当前的内存，换句话说，这个url不能拿到其他页面使用。 let url = URL.createObjectUrl(blob) img.src = url FileReader.readAsDataURL(blob)：这个方法是异步的，转化成base64，可以放到其他页面使用。 let fr = new FileReader() fr.readAsDataURL(blob) fr.onlo
js实现base64、url和blob之间相互转换的三种方式
weixin_64317807的博客
11-16 5021
Blob对象表示一个不可变、原始数据的类文件对象,Blob表示的不一定是JavaScript原生格式的数据,下面这篇文章主要给大家介绍了关于js实现base64、url和blob之间相互转换的三种方式,需要的朋友可以参考下1.url: 一般来说，图片的显示还是建议使用url的方式比较好。12.base64： 如果图片较大，图片的色彩层次比较丰富，则不适合使用这种方式，因为其Base64编码后的字符串非常大，会明显增大HTML页面，影响加载速度。
file、base64、blob、url之间的转换
lsy173176的博客
12-23 610
上传、下载文件必须知道的file、base64、blob、url之间的转换
python3获取url文件大小示例代码
09-18
主要介绍了python3获取url文件大小,本文通过示例代码给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
JAVA 根据Url把多文件打包成ZIP下载实例
08-29
主要介绍了JAVA 根据Url把多文件打包成ZIP下载的相关资料,需要的朋友可以参考下
Blob的三种应用场景及Blob，url，base64之间的转换
热门推荐
前端361
08-02 1万+
Blob是一种Javascript的对象类型，兼容到IE10 Blob对象表示一个不可变、原始数据的类文件对象。 Blob 表示的不一定是JavaScript原生格式的数据。 File接口基于Blob，继承了 blob 的功能并将其扩展使其支持用户系统上的文件。 file 对象只是 blob 对象的一个更具体的版本，blob 存储着大量的二进制数据，并且 blob 的 s...
文件流转换为url
weixin_58032613的博客
10-16 1676
文件流转换成url
后端接口返回的文件流，前端通过blob转换url下载文件(兼容ie)
weixin_42674490的博客
06-03 6375
1.接口请求： 注意：responseType:’blob’要加上，这样就会返回Blob对象 let params = { id: 1, name: '李四' } this.$axios.post('/xxxx', params, { responseType: 'arraybuffer' }).then(res => { if (res.data) { this.fileDownLoad(res.data, 'text.xlsx') } }).catch(() => {
前端将后端返回的文件流转成url
正一品程序员的博客
08-25 2714
前端将后端返回的文件流转成url
【JavaScript】如何转换blob数据与file文件还有url
TA远方
01-05 7706
大家好，关于对象和对象有了解多少呢，它们都是一种文件的表示形式，文件之间是可以互相转换的，顺带一提，还有经常用到的临时文件路径。
前端 url 转换成文件流
05-31
在前端将 URL 转换为文件流，可以使用 XMLHttpRequest 对象的 responseType 属性来实现。具体步骤如下： 1. 创建一个 XMLHttpRequest 对象 ``` var xhr = new XMLHttpRequest(); ``` 2. 设置 XMLHttpRequest 对象的 responseType 属性为 'blob'，表示返回的数据类型为二进制流 ``` xhr.responseType = 'blob'; ``` 3. 发送请求 ``` xhr.open('GET', url); xhr.send(); ``` 4. 监听 XMLHttpRequest 对象的 onload 事件，获取返回的二进制流数据 ``` xhr.onload = function() { if (xhr.status === 200) { var blob = xhr.response; // 处理二进制流数据 } } ``` 通过以上步骤，就可以将 URL 转换为文件流，在 onload 事件中获取到二进制流数据，然后可以进行进一步的处理，如将二进制流转换为图片、音频等格式。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

打赏作者

王巨饿

你的鼓励将是我创作的最大动力

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

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

打赏作者

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

抵扣说明：

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

余额充值