人脸比对功能,使用plus.video.createLivePusher实现,但是第二次使用snapshot方法app会闪退,第一次调用的时候没问题。
<template>
<view class="face">
<img :src="imgData" ref="img" class="image" v-if="imgData" />
<view class="action">
<button @click="snapshotAgainPusher" class="shootBtn" v-if="imgData">重 拍</button>
<button @click="snapshotPusher" class="shootBtn" v-else>拍照识别</button>
</view>
</view>
</template>
<script>
export default {
data() {
return {
imgData: '',
pusher: null,
scanWin: null,
snapshotTimeoutNumber: 3000,
faceInitTimeout: null,
snapshTimeout: null,
screenHeight: 0,
topStatusHeight: 0,
};
},
onLoad() {
let that = this
uni.getSystemInfo({
success: function(e) {
that.screenHeight = e.windowHeight
that.topStatusHeight = (e.screenHeight - e.windowHeight) + 'px'
},
})
//#ifdef APP-PLUS
this.faceInit();
//#endif
},
onHide() {
this.faceInitTimeout && clearTimeout(this.faceInitTimeout);
this.snapshTimeout && clearTimeout(this.snapshTimeout);
},
methods: {
faceInit() {
let that = this
uni.showLoading({
title: '加载中',
mask: true
})
this.faceInitTimeout = setTimeout(() => {
this.pusherInit();
//覆盖在视频之上的内容,根据实际情况编写
// this.scanWin = plus.webview.create('/hybrid/html/faceTip.html', '', {
// background: 'transparent',
// height: (that.screenHeight - 67) + 'px',
// });
// this.scanWin.show();
}, 2000)
},
pusherInit() {
let that = this
const currentWebview = this.$mp.page.$getAppWebview();
this.pusher = plus.video.createLivePusher('livepusher', {
url: '',
top: that.topStatusHeight,
left: '0px',
width: '100%',
height: (that.screenHeight - 50) + 'px',
position: 'absolute',
aspect: '9:16',
'z-index': 999
});
currentWebview.append(this.pusher);
// this.pusher.switchCamera(); //换为前置摄像头
this.pusher.preview();
uni.hideLoading();
},
//拍照
snapshotPusher() {
let that = this
uni.showLoading({
title: '照片生成中',
mask: true,
})
this.snapshTimeout = setTimeout(() => {
this.pusher.snapshot(
res => {
console.log('走到这啦2');
var src = res.tempImagePath;
that.getMinImage(src);
},
err => {
console.log('拍照失败', err);
uni.showToast({
title: '拍照失败'
})
}
);
}, 3000)
},
// 重拍
snapshotAgainPusher() {
this.faceInit() //全部重新加载
this.imgData = ''
},
getMinImage(imgPath) {
let that = this
plus.zip.compressImage({
src: imgPath,
dst: imgPath,
overwrite: true,
quality: 40,
rotate: 270,
},
zipRes => {
setTimeout(() => {
var reader = new plus.io.FileReader();
reader.onloadend = res => {
var speech = res.target.result; //base64图片
that.imgData = speech;
uni.hideLoading()
uni.showToast({
title: '照片已生成',
duration: 1000,
success() {
setTimeout(() => {
that.faceHttp();
}, 1000)
}
})
};
reader.readAsDataURL(plus.io.convertLocalFileSystemURL(zipRes.target));
that.pusher.close();
}, 200)
},
function(error) {
uni.showToast({
title: '照片生成失败'
})
}
);
},
async faceHttp() {
uni.showLoading({
title: '识别中',
mask: true,
})
const data = {
imgBase64: this.imgData
};
uni.request({
url: 'http://115.238.35.146:8899/Home/base64/2', //仅为示例,并非真实接口地址。
method: 'post',
data: {
base64String: this.imgData.toString()
},
success: (res) => {
console.log('res', res);
uni.hideLoading();
if (res.data != 0) {
uni.showToast({
title: '比对失败!',
icon: 'none'
})
return
}
uni.showToast({
title: '比对相识度:' + res.data.data,
icon: 'none'
})
},
fail: (err) => {
console.log(err);
uni.hideLoading();
uni.showToast({
title: '比对失败!',
icon: 'none'
})
},
});
},
},
};
</script>
<style lang="scss" scoped>
.face {
width: 100vw;
height: 100vh;
.action {
display: flex;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 50px;
line-height: 50px;
}
.shootBtn {
width: 100%;
}
.image {
margin: 0;
padding: 0;
width: 100vw;
height: calc(100vh - 50px);
}
}
</style>
第二次调用,this.pusher.snapshot方法不执行,直接就闪退了,
求大神告知啊