checksaosao(){  //兼容h5的扫码页面/*#ifdef H5*/uni.$u.route(`/pages/my/saoma`)return;/*#endif*/uni.scanCode({success: function (res) {console.log('条码类型：' + res.scanType);console.log('条码内容：' + res.result);let {type,uid,} = JSON.parse(res.result);console.log(type,uid);if(type){//扫码成功跳转输入金额页面uni.$u.route(`/pages/my/amountEntered`, {uid: uid,type:type,})}else{uni.$u.toast('未识别到二维码，请重新尝试！')}}})},

saoma.vue 页面 （这个页面用兼容h5扫码的）

<template><view class="scan size"><u-navbar title="扫码" :autoBack="true" bgColor="black"></u-navbar><view class="sectionview"><view id="qr-reader" style="width:100%;height:100%;"></view></view><view class="footer"><view style="margin-top: 60rpx;" class="btn" @click="getCameras">扫码</view>            </view>  <u-toast ref="uToast" /></view>
</template>
<script>
export default {data() {return {codeUrl: '',cameraId: '',};},mounted() {this.current = this.$route.query.current || 0;this.init();},beforeDestroy() {this.stop();},methods: {//返回结果getCode(res) {let {type,uid,} = JSON.parse(res);console.log(type,uid);if(type){uni.$u.route(`/pages/my/amountEntered`, {uid: uid,type:type,})}else{uni.$u.toast('未识别到二维码，请重新尝试！')}},init() {this.AddJs('https://blog.minhazav.dev/assets/research/html5qrcode/html5-qrcode.min.js');//需要加载时间建议延时一点再获取设备列表setTimeout(() => {this.getCameras();}, 1000);},stop() {this.html5QrCode.stop().then(ignore => {// QR Code scanning is stopped.console.log('QR Code scanning stopped.');}).catch(err => {// Stop failed, handle it.console.log('Unable to stop scanning.');});},start() {this.html5QrCode = new Html5Qrcode('qr-reader');this.html5QrCode.start(this.cameraId, // retreived in the previous step.{fps: 10, // sets the framerate to 10 frame per secondqrbox: 250 // sets only 250 X 250 region of viewfinder to// scannable, rest shaded.},qrCodeMessage => {// do something when code is read. For example:if (qrCodeMessage) {uni.$u.toast('扫码成功')this.getCode(qrCodeMessage);this.stop();}},errorMessage => {// parse error, ideally ignore it. For example:// console.log(`QR Code no longer in front of camera.`);}).catch(err => {// Start failed, handle it. For example,console.log(`Unable to start scanning, error: ${err}`);uni.$u.toast(`扫码失败:${err}`)});},getCameras() {console.log(Html5Qrcode.getCameras());Html5Qrcode.getCameras().then(devices => {/*** devices would be an array of objects of type:* { id: "id", label: "label" }*/if (devices && devices.length) {if (devices.length > 1) {this.cameraId = devices[1].id;} else {this.cameraId = devices[0].id;}console.log(this.cameraId, 'cameraId');this.start();}}).catch(err => {console.log(err)uni.$u.toast(`启用相机失败:${err}`)});},//动态创建script的方法AddJs(url) {//console.log( 'url：',url);return new Promise((resolve, reject) => {const script = document.createElement('script');script.src = url;script.type = 'text/javascript';document.body.appendChild(script);script.onload = () => {resolve();};});}}
};
</script>
<style lang="less">
.scan {width: 100%;display: flex;flex-direction: column;height: 100vh;overflow: hidden;.footer {position: fixed;bottom: 50rpx;width: 100%;display: flex;justify-content: center;}
}
.btn{width: 460upx;height: 80upx;line-height: 80upx;margin: 0 auto;margin-top: 60upx;border-radius: 40upx;border: 0;font-size: 32upx;outline: 0;background:  linear-gradient(to right, #52DB93, #6B81F8, #C668F5) !important;color: #FFFFFF;text-align: center;
}
</style>

还有个二维码页面 receiptPayment.vue

<template><view class="main"><!-- 收付款码 --><u-navbar title="收付款码" :autoBack="true"></u-navbar><!-- #ifdef APP--><view  style="height: 80px;"></view><!-- #endif --><view class="yuanmao_tabs"><u-tabs :current="defaultTab" class="tabs" :list="list1" @click="click"    lineWidth="100rpx" activeStyle="color: white" itemStyle="width:25%;height:100rpx" ></u-tabs></view><view class="container flexColumn flexAiCenter w100p" v-if="selectTabValue==0"><view class="flex flexJcCenter fs24 litit">付款码</view><view class="flex flexJcCenter fs24 litit">暂无付款码</view><!--         <view v-if="inviteLink2" class="qrcode"><tki-qrcoderef="qrcode":val="inviteLink2":size="400":showLoading="true":loadMake="true"background="#FFF"@result="qrR" /></view> -->
<!--             <u--image :src="boardTempPath2" width="590rpx" height="850rpx" :fade="false" @load="onoff='1'"bgColor="#111"></u--image> --><view class="" style="opacity: 0;z-index: -99;"><l-painter style="display: none;" isCanvasToTempFilePath @success="canvasDone2($event)"customStyle="border-radius:30rpx;width:295px;position:fixed;left:0%"><l-painter-view css="width:400px;height:900rpx;background: #222222;border-radius:30rpx;"><l-painter-view><l-painter-image src="/static/haibao.png"css="width:700rpx;height:1100rpx;position:absolute;top:-170rpx;left:50rpx;right:0;"></l-painter-image></l-painter-view><l-painter-qrcode :text="inviteLink2"css="width:270rpx;height:300rpx;color:#fff;position:absolute;left:265rpx;top:350rpx;"></l-painter-qrcode></l-painter-view></l-painter></view><view style="margin-top: 60rpx;" class="btn" @click="savecode(boardTempPath2)">保存二维码</view></view><view class="container flexColumn flexAiCenter w100p" v-if="selectTabValue==1"><view class="flex flexJcCenter fs24 litit">收款码</view><view v-if="inviteLink1" class="qrcode"><tki-qrcoderef="qrcode":val="inviteLink1":size="400":lv="3":showLoading="true":loadMake="true"background="#FFF"@result="qrR1" /></view>
<!--             <u--image  :src="boardTempPath1" width="590rpx" height="850rpx" :fade="false" @load="onoff='1'"bgColor="#111"></u--image> --><view class="" style="opacity: 0;z-index: -99;"><l-painter   isCanvasToTempFilePath @success="canvasDone1($event)"customStyle="border-radius:30rpx;width:295px;position:fixed;left:0%"><l-painter-view css="width:400px;height:900rpx;background: #fff;border-radius:30rpx;"><l-painter-view><l-painter-image src="/static/haibao.png"css="width:700rpx;height:1100rpx;position:absolute;top:-170rpx;left:50rpx;right:0;"></l-painter-image></l-painter-view><l-painter-qrcode :text="inviteLink1"css="width:270rpx;height:300rpx;color:#000;position:absolute;left:265rpx;top:350rpx;"></l-painter-qrcode></l-painter-view></l-painter></view><view style="margin-top: 60rpx;" class="btn" @click="savecode(boardTempPath1)">保存二维码</view></view></view>
</template><script>import tkiQrcode from "@/components/tki-qrcode/tki-qrcode.vue"import config from '@/config.js'export default {components:{tkiQrcode},data() {return {inviteLink1:'',inviteLink2:'',img1:'',img2:'',list1: [// {//     name: '付款码',//     value: 0// },{name: '收款码',value: 1}],defaultTab: 0,selectTabValue: 1,boardTempPath1: '',boardTempPath2: '',}},onLoad() {this.loadSeries();},onShow(){// this.loadSeries();},mounted() {// this.loadSeries();// setInterval(_ => {// this.loadSeries();// }, 30e3)},methods: {canvasDone1(e) {console.log(e,'-------------------------')this.boardTempPath1 = e;// this.loadSeries()},canvasDone2(e) {console.log(e)this.boardTempPath2 = e;// this.loadSeries()},loadSeries() {//type  1-收款码；2-付款码this.$axios.post('/payment/getLink',{type:1}).then(data => {console.log(data)// 绑定银行卡if(data.code==100){uni.showModal({title:"提示",content:"您未绑定银行卡,是否前往绑定？",success:(res)=>{if (res.confirm) {console.log('用户点击确定');uni.navigateTo({url: '/pages/my/bindCard'})} else if (res.cancel) {console.log('用户点击取消');uni.switchTab({url: '/pages/index/index-new'})}}})}data.data.type=1;this.inviteLink1 = JSON.stringify(data.data);console.log(this.inviteLink1)})this.$axios.post('/payment/getLink',{type:2}).then(data => {// 绑定银行卡if(data.code==100){uni.showModal({title:"提示",content:"您未绑定银行卡,是否前往绑定？",success:(res)=>{if (res.confirm) {console.log('用户点击确定');uni.navigateTo({url: '/pages/my/bindCard'})} else if (res.cancel) {console.log('用户点击取消');uni.switchTab({url: '/pages/index/index-new'})}}})}data.data.type=2;this.inviteLink2 = JSON.stringify(data.data);console.log(this.inviteLink2)})setTimeout(_=>{this.loadSeries},30e3)},    copy(){//#ifdef H5//#endif},qrR(e){// console.log(e,'二维码')this.img1=e;},qrR1(e){// console.log(e,'二维码')this.img2=e;},click(item) {console.log('item', item.value);if (this.selectTabValue != item.value)this.selectTabValue = item.value;},//保存图片到相册savecode(path){console.log(`savecode`,path)//#ifdef H5uni.$u.toast(`长按二维码保存`)//#endif//#ifdef APP-PLUSuni.saveImageToPhotosAlbum({filePath:path,success() {uni.$u.toast(`保存成功`)}})//#endif},}}
</script><style lang="scss" scoped>page {padding: 60px 10px;.container {width: 90%;margin: 70rpx auto;background: #222222;border-radius: 20rpx;padding: 20rpx 0rpx 80rpx 0rpx;.qrcode{margin-top: 0px;padding: 10px;background-color: white;}.litit{margin: 30rpx 0;}.btn{width: 260upx;height: 60upx;line-height: 60upx;margin: 0 auto;margin-top: 60upx;border-radius: 40upx;border: 0;font-size: 26upx;outline: 0;background:  linear-gradient(to right, #52DB93, #6B81F8, #C668F5) !important;color: #FFFFFF;text-align: center;}}}.yuanmao_tabs .u-tabs__wrapper__nav__line {background: linear-gradient(to right, #52DB93, #6B81F8, #C668F5) !important;}
</style>

h5 兼容扫码用htm-qrcode的

通过扫码获取到 uid:, type2个字段在传给后端，注意扫码哪个二维码加个白色边距，不然可能会扫码不了

，这个我是h5游览器展示的，实际手机的h5可以扫码的，app端用uniapp的那个官方api的那个