uniapp 简单的生物认证（指纹、人脸）

参考文章：uniapp.dcloud.net.cn/api/system/…

代码

<template>
	<button type="primary" @click="checkIsSupportSoterAuthentication">检查支持的认证方式</button>
	<button type="primary" @click="checkIsSoterEnrolledInDeviceFingerPrint">检查是否录入指纹</button>
	<button type="primary" @click="checkIsSoterEnrolledInDeviceFaceID">检查是否录入FaceID</button>
	<button type="primary" @click="startSoterAuthenticationFingerPrint">开始指纹认证</button>
	<button type="primary" @click="startSoterAuthenticationFaceID">开始FaceID认证</button>
</template>

<script setup>
	import { ref, onMounted, computed, watchEffect, getCurrentInstance } from 'vue';
	import { onLoad } from '@dcloudio/uni-app';
	const { proxy } = getCurrentInstance();

	onMounted(() => {});
	onLoad((res) => {});

	function checkIsSupportSoterAuthentication() {
		uni.checkIsSupportSoterAuthentication({
			success(res) {
				console.log('检查支持的认证方式 成功', res);
				let fingerPrint = res.supportMode.includes('fingerPrint');
				let faceID = res.supportMode.includes('facial');
				console.log('是否支持指纹', fingerPrint);
				console.log('是否支持FaceID', faceID);
				uni.showModal({
					title: '提示',
					content: `当前设备支持的认证方式: \n 指纹: ${
						fingerPrint ? '支持' : '不支持'
					} \n FaceID: ${faceID ? '支持' : '不支持'}`,
					showCancel: false,
				});
			},
			fail(err) {
				console.log('检查支持的认证方式 失败', err);
			},
		});
	}
	function checkIsSoterEnrolledInDeviceFingerPrint() {
		uni.checkIsSoterEnrolledInDevice({
			checkAuthMode: 'fingerPrint',
			success(res) {
				console.log('检查是否录入指纹 成功', res);
				let isEnrolled = res.isEnrolled;
				console.log('是否录入指纹', isEnrolled);
				uni.showModal({
					title: '提示',
					content: `当前设备是否录入指纹: ${isEnrolled ? '是' : '否'}`,
					showCancel: false,
				});
			},
			fail(err) {
				console.log('检查是否录入指纹 失败', err);
			},
		});
	}
	function checkIsSoterEnrolledInDeviceFaceID() {
		uni.checkIsSoterEnrolledInDevice({
			checkAuthMode: 'facial',
			success(res) {
				console.log('检查是否录入FaceID 成功', res);
				let isEnrolled = res.isEnrolled;
				console.log('是否录入FaceID', isEnrolled);
				uni.showModal({
					title: '提示',
					content: `当前设备是否录入FaceID: ${isEnrolled ? '是' : '否'}`,
					showCancel: false,
				});
			},
			fail(err) {
				console.log('检查是否录入FaceID 失败', err);
			},
		});
	}
	function startSoterAuthenticationFingerPrint() {
		uni.startSoterAuthentication({
			requestAuthModes: ['fingerPrint'],
			challenge: '123456',
			authContent: '请用指纹解锁',
			success(res) {
				// #ifdef MP-WEIXIN
				res.resultJSON = JSON.parse(res.resultJSON);
				// #endif
				console.log('开始指纹认证 成功', res);
				uni.showToast({
					title: '指纹认证成功',
					icon: 'none',
				});
			},
			fail(err) {
				console.log('开始指纹认证 失败', err);
			},
			complete(res) {
				let msg = errorMsg(res.errCode);
				if (msg) {
					uni.showToast({
						title: msg,
						icon: 'none',
					});
				}
			},
		});
	}
	function startSoterAuthenticationFaceID() {
		uni.startSoterAuthentication({
			requestAuthModes: ['facial'],
			challenge: '123456',
			authContent: '请用FaceID解锁',
			success(res) {
				// #ifdef MP-WEIXIN
				res.resultJSON = JSON.parse(res.resultJSON);
				// #endif
				console.log('开始FaceID认证 成功', res);
				uni.showToast({
					title: 'FaceID认证成功',
					icon: 'none',
				});
			},
			fail(err) {
				console.log('开始FaceID认证 失败', err);
			},
			complete(res) {
				let msg = errorMsg(res.errCode);
				if (msg) {
					uni.showToast({
						title: msg,
						icon: 'none',
					});
				}
			},
		});
	}
	function errorMsg(errCode) {
		let msg = '';
		switch (errCode) {
			case 90001:
				msg = '本设备不支持生物认证';
				break;
			case 90002:
				msg = '用户未授权使用该生物认证接口';
				break;
			case 90003:
				msg = '请求使用的生物认证方式不支持';
				break;
			case 90004:
				msg = '未传入challenge或challenge长度过长（最长512字符）';
				break;
			case 90005:
				msg = 'auth_content长度超过限制（最长42个字符）';
				break;
			case 90007:
				msg = '内部错误';
				break;
			case 90008:
				msg = '用户取消授权';
				break;
			case 90009:
				msg = '识别失败';
				break;
			case 90010:
				msg = '重试次数过多被冻结';
				break;
			case 90011:
				msg = '用户未录入所选识别方式';
				break;
		}
		return msg;
	}
</script>

<style lang="scss" scoped></style>