微信小程序选择图片并转base64_微信小程序图片转base64

一般上传图片给后台更多情况是通过base64的形式，这样占存小，使用时也可以减少了服务器访问次数。微信官方提供的API又不支持上传多个文件，所以如果是上传图片的话，使用base64编码字符串是个不错的办法。

相关API

wx.chooseImage(Object object)

功能描述

从本地相册选择图片或使用相机拍照。

---

wx.getImageInfo(Object object)

功能描述

获取图片信息。网络图片需先配置 download 域名才能生效。

---

FileSystemManager.readFile(Object object)

功能描述

读取本地文件内容。单个文件大小上限为100M。

---

微信小程序选择图片并转base64，代码如下：

// 选择图片并自动转成base64编码（count：文件可选数，imgType：转base64时图片类型）
	chooseImageToBase64(count) {
		return new Promise((resolve, reject) => {
			wx.chooseImage({
				count,
				sizeType: 'compressed',
				success: (res) => {
					console.log(res)
					var tempFilePaths = res.tempFilePaths
					var base64ImgArr = [];
					tempFilePaths.forEach((item) => {
						wx.getImageInfo({
							src: item,
							success(imageInfo) {
								var imgType = imageInfo.type
								wx.getFileSystemManager().readFile({
									filePath: item, //选择图片返回的相对路径
									encoding: "base64", //这个是很重要的
									success: res => { //成功的回调
										//返回base64格式
										var base64Str = 'data:image/' + imgType + ';base64,' + res.data
										base64ImgArr.push(base64Str)
										if (base64ImgArr.length == tempFilePaths.length) {
											resolve(base64ImgArr)
										}
									},
									fail: err => {
										console.log(err)
										reject(err)
									}
								})
							}
						})
					})
				},
				fail: (err) => {
					console.log(err)
				}
			})
		})
	},
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41

格式有点套娃，可以自己优化下！

this.chooseImageToBase64(1).then(res=>{
	console.log(res)//图片base64 （数组）
	//.....
})
1
2
3
4

uni-app 把 wx 改成 uni 也可以用