前言
本文首先介绍一下这三种对象使用场景,最后介绍下它们之间互转格式的解决方案。
您前端一旦涉及到文件或图片上传到服务器,就势必离不了 Blob / File / base64
三种主流的类型,
它们之间 互转 也成了常态,但网上很多教程写的不清晰,本文重新整理一下。
- Blob → File
- Blob → Base64
- Base64 → Blob
- File → Base64
- Base64 → File
MDN: https://developer.mozilla.org/zh-CN/docs/Web/API/Blob
您可以观察到,像一些图片处理插件(例如有名的 vue-cropper )图片裁剪插件,
它们将图片处理完毕后,都将使用 blob
对象返回处理好的图片,供开发者用于上传服务器。
MDN: