xml:
<canvas canvas-id="attendCanvasId" style="width:375rpx;height:520rpx;position: absolute;z-index:1003;left:-500rpx;"></canvas>
js:
//选择图片takePhoto(){var that = this;wx.chooseImage({count: 1,sizeType: ['compressed'],sourceType: ['album', 'camera'],success (res) {var tempFilePaths = res.tempFilePathsconsole.log(tempFilePaths);console.log(res.tempFiles[0].size/1024+'kb');var size = res.tempFiles[0].size/1024; //kb单位// tempFilePath可以作为img标签的src属性显示图片var img = tempFilePaths[0];that.setData({imagesrc: img,})that.imgToMin(img,size); //获取图片后压缩},fail(err){console.log(err);}})},//图片转码64base64(url,type){var that = this;return new Promise((resolve, reject) => {wx.getFileSystemManager().readFile({filePath: url, //选择图片返回的相对路径encoding: 'base64', //编码格式success: res => {resolve('data:image/' + type.toLocaleLowerCase() + ';base64,' + res.data)// console.log(res.data);that.doDiscernment(res.data);//提交后台},fail: res => reject(res.errMsg)})})},//缩放图片imgToMin(img,size){var that = this;//size小于100kb 时 直接转码识别if(size<100){that.base64(img,"jpg");return;}//先获取图片 然后根据长宽 缩小 之后获取图片wx.getImageInfo({src: img,success (res) {console.log(res.width)console.log(res.height)var ratio = 2;var ww = res.width //图片原始长宽var hh = res.heightvar canvasWidth = res.width //图片原始长宽var canvasHeight = res.heightwhile (canvasWidth > 375 || canvasHeight > 520){// 保证宽高在400以内canvasWidth = Math.trunc(canvasWidth / ratio)canvasHeight = Math.trunc(canvasHeight / ratio)ratio++;}console.log(canvasWidth)console.log(canvasHeight)console.log(ww)console.log(hh)//绘制图片var ctx = wx.createCanvasContext('attendCanvasId')ctx.drawImage(img, 0, 0, canvasWidth, canvasHeight)ctx.draw(false, setTimeout(function(){wx.canvasToTempFilePath({canvasId: 'attendCanvasId',width:canvasWidth,height:canvasHeight,destWidth: canvasWidth,destHeight: canvasHeight,fileType:'jpg',success: function (res) {console.log(res.tempFilePath)//最终图片路径that.setData({canvasImgUrl: res.tempFilePath});that.base64(res.tempFilePath,"jpg");//转码提交},fail: function (res) {console.log("缩放图片失败");console.log(res.errMsg)wx.hideLoading();wx.showToast({title: '识别图片失败',image:'../../utils/img/wrong.png',duration: 2000})that.setData({title: "识别失败",})}},this) //要填写this对象，表示canvas这个对象},1000)) //留一定的时间绘制canvas 否则会报错fail canvas is empty},fail: function(res){console.log("获取图片失败");console.log(res.errMsg)wx.hideLoading();wx.showToast({title: '识别图片失败',image:'../../utils/img/wrong.png',duration: 2000})that.setData({title: "识别失败",})},})},
