uniapp小程序接入腾讯云【增强版人脸核身接入】

news/2024/7/20 1:38:44 标签: uni-app, 小程序, 腾讯云

文档地址:https://cloud.tencent.com/document/product/1007/56812
企业申请注册这边就不介绍了,根据官方文档去申请注册。
申请成功后,下载【微信小程序sdk】

一、解压sdk,创建wxcomponents文件夹

sdk解压后发现是原生小程序代码,uniapp不支持引入原生页面
在这里插入图片描述
所以要在根目录下创建wxcomponents文件夹,把解压的文档夹放wxcomponents里。

二、pges.json的globalStyle全局引入组件

在pges.json里添加引入

{
	"globalStyle": {
		"usingComponents": {
			"verify_mpsdk":"/wxcomponents/verify_mpsdk/index/index"
		}
	}
}

或者在哪个页面使用就在哪个页面引入

{
			"path": "pages/auth/auth",
			"style" :
			{
			    "navigationBarTitleText": "人脸核身",
			    "enablePullDownRefresh": false,
				"usingComponents": {
					"verify-mpsdk":"/wxcomponents/verify_mpsdk/index/index"
				}
			}
		}

三、创建一个认证的文件夹与页面

然后创建一个人脸核身的文件夹auth(命名随意)
pages.json添加页面路由【pages/auth/auth】

<!-- 司机人脸识别 -->
<template>
	<view>
		<verify-mpsdk ref="verifyMpsdk"></verify-mpsdk>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				
			}
		},
		onLoad(i) {
			//注意,引入组件没有onLoad生命周期,所以组件要重新写一个函数,把verify_mpsdk/index/index.js的onLoad里的方法执行一次
			this.$refs.verifyMpsdk.onLoadMethod(i)
		}
	}
</script>

<style>
</style>

verify_mpsdk/index/index.js

onLoadMethod: async function(t) {
	console.log("options=>", t, "verify_isNetworkWeek", wx.verify_isNetworkWeek), await this
	.initConfig(), t.curpage ? "result" === t.curpage && (this.showRTLiveGuide = !1, this
		.handleStartResult()) : await this.onLoadToNext()
}

四、修改verify_mpsdk/main.js的验证页面路径

搜索verify_mpsdk/main.js里的verify_mpsdk/index/index 修改成刚才创建的文件夹auth的路由【/pages/auth/auth】,位置有2处需要改的

五、在需要使用认证的页面进行人脸核身

在要使用认证的页面,例如authentication.vue
authentication.vue

onLoad() {
	const Verify = require('@/wxcomponents/verify_mpsdk/main.js')
	Verify.init()
},
methods:{
	gotoVerify(){
		let that = this
		wx.startVerify({
			data:{
				token:''//去客户后端调用 DetectAuth 接口获取 BizToken
			},
			success:(res)=>{
				setTimeout(()=>{
					console.log(res,'success')
				},500)
			},
			fail:(err)=>{
				setTimeout(()=>{
					//腾讯云返回的err结构
					// {
					// 	BizToken:'xxx',
					// 	ErrorCode:'2016',
					// 	ErrorMsg:'比对人脸信息不匹配(10004)(xxxxx)'
					// }
					console.log(err,'fail')
				},500)
			}
		})
	},
}

一些遇到的问题:
1.上面步骤都完成的话,调用会返回【服务异常,请稍后重试或联系客服人员】,这个是小程序接入某个流程缺少(我是缺少了管理员微信号,扫描 授权二维码这个流程),在授权下就可以了
2.调用后没报错也没返回什么信息,那么可能就是上面的步骤某一个没弄好,例如main.js改页面路径啥的没去改


http://www.niftyadmin.cn/n/5163609.html

相关文章

ZZ308 物联网应用与服务赛题第G套

2023年全国职业院校技能大赛 中职组 物联网应用与服务 任 务 书 &#xff08;G卷&#xff09; 赛位号&#xff1a;______________ 竞赛须知 一、注意事项 1.检查硬件设备、电脑设备是否正常。检查竞赛所需的各项设备、软件和竞赛材料等&#xff1b; 2.竞赛任务中所使用…

k8s 创建普通用户使用

创建一个用户只能访问"abc", “dev”, “prod” 的三个命名空间 创建用户 apiVersion: v1 kind: ServiceAccount metadata:name: abc-bbc-mmc-user或者直接创建 kubectl create user abc-bbc-mmc-user创建角色 apiVersion: rbac.authorization.k8s.io/v1 kind: R…

idea 一直卡在maven正在解析maven依赖

修改maven Importing的jvm参数 -Xms1024m -Xmx2048m

Python中的switch

在Python 3.10中引入了一个match语句&#xff0c;其类似于其他语言(eg:C,JAVA)中的switch或case语句&#xff0c;但更为强大。下面是一个使用Python 3.10中match语句的示例&#xff1a; def http_error(status):match status:case 400:return "Bad request"case 401…

再获5G RedCap能力认证!宏电5G RedCap工业智能网关通过中国联通5G物联网OPENLAB开放实验室测试验证

​近日&#xff0c;中国联通5G物联网OPENLAB开放实验室携手宏电股份完成5G RedCap工业智能网关端到端的测试验证&#xff0c;并颁发OPENLAB实验室面向RedCap终端的认证证书&#xff0c;为RedCap产业规模推广、全行业赋能打下坚实基础。 中国联通5G物联网OPENLAB开放实验室是中国…

python模块之redisbloom redis布隆过滤器

一、简介 RedisBloom 是一个 Redis 模块&#xff0c;提供了布隆过滤器&#xff08;Bloom Filter&#xff09;、计数器&#xff08;Count-Min Sketch&#xff09;、Top-K&#xff08;Top-K&#xff09;、Top-K with expiry&#xff08;Top-K with Expiration&#xff09;和多样…

【面经】讲一下线程池的参数和运行原理

线程池是Java中一种重要的并发工具&#xff0c;它可以帮助我们更好地管理线程&#xff0c;避免线程过多导致的系统开销和性能问题。线程池通过预先创建一定数量的线程&#xff0c;并将任务提交给这些线程执行&#xff0c;从而避免了频繁创建和销毁线程的开销。 线程池的参数主…

搭建 Makefile+OpenOCD+CMSIS-DAP+Vscode arm-none-eabi-gcc 工程模板

STM32F407-GCC-Template Arm-none-eabi-gcc MakefileOpenOCDCMSIS-DAPVscode工程模板 一、本次环境搭建所用的软硬件 1&#xff09;Windows or Linux (本文以Windows为主) 2&#xff09;JLink、Daplink、Wch-Link烧录器 3&#xff09;GNU Arm Embedded Toolchain交叉编译…