微信小程序调用安卓手机系统指纹实现登录功能

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:

  1. wx.checkIsSupportSoterAuthentication:检查手机是否支持指纹识别功能。如果手机不支持,那么程序提示用户并退出指纹识别流程。
  2. wx.checkIsSoterEnrolledInDevice:检查当前用户是否已经录入了指纹。如果没有录入,那么程序提示用户录入指纹并退出指纹识别流程。
  3. wx.startSoterAuthentication:启动指纹识别功能,并在指纹识别成功和失败时分别作出相应的操作,比如展示提示信息和修改页面数据。

需要注意的是,在 wx.startSoterAuthentication 中,需要将 requestAuthModes 设置为一个数组,数组中的值表示使用哪些方式进行身份验证,本例中只使用了指纹验证。

在页面中,利用 wx:if 和 wx:else 来根据用户是否已经登录来展示相应的文本信息或按钮。

  • 8
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值