codecamp

微信小程序 插件服务·OCR支持

OCR 支持

查看本文档前,建议先阅读《小程序插件文档》 体验工具小程序 —— 该插件完全使用此插件实现。该插件支持身份证识别,行驶证识别和银行卡识别。 小程序码 

申请权限

  • 请在小程序后台搜索本插件(AppID=wx4418e3e031e551be) 设置-第三方服务-添加插件

调用限制

  • 来开放社区购买,appid内的额度在插件、API、服务市场是通用的

调用方式

app.json中增加声明引入插件 version选择最新的

  "pages": [],
  "plugins": {
    "ocr-plugin": {
      "version": "3.0.2",
      "provider": "wx4418e3e031e551be"
    }
  }
}

页面的json也要增加声明

{
  "usingComponents": {
    "ocr-navigator": "plugin://ocr-plugin/ocr-navigator"
  }
}

组件

对外暴露自定义组件,UI载体为button(可样式自定义) 封装了

参数

属性名类型默认值是否必填说明
onSuccessHandleEvent接口调用成功的回调函数
certificateTypeStringidCard证书类型包含四种 身份证:idCard、驾驶证:drivingLicense、银行卡:bankCard、营业执照:businessLicense

返回结果中image_path 是用户证件照片的临时地址,开发者可以通过image_path拿到用户的证件照片

以下具体说明四种证件类型的使用方法

1、身份证

certificateType='idCard' 或 无certificateType这个参数

属性名类型默认值是否必填说明
onSuccessHandleEvent接口调用成功的回调函数
certificateTypeStringidCard证书类型包含四种 身份证:idCard、驾驶证:drivingLicense、银行卡:bankCard、营业执照:businessLicense
oppositeBooleantrue是否显示身份证的反面,默认为 true显示反面

onSuccess

参数 e.detail

参考身份证返回结果实例

示例代码1

    <ocr-navigator bind:onSuccess="success" certificateType="idCard" opposite="{{false}}">
      <button type="primary">身份证正面识别</button>
    </ocr-navigator>
    <ocr-navigator bind:onSuccess="success" certificateType="idCard" opposite="{{true}}">
      <button type="primary">身份证反面识别</button>
    </ocr-navigator>
/** wxss **/
/*自定义按钮样式*/
.ocr-wrapper {
  margin: 40rpx auto;
  width: 375rpx;
}
.intro {
  margin: 40rpx;
}

身份证返回结果实例

{"type":0,"name":{"text":"张三","pos":{"left_top":{"x":98.7780914307,"y":40.9823074341},"right_top":{"x":172.311325073,"y":41.2864379883},"right_bottom":{"x":172.190856934,"y":64.9047088623},"left_bottom":{"x":98.6072158813,"y":64.5630187988}},"label":[]},"gender":{"text":"男","pos":{"left_top":{"x":101.035919189,"y":80.7537384033},"right_top":{"x":121.421043396,"y":80.7818603516},"right_bottom":{"x":121.264938354,"y":101.272567749},"left_bottom":{"x":100.882026672,"y":101.244766235}},"label":[]},"nationality":{"text":"汉","pos":{"left_top":{"x":201.881393433,"y":81.7225189209},"right_top":{"x":222.004470825,"y":81.6959762573},"right_bottom":{"x":221.899169922,"y":101.255821228},"left_bottom":{"x":201.765304565,"y":101.291915894}},"label":[]},"address":{"text":"广州市天河区五山路483号xxxxxxxxx","pos":{"left_top":{"x":95.5787811279,"y":150.794250488},"right_top":{"x":310.358947754,"y":151.617507935},"right_bottom":{"x":310.004699707,"y":220.222885132},"left_bottom":{"x":95.1295013428,"y":219.552230835}},"label":[]},"id":{"text":"4452xxxxxxxxxxxx","pos":{"left_top":{"x":176.158676147,"y":244.072860718},"right_top":{"x":453.888336182,"y":244.978515625},"right_bottom":{"x":453.874603271,"y":266.313659668},"left_bottom":{"x":176.066543579,"y":265.342407227}},"label":[]},"card_position":{"pos":{"left_top":{"x":1085.625,"y":621.75},"right_top":{"x":338.125,"y":594.75},"right_bottom":{"x":303.625,"y":99.75},"left_bottom":{"x":1189.125,"y":126.75}},"label":[]},"image_width":1280,"image_height":960,"image_path":"http://tmp/wx4418e3e031e551be.o6zAJs-yC5ByIjnyyy09jKDZquXk.dlrc7P7WlhnGb4aca86b078fc2acb5b08e7a0f438943.jpg"}

2、银行卡

certificateType='bankCard'

属性名类型默认值是否必填说明
onSuccessHandleEvent接口调用成功的回调函数
certificateTypeStringbankCard证书类型包含四种 身份证:idCard、驾驶证:drivingLicense、银行卡:bankCard、营业执照:businessLicense

onSuccess

参数 e.detail

参考银行卡返回结果实例

示例代码1

<ocr-navigator bind:onSuccess="blankSuccess"  certificateType="bankCard">
  <button type="primary">银行卡识别</button>
</ocr-navigator>
/** wxss **/
/*自定义按钮样式*/
.ocr-wrapper {
  margin: 40rpx auto;
  width: 375rpx;
}
.intro {
  margin: 40rpx;
}

银行卡返回结果实例

{"number":{"text":"6225xxxxxxxxxxxx","label":[]},"card_position":{"pos":{"left_top":{"x":2.19140625,"y":227.6171875},"right_top":{"x":729.50390625,"y":206.0546875},"right_bottom":{"x":769.91015625,"y":658.8671875},"left_bottom":{"x":-11.27734375,"y":680.4296875}},"label":[]},"image_width":762,"image_height":1280,"image_path":"http://tmp/wx4418e3e031e551be.o6zAJs-yC5ByIjnyyy09jKDZquXk.dlrc7P7WlhnGb4aca86b078fc2acb5b08e7a0f438943.jpg"}

银行卡返回结果

银行卡只支持横版储蓄卡,信用卡,并且只能识别出银行卡号,如果需要银行卡名称、过期时间需要用户手动输入

3、行驶证

certificateType='drivingLicense'

属性名类型默认值是否必填说明
onSuccessHandleEvent接口调用成功的回调函数
certificateTypeStringdrivingLicense证书类型包含四种 身份证:idCard、驾驶证:drivingLicense、银行卡:bankCard、营业执照:businessLicense

onSuccess

参数 e.detail

参考行驶证返回结果实例

示例代码1

<ocr-navigator bind:onSuccess="driverSuccess" certificateType="drivingLicense" selectedOptions="{{['plateNum','vehicleType','owner']}}">
  <button type="primary">行驶证识别</button>
</ocr-navigator>
/** wxss **/
/*自定义按钮样式*/
.ocr-wrapper {
  margin: 40rpx auto;
  width: 375rpx;
}
.intro {
  margin: 40rpx;
}

行驶证返回结果实例

{"plate_num":{"text":"粤KDxxxx","label":[]},"vehicle_type":{"text":"小型轿车","label":[]},"owner":{"text":"周xx","label":[]},"addr":{"text":"广东省xxxxxxxx","label":[]},"use_character":{"text":"非营运","label":[]},"model":{"text":"东风日产牌xxxxxx","label":[]},"vin":{"text":"LGBH52Exxxxxx","label":[]},"engine_num":{"text":"873073Y","label":[]},"register_date":{"text":"2017-11-13","label":[]},"issue_date":{"text":"2017-11-13","label":[]},"plate_num_b":{"text":"粤R82xxxx","label":[]},"record":{"text":"4418005xxxx","label":[]},"passengers_num":{"text":"26人","label":[]},"total_quality":{"text":"6900kg","label":[]},"prepare_quality":{"text":"4480kg","label":[]},"load_quality":{"text":"","label":[]},"lead_quality":{"text":"","label":[]},"overall_size":{"text":"7725x205xxxx","label":[]},"type":2,"card_position":[{"pos":{"left_top":{"x":454.0625,"y":17.34375},"right_top":{"x":987.8125,"y":11.71875},"right_bottom":{"x":987.8125,"y":562.96875},"left_bottom":{"x":471.5625,"y":546.09375}},"label":[]},{"pos":{"left_top":{"x":-0.9375,"y":28.59375},"right_top":{"x":445.3125,"y":22.96875},"right_bottom":{"x":445.3125,"y":551.71875},"left_bottom":{"x":-0.9375,"y":546.09375}},"label":[]}],"card_position_front":{"pos":{"left_top":{"x":454.0625,"y":17.34375},"right_top":{"x":987.8125,"y":11.71875},"right_bottom":{"x":987.8125,"y":562.96875},"left_bottom":{"x":471.5625,"y":546.09375}},"label":[]},"card_position_back":{"pos":{"left_top":{"x":-0.9375,"y":28.59375},"right_top":{"x":445.3125,"y":22.96875},"right_bottom":{"x":445.3125,"y":551.71875},"left_bottom":{"x":-0.9375,"y":546.09375}},"label":[]},"image_width":1000,"image_height":600,"img_size":{"w":1000,"h":600},"image_path":"http://tmp/wx4418e3e031e551be.o6zAJs-yC5ByIjnyyy09jKDZquXk.dlrc7P7WlhnGb4aca86b078fc2acb5b08e7a0f438943.jpg"}

行驶证返回结果

行驶证支持正副页面在一张图片中

4、营业执照

certificateType='businessLicense'

属性名类型默认值是否必填说明
onSuccessHandleEvent接口调用成功的回调函数
certificateTypeStringbusinessLicense证书类型包含四种 身份证:idCard、驾驶证:drivingLicense、银行卡:bankCard、营业执照:businessLicense

onSuccess

参数 e.detail

参考营业执照返回结果实例

示例代码1

<ocr-navigator bind:onSuccess="businessSuccess"   certificateType="businessLicense">
  <button type="primary">营业执照识别</button>
</ocr-navigator>
/** wxss **/
/*自定义按钮样式*/
.ocr-wrapper {
  margin: 40rpx auto;
  width: 375rpx;
}
.intro {
  margin: 40rpx;
}

营业执照返回结果实例

{"reg_num":{"text":"371400228016303","label":[]},"legal_representative":{"text":"xxxx","label":[]},"enterprise_name":{"text":"xxxxx有限公司","label":[]},"address":{"text":"xxx省xxx市xxx","label":[]},"type_of_enterprise":{"text":"有限责任公司(自然人投资或控股)","label":[]},"business_scope":{"text":"xxxxxxxxxxxx","label":[]},"registered_capital":{"text":"叁佰万元整","label":[]},"valid_period":{"text":"2008年04月12日至年月日","label":[]},"registered_date":{"text":"2008年04月12日","label":[]},"cert_position":{"pos":{"left_top":{"x":65.4609375,"y":115.640625},"right_top":{"x":567.4921875,"y":123.828125},"right_bottom":{"x":567.4921875,"y":811.578125},"left_bottom":{"x":65.4609375,"y":819.765625}},"label":[]},"img_size":{"w":630,"h":874},"image_path":"http://tmp/wx4418e3e031e551be.o6zAJs-yC5ByIjnyyy09jKDZquXk.dlrc7P7WlhnGb4aca86b078fc2acb5b08e7a0f438943.jpg"}

说明

本文档配合3.0.2以及以上的插件使用,并且调试基础库在2.4.0以及以上才能使用


微信小程序 插件服务·微信同声传译
微信小程序 服务平台·能力介绍
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

微信小程序 指南

目录结构

开放能力

微信小程序 调试

微信小程序 实时日志

微信小程序 小程序测速

微信小程序 基础组件

微信小程序 API

媒体

界面

微信小程序API 绘图

微信小程序 服务端

接口调用凭证

统一服务消息

微信小程序 服务市场

微信小程序 生物认证

微信小程序 云开发

服务端

微信小程序云开发服务端API 数据库

SDK文档

微信小程序 扩展能力

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }