index.js 中添加以下代码:
Page({
data: {
hasLogin: false
},
onLoad: function () {
const _this = this
wx.checkIsSupportSoterAuthentication({
success(res) {
if (res.supportMode.indexOf('fingerPrint') === -1) {
wx.showToast({
title: '您的手机暂不支持指纹识别',
icon: 'none',
duration: 2000
})
return
}
_this.setData({
hasLogin: true
})
},
fail() {
wx.showToast({
title: '系统错误',
icon: 'none',
duration: 2000
})
}
})
},
startSoterAuthentication: function () {
const _this = this
wx.checkIsSoterEnrolledInDevice({
checkAuthMode: 'fingerPrint',
success(res) {
if (res.isEnrolled === 0) {
wx.showToast({
title: '您尚未录入指纹,请到系统设置中录入',
icon: 'none',
duration: 2000
})
return
}
wx.startSoterAuthentication({
requestAuthModes: ['fingerPrint'],
challenge: '123456',
authContent: '请用指纹进行身份验证',
success(res) {
wx.showToast({
title: '登录成功',
icon: 'success',
duration: 2000
})
_this.setData({
hasLogin: true
})
},
fail(res) {
wx.showToast({
title: '登录失败,请重试',
icon: 'none',
duration: 2000
})
}
})
},
fail() {
wx.showToast({
title: '系统错误',
icon: 'none',
duration: 2000
})
}
})
}
})
index.wxml 中添加以下代码:
<view class="container">
<view wx:if="{{!hasLogin}}">
<button bindtap="startSoterAuthentication">点击登录</button>
</view>
</view>
这段代码实现了微信小程序中通过手机系统指纹识别来实现登录的功能。该程序分别使用了三个 API:
wx.checkIsSupportSoterAuthentication
:检查手机是否支持指纹识别功能。如果手机不支持,那么程序提示用户并退出指纹识别流程。wx.checkIsSoterEnrolledInDevice
:检查当前用户是否已经录入了指纹。如果没有录入,那么程序提示用户录入指纹并退出指纹识别流程。wx.startSoterAuthentication
:启动指纹识别功能,并在指纹识别成功和失败时分别作出相应的操作,比如展示提示信息和修改页面数据。
需要注意的是,在 wx.startSoterAuthentication
中,需要将 requestAuthModes
设置为一个数组,数组中的值表示使用哪些方式进行身份验证,本例中只使用了指纹验证。
在页面中,利用 wx:if
和 wx:else
来根据用户是否已经登录来展示相应的文本信息或按钮。