卡證自動識別填充，簡化應用繫結操作

隨著數字化時代線上服務的普及，使用者足不出戶即可進行賬戶註冊、金融交易等操作，然而，為了享受這些服務，使用者往往需要在應用上繫結多種證件和卡片，如身份證、銀行卡、駕駛證、護照等，為了確保使用者資訊的唯一性、安全性和標準化，此類證件往往使用較長的標識碼作為證件號，手動輸入這些資訊不僅繁瑣還容易出錯。

為解決這一問題，HarmonyOS SDK場景化視覺服務（Vision Kit）推出了卡證識別控制元件。該控制元件提供身份證、行駛證、駕駛證、護照、銀行卡等證件的結構化識別服務，滿足卡證的自動分類功能，系統可自動判斷所屬卡證型別並返回結構化資訊和卡證圖片資訊。

對於需要填充卡證資訊的場景，如錄入身份資訊、填寫銀行卡號和有效期資訊等，可使用卡證識別控制元件讀取證件結構化資訊，將相關欄位返回後進行填充。支援單獨識別正面、反面，或同時進行雙面識別。

透過卡證識別控制元件不僅能降低使用者輸入錯誤的風險，還能快速識別提升輸入效率，最佳化使用者的互動體驗。

能力優勢

 效能高效：端側實現時延低，識別準確率高。

 開發簡便：快速整合部署，佔用空間小。

 使用者體驗流暢：有效提升使用者選擇效率，自動填充功能減少繁瑣操作。

功能演示

開發步驟

1.新增卡證識別控制元件相關的類。

import { CardRecognition, CallbackParam, CardType, CardSide } from "@kit.VisionKit";

2.配置頁面的佈局，選擇需要識別的卡證型別，和需要識別的卡證頁面，在回撥中獲取結果返回值。

a)身份證

CardRecognition({
  supportType: CardType.CARD_ID,
  // 身份證可雙面識別
  cardSide: CardSide.DEFAULT,
  callback: ((params: CallbackParam) => {
    hilog.info(0x0001, TAG, `params code: ${params.code}`)
    hilog.info(0x0001, TAG, `params cardType: ${params.cardType}`)
    hilog.info(0x0001, TAG, `params cardInfo front: ${JSON.stringify(params.cardInfo?.front)}`)
    hilog.info(0x0001, TAG, `params cardInfo back: ${JSON.stringify(params.cardInfo?.back)}`)
  })
})

b)銀行卡

CardRecognition({
  supportType: CardType.CARD_BANK,
  // 銀行卡為單面識別
  cardSide: CardSide.FRONT,
  callback: ((params: CallbackParam) => {
    hilog.info(0x0001, TAG, `params code: ${params.code}`)
    hilog.info(0x0001, TAG, `params cardType: ${params.cardType}`)
    hilog.info(0x0001, TAG, `params cardInfo: ${JSON.stringify(params.cardInfo?.main)}`)
  })
})

c)護照

CardRecognition({
  supportType: CardType.CARD_PASSPORT,
  // 護照為單面識別
  cardSide: CardSide.FRONT,
  callback: ((params: CallbackParam) => {
    hilog.info(0x0001, TAG, `params code: ${params.code}`)
    hilog.info(0x0001, TAG, `params cardType: ${params.cardType}`)
    hilog.info(0x0001, TAG, `params cardInfo: ${JSON.stringify(params.cardInfo?.main)}`)
  })
})

d)駕駛證

CardRecognition({
  supportType: CardType.CARD_DRIVER_LICENSE,
  // 駕駛證可雙面識別
  cardSide: CardSide.DEFAULT,
  callback: ((params: CallbackParam) => {
    hilog.info(0x0001, TAG, `params code: ${params.code}`)
    hilog.info(0x0001, TAG, `params cardType: ${params.cardType}`)
    hilog.info(0x0001, TAG, `params cardInfo front: ${JSON.stringify(params.cardInfo?.front)}`)
    hilog.info(0x0001, TAG, `params cardInfo back: ${JSON.stringify(params.cardInfo?.back)}`)
  })
})

e)行駛證

CardRecognition({
  supportType: CardType.CARD_VEHICLE_LICENSE,
  // 行駛證可雙面識別
  cardSide: CardSide.DEFAULT,
  callback: ((params: CallbackParam) => {
    hilog.info(0x0001, TAG, `params code: ${params.code}`)
    hilog.info(0x0001, TAG, `params cardType: ${params.cardType}`)
    hilog.info(0x0001, TAG, `params cardInfo front: ${JSON.stringify(params.cardInfo?.front)}`)
    hilog.info(0x0001, TAG, `params cardInfo back: ${JSON.stringify(params.cardInfo?.back)}`)
  })
})

瞭解更多詳情\>\>

訪問場景化視覺服務聯盟官網

獲取卡證識別開發指導文件

卡證自動識別填充，簡化應用繫結操作

能力優勢

功能演示

開發步驟

相關文章