Appearance
快速接入
本文将介绍如何用最短的时间完成笔迹SDK的集成。
注意
以下文档内容中"{}"包含的变量信息均可从客户端凭证文件中获取，对接过程中需替换对应的值
环境要求
服务端
- 非私有化部署的情况业务方服务器需支持外网访问，了解原因
客户端
- 浏览器支持IE11+、Chrome49+
终端
手机端（H5）
在手机端直接加载远程JSSDK文件即可，SDK内部会根据当前环境自动切换到H5模式
WARNING
注：如果在电脑端浏览器中，先加载了SDK再切换到H5模式可能会导致报错，请在手机模式下刷新即可刷新下浏览器即可
签字板端
在电脑端直接加载远程JSSDK文件即可，SDK内部会根据当前环境自动切换到签字板访问模式
WARNING
注：在电脑端使用签字板模式，需安装笔迹SDK exe程序，否则会报链接错误
SDK 集成
步骤 1：租户开通
签署SDK使用需要用到亲笔签运营平台，需申请客户端凭证等相关信息，可由项目侧或者商务侧发起邮件申请，并给租户分配指定权限
步骤 2：获取Token
通过步骤一得到的客户端凭证等相关信息可以调用能力平台的获取Token的接口来获取调用签署SDK所需的token，详细Token获取接口调用流程见<服务端API-获取Token>接口↓
步骤 3：引入 SDK
经过步骤1、2准备工作已做好，现在可以在项目中使用笔迹SDK了。
html
<script src="{SDK访问地址}/handwriting-sdk/umd/isigning.base.js"></script>
<!-- 如需对接轻量化服务，则引入下列插件 -->
<!-- <script src="{SDK访问地址}/umd/plugins/isigning.light-weight.min.js"></script> -->
<script>
// token获取见基础服务-token获取
var token = 'token'
// 初始化实例
var handwritingSDK = window.axBaseLib.init({
host: "{能力访问地址}/{渠道编码}-{应用编码}/aoscript-gateway",
headers: {
"X-AOS-Voucher": "{客户端凭证}"
}
})
// 签字留样
// handwritingSDK.startSignSample({
// token
// })
// 签字识别
handwritingSDK.startSign({
token,
signDistinguish: true
})
// 监听签署完成事件
handwritingSDK.on('sign-complete', data => {
const { handwritingImage, handwritingImageId, payload } = data
})
</script>步骤 4：签字留样
笔迹SDK提供有签字留样和签字识别功能，但签字识别需要先有留样的过程。
通过调用笔迹SDK实例提供的startSignSample方法可以唤起笔迹SDK的签字留样功能的UI界面了，详细参数见客户端API-实例/方法-startSignSample方法
可通过事件监听是否留样成功，或者触发留样失败是进行其他业务逻辑的处理，对应的事件有sample-complete、sample-error，监听方式见客户端API-实例/事件-sample-complete|sample-error
html
<script>
// 签字留样
handwritingSDK.startSignSample({
token
})
// 监听留样完成事件
handwritingSDK.on('sample-complete', data => {
// 每一个Key对应的value是数组结果，包含多个结果
const { handwritingImages, handwritingImageIds, payloads } = data
})
// 监听留样异常事件
handwritingSDK.on('sample-error', e => {
// e 错误对象
})
</script>步骤 5：签字识别
通过调用笔迹SDK实例提供的startSign方法可以唤起笔迹SDK的签字功能的UI界面了
用户在留样通过的情况下可进行签字识别，AI服务会对用户签署的笔迹进行识别并返回对应的结果。
可通过事件监听是否识别成功，或者触发识别失败是进行其他业务逻辑的处理，对应的事件有sign-verify-error、sign-verify-success，监听方式见客户端-实例/事件-sign-verify-error|sign-verify-success。
html
<script>
// 签字识别
handwritingSDK.startSign({
token,
signDistinguish: true
})
// 监听识别成功事件
handwritingSDK.on('sign-verify-success', data => {
const { handwritingImage, handwritingImageId, payload } = data
})
// 监听识别异常事件
handwritingSDK.on('sign-verify-error', e => {
// e 错误对象
})
// 监听识别异常事件（旧版本，目前保留兼容，但不建议使用）
handwritingSDK.on('sign-validate-error', e => {
// e 错误对象
})
</script>