Overview

The H5 Document Verification solution offers UI and Feature customisation options tailored to your business needs, ensuring a unique and personalised experience for your users.

The configuration scope covers 4 sections:

featureCfg: configuration of the entire Document Verification process
theme: UI designs of the key components throughout the entire Document Verification process
i18n: UX copy for each component throughout the entire Document Verification process
language: language selection which will impact

Below are the instructions of how to integrate with the API to enable customizing UI through configurations

Request URL

https://api.advance.ai/intl/openapi/face-identity/h5-idv/v1/config-ui
POST (form-data)

Request Header Parameters

Parameter	Description
X-ACCESS-TOKEN	`string` Please use this guide to get your access token

Request Parameters

{
    "featureCfg": {},
    "theme": {},
    "i18n": {},
    "language": "xxx"
}

featureCfg (optional)

Parameters	Description
scanTryCount	The maximum number of trials allowed for a user to scan document, while the default="1"
scanTimeout	The maximum duration in seconds for the scanning process to complete before it is automatically timed out. Once timed out, it will automatically change to manual image taking mode to continue document capture.
showStartPage	This parameter determines whether the default guidance start page is provided. If you wish to create your own guidance start page that aligns with your business requirements, you can set it to 'false'.

Sample

{
    "scanTryCount": 1,
    "scanTimeout": 20,
    "showStartPage": true,
}

theme (optional)

Item	Customisation
Text and Copy	- Font size - Font thickness - Color - Copy - Text copy
Tooltips and Icons	- Icon image is replaceable
Buttons	- Background Color - Button text - Font size - Font thickness - Color
Page background	- Background color - Background image
Toast message	- Background color - Toast text - Font size - Font thickness - Color

Please note on the below restrictions:

Font size (8px-42px)
Font thickness (normal, lighter, bolder, bold, 900, 800, 700, 600, 500, 400, 300, 200, 100)
Color (hex color code)
Copy (max limit at 100 bytes)
Icon format (base64)
Icon image (max limit at 20kb)
Background image (max limit at 100kb, format is Url)

Sample

Please refer to below screen references when customising the individual pages and corresponding components

{
  "start": {
    "title": {
      "font-size": "18px",
      "font-weight": "normal",
      "color": "#0000ff"
    },
    "desc": {
      "font-size": "14px",
      "font-weight": "lighter",
      "color": "#0000ff"
    },
    "rightImage": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "tip1": {
      "font-size": "16px",
      "font-weight": "bolder",
      "color": "#0000ff"
    },
    "tip2": {
      "font-size": "16px",
      "font-weight": "bold",
      "color": "#0000ff"
    },
    "tip3": {
      "font-size": "16px",
      "font-weight": "900",
      "color": "#0000ff"
    },
    "tip1Icon": {
      "background-image": "url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNSIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI1IDI0IiBmaWxsPSJub25lIj4KICA8cGF0aCBkPSJNMTIuMzk5OSAzQzcuNDQ5OSAzIDMuMzk5OSA3LjA1IDMuMzk5OSAxMkMzLjM5OTkgMTYuOTUgNy40NDk5IDIxIDEyLjM5OTkgMjFDMTcuMzQ5OSAyMSAyMS4zOTk5IDE2Ljk1IDIxLjM5OTkgMTJDMjEuMzk5OSA3LjA1IDE3LjM0OTkgMyAxMi4zOTk5IDNaTTE3Ljk0OTkgOUwxMS4wNDk5IDE1LjlDMTAuODk5OSAxNi4wNSAxMC41OTk5IDE2LjIgMTAuMjk5OSAxNi4ySDEwLjE0OTlDOS44NDk5IDE2LjIgOS42OTk5IDE2LjA1IDkuMzk5OSAxNS45TDYuNTQ5OSAxMy42NUM2LjA5OTkgMTMuMiA2LjA5OTkgMTIuNDUgNi4zOTk5IDEyQzYuODQ5OSAxMS41NSA3LjQ0OTkgMTEuNCA4LjA0OTkgMTEuODVMMTAuMTQ5OSAxMy42NUwxNi4yOTk5IDcuNUMxNi43NDk5IDcuMDUgMTcuNDk5OSA3LjA1IDE3Ljk0OTkgNy41QzE4LjM5OTkgNy44IDE4LjM5OTkgOC41NSAxNy45NDk5IDlaIiBmaWxsPSIjNTVDMjY1Ii8+Cjwvc3ZnPg==')"
    },
    "tip2Icon": {
      "background-image": "url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNSIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI1IDI0IiBmaWxsPSJub25lIj4KICA8cGF0aCBkPSJNMTIuMzk5OSAzQzcuNDQ5OSAzIDMuMzk5OSA3LjA1IDMuMzk5OSAxMkMzLjM5OTkgMTYuOTUgNy40NDk5IDIxIDEyLjM5OTkgMjFDMTcuMzQ5OSAyMSAyMS4zOTk5IDE2Ljk1IDIxLjM5OTkgMTJDMjEuMzk5OSA3LjA1IDE3LjM0OTkgMyAxMi4zOTk5IDNaTTE3Ljk0OTkgOUwxMS4wNDk5IDE1LjlDMTAuODk5OSAxNi4wNSAxMC41OTk5IDE2LjIgMTAuMjk5OSAxNi4ySDEwLjE0OTlDOS44NDk5IDE2LjIgOS42OTk5IDE2LjA1IDkuMzk5OSAxNS45TDYuNTQ5OSAxMy42NUM2LjA5OTkgMTMuMiA2LjA5OTkgMTIuNDUgNi4zOTk5IDEyQzYuODQ5OSAxMS41NSA3LjQ0OTkgMTEuNCA4LjA0OTkgMTEuODVMMTAuMTQ5OSAxMy42NUwxNi4yOTk5IDcuNUMxNi43NDk5IDcuMDUgMTcuNDk5OSA3LjA1IDE3Ljk0OTkgNy41QzE4LjM5OTkgNy44IDE4LjM5OTkgOC41NSAxNy45NDk5IDlaIiBmaWxsPSIjNTVDMjY1Ii8+Cjwvc3ZnPg==')"
    },
    "tip3Icon": {
      "background-image": "url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNSIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI1IDI0IiBmaWxsPSJub25lIj4KICA8cGF0aCBkPSJNMTIuMzk5OSAzQzcuNDQ5OSAzIDMuMzk5OSA3LjA1IDMuMzk5OSAxMkMzLjM5OTkgMTYuOTUgNy40NDk5IDIxIDEyLjM5OTkgMjFDMTcuMzQ5OSAyMSAyMS4zOTk5IDE2Ljk1IDIxLjM5OTkgMTJDMjEuMzk5OSA3LjA1IDE3LjM0OTkgMyAxMi4zOTk5IDNaTTE3Ljk0OTkgOUwxMS4wNDk5IDE1LjlDMTAuODk5OSAxNi4wNSAxMC41OTk5IDE2LjIgMTAuMjk5OSAxNi4ySDEwLjE0OTlDOS44NDk5IDE2LjIgOS42OTk5IDE2LjA1IDkuMzk5OSAxNS45TDYuNTQ5OSAxMy42NUM2LjA5OTkgMTMuMiA2LjA5OTkgMTIuNDUgNi4zOTk5IDEyQzYuODQ5OSAxMS41NSA3LjQ0OTkgMTEuNCA4LjA0OTkgMTEuODVMMTAuMTQ5OSAxMy42NUwxNi4yOTk5IDcuNUMxNi43NDk5IDcuMDUgMTcuNDk5OSA3LjA1IDE3Ljk0OTkgNy41QzE4LjM5OTkgNy44IDE4LjM5OTkgOC41NSAxNy45NDk5IDlaIiBmaWxsPSIjNTVDMjY1Ii8+Cjwvc3ZnPg==')"
    },
    "guideImage": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "errorImage1": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "errorImage2": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "errorImage3": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "tipError1": {
      "font-size": "12px",
      "font-weight": "800",
      "color": "#DE4F4F"
    },
    "tipError2": {
      "font-size": "12px",
      "font-weight": "700",
      "color": "#DE4F4F"
    },
    "tipError3": {
      "font-size": "12px",
      "font-weight": "600",
      "color": "#DE4F4F"
    },
    "tipError1Icon": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "tipError2Icon": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "tipError3Icon": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "button": {
      "font-size": "16px",
      "font-weight": "500",
      "color": "#FFF",
      "background": "#00FFFF"
    },
    "page": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')",
      "background-color": "#FFF"
    }
  },
  "scan": {
    "title": {
      "font-size": "18px",
      "font-weight": "400",
      "color": "#0000ff"
    },
    "header": {
      "font-size": "16px",
      "font-weight": "700",
      "color": "#0000ff"
    },
    "desc": {
      "font-size": "14px",
      "font-weight": "300",
      "color": "#0000ff"
    },
    "successIcon": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "failIcon": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "message": {
      "font-size": "14px",
      "font-weight": "200",
      "color": "#0000ff"
    },
    "countdown": {
      "font-size": "12px",
      "font-weight": "300",
      "color": "#0000ff"
    },
    "loading": {
      "background-color": "#fff"
    },
    "loadingText": {
      "font-size": "16px",
      "font-weight": "100",
      "color": "#000"
    },
    "loadingIcon": {
      "color": "#0000ff"
    },
    "toast": {
      "font-size": "16px",
      "font-weight": "700",
      "color": "#FFF",
      "background": "#0000ff"
    },
    "page": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')",
      "background-color": "#FFF"
    }
  },
  "manual": {
    "title": {
      "font-size": "18px",
      "font-weight": "700",
      "color": "#0000ff"
    },
    "header": {
      "font-size": "16px",
      "font-weight": "700",
      "color": "#0000ff"
    },
    "desc": {
      "font-size": "14px",
      "font-weight": "400",
      "color": "#0000ff"
    },
    "tip": {
      "font-size": "14px",
      "font-weight": "900",
      "color": "#0000ff",
      "background-color": "#E0E0E0"
    },
    "tipIcon": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "takePhotoIcon": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "toast": {
      "font-size": "16px",
      "font-weight": "700",
      "color": "#FFF",
      "background": "#00FFFF"
    },
    "page": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')",
      "background-color": "#00FFFF"
    }
  },
  "result": {
    "title": {
      "font-size": "18px",
      "font-weight": "700",
      "color": "#00FFFF"
    },
    "tipIcon": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "tip": {
      "font-size": "14px",
      "font-weight": "400",
      "color": "#666",
      "background-color": "#EDF2F0"
    },
    "buttonRetake": {
      "font-size": "14px",
      "font-weight": "500",
      "color": "#0000ff",
      "border": "1px solid rgba(48, 176, 67, 1)"
    },
    "buttonConfirm": {
      "font-size": "14px",
      "font-weight": "500",
      "color": "#00FFFF",
      "background": "#0000ff"
    },
    "page": {
      "background": "#0000ff"
    }
  },
  "fallback": {
    "tipIcon": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "title": {
      "font-size": "16px",
      "font-weight": "700",
      "color": "#0000ff"
    },
    "desc": {
      "font-size": "14px",
      "font-weight": "500",
      "color": "#666"
    },
    "link": {
      "font-size": "14px",
      "font-weight": "500",
      "color": "#999"
    },
    "button": {
      "font-size": "14px",
      "font-weight": "700",
      "color": "#00FFFF",
      "background": "#00FFFF"
    },
    "processingTipIcon": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "processingTitle": {
      "font-size": "16px",
      "font-weight": "700",
      "color": "#0000ff"
    },
    "processingDesc": {
      "font-size": "14px",
      "font-weight": "500",
      "color": "#666"
    },
    "completeTipIcon": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "completeTitle": {
      "font-size": "16px",
      "font-weight": "700",
      "color": "#0000ff"
    },
    "completeDesc": {
      "font-size": "14px",
      "font-weight": "500",
      "color": "#666"
    },
    "page": {
      "background-image": "",
      "background-color": "#00FFFF"
    }
  },
  "noPermission": {
    "tipIcon": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    },
    "title": {
      "font-size": "16px",
      "font-weight": "700",
      "color": "#0000ff"
    },
    "desc": {
      "font-size": "14px",
      "font-weight": "500",
      "color": "#666"
    },
    "button": {
      "font-size": "16px",
      "font-weight": "700",
      "color": "#FFF",
      "background": "#55C265"
    },
    "page": {
      "background-image": "url('https://img2.baidu.com/it/u=1166244163,2701452518&fm=253')"
    }
  }
}

i18n (optional)

{
  "start": {
    "title": "can",
    "desc": "In order to ",
    "tip1": "Entire ",
    "tip2": "Clear Clear Clear",
    "tip3": "Lighting Lighting Lighting",
    "tipError1": "Incomplete Incomplete Incomplete",
    "tipError2": "Blur Blur Blur",
    "tipError3": "Exposure Exposure Exposure",
    "button": "let's go"
  },
  "scan": {
    "title": "Scan Document,Accept-Language",
    "header": "Front Side of Document！！！！！！！！",
    "backHeader": "Back Side of Document！！！！！！！！",
    "desc": "Please place the document in the center with the edges aligned！！！！！！！！",
    "tipPoorQuality": "Document is too dim/blurred/overexposed！！！！！！",
    "tipNoCard": "No document is detected！！！！！！",
    "tipSmallCard": "Document is too small！！！！！！！",
    "tipEdgeCross": "The document ",
    "tipGoodCard": "Please hold the phone steadily！！！！！！！",
    "NO_CARD": "No document is detected！！！！",
    "CARD_POOR_QUALITY": "Document is too dim/blurred/overexposed!!!!",
    "TOO_SMALL_CARD": "Document is too small!!!!",
    "EDGE_CROSS": "The document with the edges aligned!!!!!",
    "GOOD": "Please hold the phone steadily!!!!!",
    "loading": "Loading...!!!!"
  },
  "manual": {
    "title": "Scan Document!!!!",
    "header": "Front Side of Document",
    "desc": "Please place the document in the center with the edges aligned!!!!!",
    "tip": "Try taking photo manually Align document, then press button！!!!!!",
    "toast": "Timeout, try taking a photo manually!!!!!!"
  },
  "result": {
    "title": "Check readabilty!!!!!",
    "tip": "Please ensure that all data on your documents is visible and readble .!!!!!",
    "buttonRetake": "Retake!!!!!",
    "buttonConfirm": "Confirm!!!!!"
  },
  "fallback": {
    "title": "Camera issue!!!!!",
    "desc": "Please copy the link or scan the QR code to verify on another device.!!!!!",
    "button": "Copy!!!!",
    "processingTitle": "Processing……!!!!!",
    "processingDesc": "Under review, please wait...!!!!!",
    "completeTitle": "Verification completed!!!!!",
    "completeDesc": "Please use the original device to view the verification results.!!!!!",
    "copyTip": "copy success!!!!!"
  },
  "noPermission": {
    "title": "Camera permission denied!!!!!",
    "desc": "Open camera permission, refresh this page, and start collecting image.!!!!!",
    "refresh": "Refresh!!!!!"
  }
}

language (required)

Please append language=xxx .provided language values are：
[zh, en, vi, id, hi, th, zh_CN, en_US, vi_VN, in_ID, hi_IN, th_TH,ar_AE, bn_BD, zh_HK,zh_TW, zh_SG, zh_MO, nl_NL, fil_PH, fr_FR, de_DE, it_IT, ja_JP, ko_KR, ms_MY, pl_PL,pt_PT, ru_RU, es_ES, tr_TR, ur_PK]

These six abbreviated version is equivalent to:

zh <=> zh_CN

en <=> en_US

vi <=> vi_VN

id <=> in_ID

hi <=> hi_IN

th <=> th_TH

Response Description

Parameter	Description
code	H5 Document Verification Status Code
transactionId	The request id, the max length is 64
pricingStrategy	Whether the request will be charged, enum type: FREE, PAY
message	Status Code Explanation
data	always null
extra	Extra response info (Exception Message)

Response Code

Status Code	Message
SUCCESS	`free` OK
PARAMETER_ERROR	`free` This signatureId is not exist.

Response Examples

SUCCESS Response

{
      "code": "SUCCESS",
      "message": "OK",
      "data": null,
      "extra": null,
      "transactionId":"cb75cfe4c926a5ab",
      "pricingStrategy": "FREE"
  }

PARAMETER_ERROR Response

{
    "code": "PARAMETER_ERROR",
    "message": "Parameter error, please check your request whether has illegal parameters",
    "data": "Theme:[unknow format] format is wrong.",
    "extra": null,
    "transactionId": "c2188e2bf6df0a5e",
    "pricingStrategy": "FREE"
}