eKYC_跳转页面接入 - ID Verification

ID Verification提供Web SDK，帮助您在浏览器或内嵌webview中实现eKYC远程身份验证功能。本文介绍通过PC或移动端H5网页接入ID Verification的流程。

前提条件

支持的最低操作系统版本：Android 5+、iOS 11+。
支持的浏览器：
- iOS：Safari。从iOS 14.3开始支持Chrome、Firefox、Microsoft Edge和WKWebView。
- 安卓：推荐Chrome60+、Firefox58+。对于Android中的其他浏览器，行为可能因设备而异。
所需权限：网络和摄像头，媒体采集需要HTTPS部署。
采用竖屏模式：手机横屏状态可能会引发页面交互的不适配，建议引导用户参考页面提示调整竖屏模式认证。
兼容性：受制于浏览器兼容性碎片化问题，建议您在流程设计上引导用户使用推荐的浏览器完成认证。
若您在手机应用App内集成该方案，可能会因为内嵌浏览器原因无法兼容，您可以参考App内集成H5移动端SDK兼容性配置减少兼容性问题或集成Native SDK。

重要

集成过程中，不要对TransactionUrl做任何操作或修改，否则会报错。
为保障认证安全有效，认证URL仅能使用一次，URL的重复使用也会报错。

启动eKYC

在代码中引入如下JS文件，并调用函数getMetaInfo()获取MetaInfo。

<script type="text/javascript" src="https://hkwebcdn.yuncloudauth.com/cdn/jsvm_all.js" ></script>

说明

在调用ID Verification服务端发起认证请求时，需传入获取的MetaInfo值。

调用您自己的业务服务端接口初始化，获取 TransactionUrl，并在浏览器中加载该链接进行认证。

代码示例

<!DOCTYPE HTML>
<html lang="en">
  <head>
    <title>Title</title>
        <!--   引入该JS，全局注入getMetaInfo方法   -->
        <!--   Introduce this JS, inject the getMetaInfo method globally   -->
    <script type="text/javascript" src="https://hkwebcdn.yuncloudauth.com/cdn/jsvm_all.js" ></script>
  </head>
  <body>
  <div></div>
    <script>
      // 在调用服务端初始化请求时需要传入该MetaInfo值
      var MetaInfo = window.getMetaInfo();

      // 接下来您进行调用服务端初始化请求获取TransactionUrl
      var TransactionUrl = ''; // 此处值应为调用服务端初始化接口返回的TransactionUrl

      // 接下来直接跳转TransactionUrl即可开始服务
      window.location.href = TransactionUrl;
    </script>
  </body>
</html>

客户端自定义配置

ID Verification WebSDK 集成方式，支持通过在 TransactionUrl 中传入参数实现端侧自定义功能。

您可以将参数通过&拼接在 TransactionUrl 后，以使配置生效，示例如下：

TransactionUrl：

https://xxxx.com?clientcfg=xxx&callbackurl=xxx&paramSign=xxx&guideFlow=ekyc

拼接 initTimeout：

https://xxxx.com?clientcfg=xxx&callbackurl=xxx&paramSign=xxx&guideFlow=ekyc&initTimeout=30

支持的功能如下表：

参数名称	类型	是否必选	描述	示例值
initTimeout	String	否	客户端验证初始化超时时间（从页面 loading 到进入人脸/OCR页面的时间），单位为秒。	30
clientLivenessTimeout	String	否	人脸活体检测单次超时时间，单位为秒。	30
clientLivenessRetryCount	String	否	人脸活体检测重试次数，单位次。	5
ocrTimeout	String	否	OCR单次检测超时时间，单位秒。	20
ocrRetryCount	String	否	OCR重试次数，单位次。	10
region	String	否	移动端阿里云接口请求地域上车点，其中 region 值和地区对应关系如下： `{ "HK": "香港", "US": "美东", "US-CA": "美西", "SG": "新加坡", "MY": "马来西亚", "ID": "印尼", "PH": "菲律宾", "DE": "德国", "SA": "沙特" }` 说明传入此参数可指定调用阿里云接口的服务地域。如不指定，默认就近访问。	HK

结果解析

在服务端初始化请求中传入ReturnUrl参数为商户自定义参数，认证结果会在认证完成后拼接在ReturnUrl后作为参数返回给商户。由于传入路由模式的不同，response解析结果会有差异。

路由模式	ReturnUrl示例	认证后打开的ReturnUrl示例
普通网页	https://aliyundoc.com	https://aliyundoc.com/？response=%7B%22resultCode%22%3A%22%22%2C%22resultMessage%22%3A%22%22%2C%22ocrResult%22%3A%7B%22code%22%3A%22%22%2C%22reason%22%3A%22%22%2C%22extInfo%22%3A%7B%22certifyId%22%3A%22%22%7D%7D%2C%22faceResult%22%3A%7B%22code%22%3A%22%22%2C%22subCode%22%3A%22%22%2C%22reason%22%3A%22%22%2C%22extInfo%22%3A%7B%22certifyId%22%3A%22%22%7D%7D%7D
普通网页	https://aliyundoc.com/index.html	https://aliyundoc.com/index.html?response=%7B%22resultCode%22%3A%22%22%2C%22resultMessage%22%3A%22%22%2C%22ocrResult%22%3A%7B%22code%22%3A%22%22%2C%22reason%22%3A%22%22%2C%22extInfo%22%3A%7B%22certifyId%22%3A%22%22%7D%7D%2C%22faceResult%22%3A%7B%22code%22%3A%22%22%2C%22subCode%22%3A%22%22%2C%22reason%22%3A%22%22%2C%22extInfo%22%3A%7B%22certifyId%22%3A%22%22%7D%7D%7D
history路由不带页面锚点（#）	https://aliyundoc.com/xxx/	https://aliyundoc.com/xxx?response=%7B%22resultCode%22%3A%22%22%2C%22resultMessage%22%3A%22%22%2C%22ocrResult%22%3A%7B%22code%22%3A%22%22%2C%22reason%22%3A%22%22%2C%22extInfo%22%3A%7B%22certifyId%22%3A%22%22%7D%7D%2C%22faceResult%22%3A%7B%22code%22%3A%22%22%2C%22subCode%22%3A%22%22%2C%22reason%22%3A%22%22%2C%22extInfo%22%3A%7B%22certifyId%22%3A%22%22%7D%7D%7D
history路由带页面锚点（#）	https://aliyundoc.com/xxx/#xxx	https://aliyundoc.com/xxx?response=%257B%2522resultCode%2522%253A%2522%2522%252C%2522resultMessage%2522%253A%2522%2522%252C%2522ocrResult%2522%253A%257B%2522code%2522%253A%2522%2522%252C%2522reason%2522%253A%2522%2522%252C%2522extInfo%2522%253A%257B%2522certifyId%2522%253A%2522%2522%257D%257D%252C%2522faceResult%2522%253A%257B%2522code%2522%253A%2522%2522%252C%2522subCode%2522%253A%2522%2522%252C%2522reason%2522%253A%2522%2522%252C%2522extInfo%2522%253A%257B%2522certifyId%2522%253A%2522%2522%257D%257D%257D#xxx
hash路由	https://aliyundoc.com/#/aaa/bbb	https://aliyundoc.com/?response=%257B%2522resultCode%2522%253A%2522%2522%252C%2522resultMessage%2522%253A%2522%2522%252C%2522ocrResult%2522%253A%257B%2522code%2522%253A%2522%2522%252C%2522reason%2522%253A%2522%2522%252C%2522extInfo%2522%253A%257B%2522certifyId%2522%253A%2522%2522%257D%257D%252C%2522faceResult%2522%253A%257B%2522code%2522%253A%2522%2522%252C%2522subCode%2522%253A%2522%2522%252C%2522reason%2522%253A%2522%2522%252C%2522extInfo%2522%253A%257B%2522certifyId%2522%253A%2522%2522%257D%257D%257D/#/aaa/bbb

解析response代码示例

普通网页

<!DOCTYPE HTML>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Title</title>
    </head>
    <body>
        <script>
            // 假设window.location.href为：
            // window.location.href = https://aliyundoc.com
            // 或
            // window.location.href = https://aliyundoc.com/index.html

            // 初始化url对象
            var url = new URL(window.location.href);
            // 解析response
            var response = JSON.parse(url.searchParams.get('response'));
            // response = {
            //     resultCode: '',
            //     extInfo: {certifyId: ''}
            // }
        </script>
    </body>
</html>

history路由不带页面锚点（#）

<!DOCTYPE HTML>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Title</title>
    </head>
    <body>
        <script>
            // 假设window.location.href为：
            // window.location.href = https://aliyundoc.com/xxx

            // 初始化url对象 
            var url = new URL(window.location.href);
            // 解析response
            var response = JSON.parse(url.searchParams.get('response'));
            // response = {
            //     resultCode: '',
            //     extInfo: {certifyId: ''}
            // }
        </script>
    </body>
</html>

history路由带页面锚点（#）

<!DOCTYPE HTML>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Title</title>
    </head>
    <body>
        <script>
            // 假设window.location.href为：
            // window.location.href = https://aliyundoc.com/xxx/#xxx

            // 初始化url对象
            var url = new URL(window.location.href);
            // 解析response
            var response = JSON.parse(
                decodeURIComponent(url.searchParams.get('response'))
            );
            // response = {
            //     resultCode: '',
            //     extInfo: {certifyId: ''}
            // }
        </script>
    </body>
</html>

hash路由

<!DOCTYPE HTML>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Title</title>
    </head>
    <body>
        <script>
            // 假设window.location.href为：
            // window.location.href = https://aliyundoc.com/#/aaa/bbb

            // 初始化url对象
            var url = new URL(window.location.href);
            // 解析response
            var response = JSON.parse(
                decodeURIComponent(url.searchParams.get('response'))
            );
            // response = {
            //     resultCode: '',
            //     extInfo: {certifyId: ''}
            // }
        </script>
    </body>
</html>

客户端结果码说明

结果码	是否计费	结果码描述
1000	是	用户完成了刷脸过程，认证建议结果为通过。该结果仅供参考，可通过调用服务端CheckResult接口获取最终认证结果，进行下一步处理。
1001	是	用户完成了刷脸过程，认证建议结果为未通过。该结果仅供参考，可通过调用服务端CheckResult接口获取最终认证结果，进行下一步处理。
1002	否	系统错误。
1003	否	SDK初始化失败，请确认客户端时间是否正确。
1004	否	相机权限错误。请参考以下步骤尝试解决：在认证前请先确保App已获取到相机权限。如已授权仍提示无权限，请尝试清除App缓存后重试。
1005	否	网络错误。
1006	否	用户退出。
1007	否	TransactionId无效.
1009	否	客户端时间戳错误。
1011	否	提交证件类型错误。
1012	否	识别出的证件关键信息缺失或格式校验失败。
1013	否	图片质量不佳。
1014	否	错误次数超出上限。