跳到主要内容

initialize() 函数

要启动 Web OCR SDK，在实例化 WebOCR 类后，只需调用 initialize() 函数，并传入允许的文档列表作为参数。

以下是每种可能文档类型的详细说明：

名称类型描述
cnhString采集实体 CNH（折叠），分两步，正面和背面
rgString采集实体 RG（折叠），分两步，正面和背面
cin_digitalString提交由官方应用生成的数字国家身份证（CIN）（pdf）
rg_digitalString提交由官方应用生成的数字 RG（pdf）
national_registry_of_foreignersString采集实体 RNE，分两步，正面和背面
national_migration_registryString采集实体 CRNM，分两步，正面和背面
othersString用于允许提交上述以外的其他文档
注意

在允许的模板中添加 others 类型会使所有提交的文档都被接受。因此，即使是非官方文档也会被接受。

实现示例​

Web OCR SDK 的实现示例如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" type="image/x-icon" href="/public/favicon.ico">
    <link rel="stylesheet" href="./demo-styles.css">
    <title>Web OCR</title>
    <script src="https://ocr.caas.qitech.app/3-2-0/ocr.js"></script>
</head>
<body>
    <div id="webOCR"></div>
    <div class="demo-app-container">
        <p>
        Agora vamos coletar imagens do seu documento.
        </p>
        <div class="personalDocumentTypesContainer">
            <div class="personalDocumentTypes" onclick="initOCR(['rg', 'cnh', 'rg_digital', 'cnh_digital']);">
                <p>Iniciar coleta do documento</p>
                <img src="./images/personal-document-icon.png" style="width: 100px;">
            </div>
        </div>
    </div>
</body>

<script>
    var htmlComponent = document.getElementById('webOCR')
    var webOCR = new QiTechWebOCR.WebOCR(
        htmlComponent,
        "<WEB_TOKEN>",
        "<SESSION_ID>"
    )
    .setThemeConfiguration(
        {
            "companyLogo": "https://my_company/logo.png",
            "backgroundColor": "#FF9900",
            "fontColor": "#FFFFFF",
            "buttonColor": "#146EB4",
            "fontFamily": "Verdana"
        }
    )
    .setShowInstructionScreen(true)
    .setShowSuccessScreen(true)
    .setShowAllowedTemplatesScreen(true)
    .setSandboxEnvironment()
    .build()

    function initOCR(document_type) {
        webOCR.initialize(document_type)
        .then((ocr_key) => {
            console.log(ocr_key)
        })
        .catch((error) => {
            console.log(error)
        })
    }
</script>
</html>

在上述示例中，首先实例化 WebOCR 类，传入所有必填和可选参数以自定义 SDK 外观。SDK 实例化后，创建了一个名为 initOCR() 的辅助函数，它使用 initialize() 函数初始化 SDK，并在文档采集流程结束时记录返回的 ocr_key 或错误（如发生）。此函数被分配为按钮的 onClick 回调，允许通过单击按钮为所需文档初始化 SDK。