OCR support

Before reviewing this document, it is recommended to read the Gadget Plug-in Documentation Experience Tool Gadget, which is fully implemented using this plug-in. T he plug-in supports ID identification, travel card identification and bank card identification. S mall program code

request for access

• Please search this plugin in the background (AppID = WX4418E3E031E5551BE) settings - Third-party service - Add Plugin

Call restriction

• To open a community purchase, the amount of the appid is universal in the plugin, API, and service market.

Call mode

Addition declaration in app.json Introduced Plugin Version Select the latest

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

JSON of the page also increases the declaration

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

Assembly

Outside exposure to custom components, the UI vector is built for Button (can be customized)

parameter

Attribute name	type	Defaults	Whether it will be filled	illustrate
onSuccess	HandleEvent		Yes	Interface call successful callback function
certificateType	String	idCard	Whether	The certificate type consists of four types of ID cards: idCard, driver's license: drivinglicense, bank card: bankCard, business license: businesslicense

Back to the results image_path is the temporary address of the user's ID photo, the developer can image_path user's ID photo through the user's photo

The following is a specific description of how the four types of documents are used

1, identity card

CertificateType is the parameter of 'idCard' or no certifateType

The property name	Type	The default	Is it required	Description
onSuccess	HandleEvent		Is	The interface calls a successful callback function
certificateType	String	idCard	Whether	The certificate type consists of four types of ID cards: idCard, driver's license: drivinglicense, bank card: bankCard, business license: businesslicense
opposite	Boolean	true	Whether	Whether to display the opposite side of the ID card, the default is true to show the opposite side

onSuccess

Parameter e.detail

Refer to your ID card to return an instance of the results

Example code 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;
}

The ID returns the result instance

{"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, bank card

certificateType='bankCard'

The property name	Type	The default	Is it required	Description
onSuccess	HandleEvent		Is	The interface calls a successful callback function
certificateType	String	bankCard	Is	The certificate type consists of four types of ID cards: idCard, driver's license: drivinglicense, bank card: bankCard, business license: businesslicense

onSuccess

Parameter e.detail

Refer to the bank card to return an example of the result

Example code 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;
}

The bank card returns an instance of the result

{"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"}

The bank card returns the result

Bank cards only support horizontal savings cards, credit cards, and can only identify bank card numbers, if the bank card name, expiration time needs to be manually entered by the user

3, driving license

certificateType='drivingLicense'

The property name	Type	The default	Is it required	Description
onSuccess	HandleEvent		Is	The interface calls a successful callback function
certificateType	String	drivingLicense	Is	The certificate type consists of four types of ID cards: idCard, driver's license: drivinglicense, bank card: bankCard, business license: businesslicense

onSuccess

Parameter e.detail

Refer to the travel permit to return an example of the result

Example code 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;
}

The travel permit returns an instance of the result

{"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"}

The driver's license returns the result

The driver's license supports the positive side page in a picture

4, business license

certificateType='businessLicense'

The property name	Type	The default	Is it required	Description
onSuccess	HandleEvent		Is	The interface calls a successful callback function
certificateType	String	businessLicense	Is	The certificate type consists of four types of ID cards: idCard, driver's license: drivinglicense, bank card: bankCard, business license: businesslicense

onSuccess

Parameter e.detail

Refer to the business license to return an example of the results

Example code 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;
}

The business license returns an example of the result

{"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"}

Description

This document works with plug-ins 3.0.2 and above, and the debug base library is only available at 2.4.0 and above