JS在浏览器中base64、url、blob互相转换

在平时开发的时候,我们在处理文件,尤其是图片的时候,经常会跟base64、url、blob(file)这三种形式的内容打交道。

base64格式一般都是以data:image/jpeg;base64,这种类似形式打头的一串很长的字符串。

url一般以服务器地址或者路径(形如http://xxx.jpg或者/static/xxx.jpg)为主,也会有浏览器本地地址(形如blob:http://这种)。

blob一般是浏览器中的一种对象类型,file类型也是其一种。

如何互相进行转换?

base64到blob:

比如png格式的base64图片转成blob类型:

其他格式的图片类似,于是可以写一个通用的图片接口:

blob转本地url:

blob转base64:

url转blob:

有了以上接口就可以三种格式互相转换了,不过url转blob和blob转base64是异步的操作,此外url还分服务器端url和浏览器本地url,需要自己使用时区分清楚。

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20191120A04I8N00?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 yunjia_community@tencent.com 删除。

扫码关注云+社区

领取腾讯云代金券