WX拍照、扫码接口调用

微信调用拍照接口，以及处理数据

1、引入JS

<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<script src="https://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script>

2、根据公众号appid等信息，配置调用环境。

function natoken() {
		$.ajax({
			async: false,
			type: "POST",
			dataType: "json",

			url: "",
			data: {
				'url': location.href
			},
			success: function(res) {
				if (res.result != undefined || res.result != false) {
					wx.config({
						debug: false, // 开启调试模式,调用，仅在 pc 端时才会打印。
						appId: res.appId, // 必填，公众号的唯一标识
						timestamp: res.timestamp, // 必填，生成签名的时间戳
						nonceStr: res.nonceStr, // 必填，生成签名的随机串
						signature: res.signature, // 必填，签名
						jsApiList: ['chooseImage', 'previewImage', 'uploadImage',
							'downloadImage',
							'getLocalImgData', 'scanQRCode'
						] // 必填，需要使用的 JS 接口列表
					});
				} else {
					layer.msg('后台系统繁忙或者崩溃');
				}
			},
			error: function() {
				layer.msg('调取微信扫一扫功能失败');
			}
		});
	}

 3、拍照

wx.chooseImage({
			count: 1,
			sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
			sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
			success: function(res) {
				var localIds = res.localIds;
				wx.getLocalImgData({ // 获取本地图片
					localId: localIds[0],
					success: function(res) {
						let localData = res.localData;
						// alert(localData); // 在安卓和IOS中获取到格式稍微有点区别，具体看下图
						if (localData.indexOf('data:image') != 0
							) { //传给后台的参数是不需要data:image/png;base64,所以去掉了。可以根据具体的业务需求对该格式做变化。
							localData = 'data:image/jpeg;base64,' + localData;
						}
						localData = localData.replace(/\r|\n/g, '').replace(
							'data:image/jgp', 'data:image/jpeg')
						// alert("base64:"+localData)
						var str = '<img src="' + localData + '" alt="">';
						$("#result").append(str);//渲染到存放图片的空间
					},
				});
			},
			error: function() {
				layer.msg(
					'<span style="font-size:3rem;line-height:3rem">拍照功能正在开发中!</span>', {
						time: 2000
					});
			}
		});

4、提交前处理照片，将照片base64存入map

function uploadPhoto() {
	let map = {}; //定义map
	let listall = $("#result").children(); //根据id获得图片数量
	if (listall.length > 0) {
		let zhekey = "pic";
		let list = $("#result img:nth-of-type(1)");
		for (let i = 0; i < listall.length; i++) {
			zhekey = zhekey + i; //pic0,pic1，pic2
			let picSrc = list.attr("src");
			let img = new Image();
			img.src = picSrc;

			let base64 = img.src;
			map["" + zhekey + ""] = base64;
			list = list.next(); //处理下一张图片
			zhekey = "pic";
		}
	} else {
		map["pic0"] = "空";
	}
	return map;
}

5、上传图片

function fxgAddPic(map) { 
	var picnum = Object.getOwnPropertyNames(map).length;
	var tup = new Array();
	for (var i = 0; i < picnum; i++) {
		tup.push(Object.values(map)[i])
	}

	$.ajax({ //保存图片
		url: '',
		type: 'post',
		dataType: 'json',
		data: {
			photos: JSON.stringify(tup),
		},
		success: function(res) {
			
		},
		error: function() {
			
		}
	})
}

6、后端接收处理参数：

@RequestParam(value="photos",required=false) List<String> photos

for (int i = 0; i < photos.size(); i=i+2){
            String top = photos.get(i);//base64头
            String body = photos.get(i + 1);//base6身
            if (i == 0){//去掉“[”
                top = top.substring(1);
            }
            if (i+2 == photos.size()){//去掉“]”
                body = body.substring(0,body.length()-1);
            }
            String imgBase64 = top + "," + body;//获取单个图片完整base64；
       // 该方式传入会将头和尾分开传递，需分开处理。
        }

/**
     * 本地图片转换Base64的方法
     * @param imgPath
     */
    public static String ImageToBase64(String imgName) {
        InputStream in = null;
        byte[] data = null;
        // 读取图片字节数组
        try {
            in = new FileInputStream(imgName);
            data = new byte[in.available()];
            in.read(data);
            in.close();
        } catch (IOException e) {
            e.printStackTrace();
        }
        // 对字节数组Base64编码
        BASE64Encoder encoder = new BASE64Encoder();
        // 返回Base64编码过的字节数组字符串
        return encoder.encode(data);
    }

 

微信调用扫码功能

wx.scanQRCode({
			needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
			scanType: ["barCode", "qrCode", "datamatrix", "pdf417"], // 可以指定扫二维码还是一维码，默认二者都有
			success: function(res) {
				var result = res.resultStr; // 当needResult 为 1 时，扫码返回的结果
				let wlCode = result.substring(9);
				$("#xx").val(wlCode);
			}
		});