HTML5图片压缩与Base64编码上传解码
HTML5 的图片功能真的是蛮强大的，是在图片上传和压缩方面。通过 HTML5 的 Canvas API，可以轻松地进行图片压缩，甚至在前端就能把图片转成 base64 编码，省去了多后端的麻烦。通过设置accept属性，你可以让文件上传框仅支持图片选择，这在大多数用户上传头像的场景中还挺实用的。
压缩后，直接将图片转为 base64 字符串，这样就可以用img标签直接嵌入，省去了再发求的时间。这个方法适合用户上传小图标或头像等，既能提高体验，又能减轻服务器负担。，你也可以通过FormData和fetch发送这些 base64 编码的图片到服务器进行存储，后端可以接收到这些数据后，轻松地解码成二进制图片并保存。
使用时你只要稍微注意一下文件大小，不然 base64 编码会让图片文件变得比原来大。，HTML5 让这块操作变得简便，是在需要用户交互和即时上传的场景下，尤其合适。如果你想在前端做一些图片，像上传、预览、压缩，HTML5 给了你强有力的支持。
文件大小：71.04KB
评论区