uniapp使用第三方插件image-tools进行图片转base64

发布时间 2023-11-21 16:20:24作者: 妞妞猪

最近做的这个项目原来是原生android开发的,然后图片上传功能是  前端获取图片 -> 图片转成base64字符串(base64编码) -> 传递给服务器后端 -> 服务器接受base64字符串数据 -> 获取到的base64转成图片jpg (解码)-> 存入服务器,并写入数据库

后来因为原生安卓太麻烦了,转成了uniapp进行开发。

为了方便,也不想改后端代码了,就直接将uniapp获取到的图片进行base64编码,但是查了一下貌似uniapp并没有直接调用的方法,于是就需要借助第三方插件进行编码,具体实现如下:

1.新建一个空文件夹,进入控制台,输入  

npm init

会生成package.json

2.输入下载image-tools插件

npm i image-tools --save

此时会有这些文件生成

3.进入node_moudules文件中的image-tools吧index.js文件拿出来

 复制index.js文件到项目中(可以不在根目录下,但是得放在一个你方便调用的目录中)

比如我放在了common下,并且把index.js文件名字改成了image-tools.js

然后在需要调用的页面中引用:

uniapp选择图片:

 在post之前先进行数据的处理:

 这样imgWbase64和imgEbase64的值就变成base64啦,之后在服务器后端接收到base64字符串再把他解码成jpg存入数据库就好了