实现

重要提示！

从版本 3.0.0 起，与 Web SDK 的集成需要在流程开始前向我们的人脸识别 API 发送请求以获取认证密钥，并且我们更改了结果的返回方式。

库的实现通过 QITechWebFaceRecon 组件实例和 .WebFaceRecon() 构造函数调用来完成。其初始化发生在 .initialize() 方法中，在该方法中我们创建一些元素并加载必要的组件。

要开始与用户的交互和活体证明收集，只需调用 .open() 方法并等待其返回。

获取 Client Session Key

在配置 SDK 之前，您必须通过服务器到服务器的请求向我们的人脸识别 API 生成一个临时的 clientSessionKey。

端点

环境	URL
沙盒	https://api.sandbox.caas.qitech.app/face_recognition/client_session
生产	https://api.caas.qitech.app/face_recognition/client_session

请求

Method: POST

Headers:

{
  "Authorization": "YOUR_FACE_RECON_API_KEY"
}

Body（可选，但推荐）：

{
  "user_id": "unique_user_identifier"
}

重要： user_id 字段强烈建议用于安全和反欺诈措施。请使用您应用程序中用户的唯一标识符。

响应

成功响应将包含需要传递给 SDK 配置的 client_session_key。

{
  "client_session_key": "8f14e45f-ceea-467a-9a2e-4b1d0c6ba1f7",
  "expiration_date": "2026-09-22T18:40:57Z"
}

expiration_date 表示密钥的有效期。每个 client_session_key 仅服务于一次采集会话：每个流程请生成新的密钥，切勿在不同用户之间重复使用。

示例

<script>
  const hostComponent = document.getElementById('webfacerecon');
  const webFaceRecon = new QITechWebFaceRecon.WebFaceRecon(hostComponent)
    .setThemeConfiguration({
      buttonColor: "#2848A8",
      fontColor: "#FFFFFF",
      backgroundColor: "#FFFFFF"
    })
    .setSandboxEnvironment()
    .setLogLevel('debug')
    .setSessionId('UNIQUE_SESSION_ID')
    .build();

  webFaceRecon.initialize()
    .then(() => fetchClientSessionKey())
    .then(clientSessionKey => webFaceRecon.open(clientSessionKey))
    .then(response => console.log(`Status: ${response.status}, Key: ${response.data}`))
    .catch(error => {
      console.error(error);
      alert(error.reason || error);
    });
</script>

旧版本

<script>
 var hostComponent = document.getElementById('webfacerecon')
      var webFaceRecon = new QITechWebFaceRecon.WebFaceRecon(
        hostComponent,
        'YOUR_TOKEN_SENT_BY_QITECH'
      )
        .setThemeConfiguration(
        {
          "buttonColor": "#2848A8",
          "fontColor": "#FFFFFF",
          "backgroundColor": "#FFFFFF"
        }
        )
        .setSandboxEnvironment()
        .setLogLevel('debug')
        .setSessionId('UNIQUE_SESSION_ID')
        .build()
      webFaceRecon.initialize().then(res => {
        var promise = webFaceRecon.open()
        promise
          .then(image_key => {
            console.log(image_key)
          })
          .catch(err => {
            console.log(err)
          })
      })
</script>