微信小程序获取用户收货地址与指纹验证接口(安卓和iphone)

@toc

1、获取用户收货地址接口wx.chooseAddress()

  wx.chooseAddress(Object object)获取用户收货地址,此接口调用的是微信的收货地址。微信收货地址不同于微信设置的省和市地址,它默认是不存在的。在某个小程序中,当用户第一次调用wx.chooseAddress(Object object)接口时,会被要求填写微信收货地址;当用户第二次访问wx.chooseAddress(Object object)接口时,则可以看到自己以前填写的收货地址。这里说的第二次可以是不同的小程序,例如用户在访问A小程序时填写了微信收货地址,则用户在访问带有wx.chooseAddress(Object object)接口的B或者C小程序时都可以看到以前填写的微信收货地址。

1.1 接口参数

  wx.chooseAddress(Object object)接口属性如下表所示。

属性类型默认值必填说明
successfunction接口调用成功的回调函数
failfunction接口调用失败的回调函数
completefunction接口调用结束的回调函数(调用成功、失败都会执行)

  object.success回调函数:

属性类型说明
userNamestring收货人姓名
postalCodestring邮编
provinceNamestring国标收货地址第一级地址
cityNamestring国标收货地址第二级地址
countyNamestring国标收货地址第三级地址
streetNamestring国标收货地址第四级地址
detailInfostring详细收货地址信息(包括街道地址)
detailInfoNewstring新选择器详细收货地址信息
nationalCodestring收货地址国家码
telNumberstring收货人手机号码
errMsgstring错误信息

  官网示例代码:

wx.chooseAddress({
  success (res) {
    console.log(res.userName)
    console.log(res.postalCode)
    console.log(res.provinceName)
    console.log(res.cityName)
    console.log(res.countyName)
    console.log(res.detailInfo)
    console.log(res.nationalCode)
    console.log(res.telNumber)
  }
})

1.2 案例演示

  本例使用wx.chooseAddress(Object object)获取微信收货地址,并把获取的收货地址信息填入表单,由于是第一次访问wx.chooseAddress()接口,所以点击“获取收货地址”按钮之后,出现了新建并保存收货地址页面。当用户点击保存按钮时,系统获取了微信收货地址并填入表单。

  chooseAddress.wxml:

<view class="container">
  <form>
    <view class="page-section">
      <view class="weui-cells weui-cells_after-title">
        <view class="weui-cell weui-cell_input">
          <view class="weui-cell__hd">
            <view class="weui-label">收货人姓名</view>
          </view>
          <view class="weui-cell__bd">
            {{ addressInfo.userName }}
          </view>
        </view>

        <view class="weui-cell weui-cell_input">
          <view class="weui-cell__hd">
            <view class="weui-label">邮编</view>
          </view>
          <view class="weui-cell__bd">
            {{ addressInfo.postalCode }}
          </view>
        </view>

        <view class="weui-cell weui-cell_input region">
          <view class="weui-cell__hd">
            <view class="weui-label">地区</view>
          </view>
          <view class="weui-cell__bd">
            {{ addressInfo.provinceName }}
            {{ addressInfo.cityName }}
            {{ addressInfo.countyName }}
          </view>
        </view>


        <view class="weui-cell weui-cell_input detail">
          <view class="weui-cell__hd">
            <view class="weui-label">收货地址</view>
          </view>
          <view class="weui-cell__bd">
            {{ addressInfo.detailInfo }}
          </view>
        </view>

          <view class="weui-cell weui-cell_input">
          <view class="weui-cell__hd">
            <view class="weui-label">国家码</view>
          </view>
          <view class="weui-cell__bd">
            {{ addressInfo.nationalCode }}
          </view>
        </view>

        <view class="weui-cell weui-cell_input">
          <view class="weui-cell__hd">
            <view class="weui-label">手机号码</view>
          </view>
          <view class="weui-cell__bd">
            {{ addressInfo.telNumber }}
          </view>
        </view>

      </view>
    </view>
  </form>
  
  <view class="btn-area"  hidden="{{chooseAddress}}">
    <button type="primary" bindtap="chooseAddress">获取收货地址</button>
  </view>
   <view class="btn-area"  hidden="{{!chooseAddress}}">
    <button type="primary" bindtap="pay">提交</button>
  </view>
</view>

  chooseAddress.js:

Page({
  data: {
    addressInfo: null,
    chooseAddress:false
  },
  chooseAddress:function(e){
    var that=this;
    wx.chooseAddress({
      success: function (res){
        that.setData({
          addressInfo: res,
          chooseAddress: true
        })
      },
      fail: function (err) {
        console.log(err)
      }
    })
  },
  
   pay:function(e){
  
     wx.navigateTo({
       url: '../pay/pay'
     })
   }
})

   除此之外,还有个wx.chooseInvoiceTitle()接口,它和wx.chooseAddress()接口雷系,它用来获取用户的发票信息,包含抬头类型、抬头税号、单位地址、手机号码、银行名称和银行账号等属性。

image-20220322203411837

image-20220322203431287

  这里由于我已经填写过一次了,所以会把上次填的显示出来,这里也可以新建一个,我们就用上次填的数据,选中之后信息就被填入到了下面的表单当中。

image-20220322203514678

2、SOTER指纹认证

2.1 功能简介

  小程序提供wx.checkIsSupportSoterAuthentication(Object object)wx.checkIsSoterEnrolledInDevice(Object object)wx.startSoterAuthentication(Object object)3个接口来实现认证。

wx.checkIsSupportSoterAuthentication(Object object)实现检测手机是否支持指纹认证的功能;wx.checkIsSoterEnrolledInDevice(Object object)实现检测手机安全设置系统是否已经录入过指纹信息;wx.startSoterAuthentication(Object object)判断当前录入的指纹是否与手机安全指纹一致。

2.2 接口参数

2.2.1 wx.checkIsSupportSoterAuthentication(Object object)

  wx.checkIsSupportSoterAuthentication(Object object)接口的success函数的回调结果保存在res.supportMode中。

属性类型默认值必填说明
successfunction接口调用成功的回调函数
failfunction接口调用失败的回调函数
completefunction接口调用结束的回调函数(调用成功、失败都会执行)

image-20220322204132659

2.2.2 wx.checkIsSoterEnrolledInDevice(Object object)

  wx.checkIsSoterEnrolledInDevice(Object object)接口检测手机是否保存了指纹、人脸和声纹信息,该接口属性如下表所示:

image-20220322204228419

  object.success回调函数:

属性类型说明
isEnrolledboolean是否已录入信息
errMsgstring错误信息

  官网示例代码:

wx.checkIsSoterEnrolledInDevice({
  checkAuthMode: 'fingerPrint',
  success(res) {
    console.log(res.isEnrolled)
  }
})

2.2.3 wx.startSoterAuthentication(Object object)

  wx.startSoterAuthentication(Object object)接口是真正执行SOTER认证的接口,也就是执行指纹认证。

image-20220322204439979

  object.success回调函数:

属性类型说明
authModestring生物认证方式
resultJSONstring在设备安全区域(TEE)内获得的本机安全信息(如TEE名称版本号等以及防重放参数)以及本次认证信息(仅Android支持,本次认证的指纹ID)。具体说明见下文
resultJSONSignaturestring用SOTER安全密钥对 resultJSON 的签名(SHA256 with RSA/PSS, saltlen=20)
errCodenumber错误码
errMsgstring错误信息

2.3 案例演示

  本例使用SOTER认证的3个接口验证小程序的指纹识别功能,这里我手机没有指纹识别,借了部安卓手机。

  SoterAuthentication.wxml:

<view class="container">
  <view class="page-body">
    <view class="btn-area">
      <button type="primary" bindtap="startAuth">指纹认证</button>
    </view>
  </view>
</view>

  SoterAuthentication.js:

const AUTH_MODE = 'fingerPrint'
Page({
  startAuth() {
    wx.checkIsSupportSoterAuthentication({
      success: (res) => {
        console.log(res)
        checkIsEnrolled()
      },
      fail: (err) => {
        console.error(err)
        wx.showModal({
          title: '错误',
          content: '您的设备不支持指纹识别',
          showCancel: false
        })
      }
    })

    const checkIsEnrolled = () => {
      wx.checkIsSoterEnrolledInDevice({
        checkAuthMode: AUTH_MODE,
        success: (res) => {
          console.log(res)
          if (parseInt(res.isEnrolled) <= 0) {
            wx.showModal({
              title: '错误',
              content: '您暂未录入指纹信息,请录入后重试',
              showCancel: false
            })
            return
          }
          startSoterAuthentication();
        },
        fail: (err) => {
          console.error(err)
        }
      })
    }

    const startSoterAuthentication = () => {
      wx.startSoterAuthentication({
        requestAuthModes: [AUTH_MODE],
        challenge: 'test',
        authContent: '指纹认证示例',
        success: (res) => {
          console.log(res)
          wx.showToast({
            title: '认证成功',
            duration: 10000
          })
        },
        fail: (err) => {
          console.error(err)
          wx.showModal({
            title: '失败',
            content: '认证失败',
            showCancel: false
          })
        }
      })
    }
  }
})

2.3.1 安卓手机指纹测试

image-20220322205548310

image-20220322205602690

  这部手机指纹在背面,我们输入指纹看下。

image-20220322205751922

image-20220322205616166

2.3.2 iphone手机人脸识别测试

  我们将代码中的const AUTH_MODE = 'fingerPrint'替换为const AUTH_MODE = 'facial'即可变为人脸识别方式。

image-20220322210244161

image-20220322210314630

  点击人脸识别按钮,开始识别

image-20220322210357679

image-20220322210330041

  可以看到,安卓和苹果都没问题。

posted @   别团等shy哥发育  阅读(136)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
点击右上角即可分享
微信分享提示