# 版本
V2.0.0
# 引入JS-SDK
RtcVideo实例化
接口说明:实例化rtcVideo,在此接口设置video的宽、高、回调接口等
参数 | 说明 | 类型 | 是否必填 | 默认值 |
---|---|---|---|---|
videoWrapper | 插入video的节点 | string | 必填 |
|
width | video的宽,默认是320px,需填写单位px, rem, em;此宽高为video宽高,当video宽高与视频宽高不符合时,视频按照video宽高的最长边等比缩放 | string | 非必填 | 320px |
height | video的高,默认是320px,需填写单位px, rem, em;此宽高为video宽高,当video宽高与视频宽高不符合时,视频按照video宽高的最长边等比缩放 | string | 非必填 | 320px |
token | 用户服务器端请求getToken返回的token, getToken禁止使用前端调用,前端调用存在api_key泄漏风险 | string | 必填 |
|
videoPermsTimeout | 获取摄像头权限超时时间,单位:毫秒 | number | 非必填 | 6000 |
webSocketTimeout | WebSocket超时时间,单位:毫秒 | number | 非必填 | 6000 |
WebRTCTimeout | WebRTC链接超时时间,单位:毫秒 | number | 非必填 | 6000 |
colorListener | 颜色变化监听 |
(color:string, status:string, index:number, sum:number)=>{} |
必填 |
|
tipListener | 提示语变化监听 | (tipCode:string, tipTxt:string)=>{} | 必填 |
|
resultCallback | 结果回调,包含成功,失败 |
(isSuccess:boolean,resultCode:string, resultMessage:string)=>{} |
必填 |
|
statusListener | 状态变更监听,用于埋点分析。不要在此进行逻辑判断。可不传 | (statusCode:string)=>{} | 非必填 | undefined |
autoplayFailCallback | 视频无法自动播放时回调,需要在用户点击事件内触发play。可不传,为空时会默认覆盖一个播放按钮 | (play:function)=>{} | 非必填 | undefined |
示例代码
let rtcVideo = new RtcVideo({
videoWrapper: 'videoWrapper', //页面中镶嵌video元素的位置,需要使用id属性
width: '320px', //video的宽,默认是320px,需填写单位px, rem, em;此宽高为video宽高,当video宽高与视频宽高不符合时,视频按照video宽高的最长边等比缩放
height: '320px', //video的高,默认是320px,需填写单位px, rem, em;
token: 'xxxxxxx', //用户服务器端请求getToken返回的token, getToken禁止使用前端调用,前端调用存在api_key泄漏风险
videoPermsTimeout: 6000, //获取摄像头权限超时时间,毫秒
webSocketTimeout: 6000, //WebSocket超时时间,毫秒
WebRTCTimeout: 6000, //WebRTC链接超时时间,毫秒
colorListener: (color, status, index, sum)=>{}, //传递color给用户,用户监听color变化,修改页面背景颜色
tipListener: (tipCode, tipTxt)=>{}, //提示语信息
statusListener: (statusCode)=>{}, //状态的改变,可对各个状态做相应处理(如处理加载中交互)、日志埋点等需求
resultCallback: (isSuccess, resultCode, resultMessage)=>{}, //结果回调
autoplayFailCallback: (play)=>{},//视频无法自动播放时回调,需要在用户点击事件内触发play。可不传,为空时会默认覆盖一个播放按钮
})
rtcVideo.start()
以上JS方法说明:
1.colorListener(color, status, index, sum)
接口说明:传递color给用户,用户监听color变化,修改页面背景颜色
参数说明:
参数 | 说明 |
---|---|
color | 需要打光的16进制颜色,例:”#00FFFF“ |
status |
RESET/PROCESS/FINISH
|
index | 当前打光进度,例:1,需配合sum计算进度 |
sum | 总打光数量,依赖于Raw-GetToken接口设置的color_number |
2.tipListener(tipCode, tipTxt)
接口说明:提示语信息
参数说明:
tipCode | tipTxt |
---|---|
NoFaceFound | 未发现人脸 |
InvalidFaceYaw | 请正对摄像头 |
InvalidFacePitch | 请正对摄像头 |
InvalidFaceEyeOcclusion | 请露出眼睛 |
InvalidFaceMouth | 请露出嘴巴 |
TooFarAwayFromCamera | 请靠近摄像头 |
TooCloseFromCamera | 请远离摄像头 |
InvalidFaceOutOfImage | 请正视摄像头 |
InvalidFaceBrightness | 请调节光线 |
FaceOK | 很好,请保持不动 |
3.statusListener(statusCode)
接口说明:状态的改变,可以用于日志埋点等需求
参数说明:
statusCode | 说明 |
---|---|
INIT_LOADING | 初始化配置loading,可对各个状态做处理 |
INIT_LOADING_SUCCESS | 初始化配置loading状态结束,建立WebRTC 连接成功,这台设备支持炫彩 |
LOOK_MIRROR | 照镜子开始,由于用户刷新重试等原因,此状态可能出现多次 |
SHOW_COLOR | 打光开始,由于用户刷新重试等原因,此状态可能出现多次 |
RESULT_LOADING | 打光结束等待返回结果loading,由于用户刷新重试等原因,此状态可能出现多次 |
RESULT_LOADING_SUCCESS | 打光结束等待返回结果loading结束 |
SUCCESS | 完整流程成功 |
FAIL | 完整流程失败 |
炫彩活体主流程根据 statusListener进行变更。INIT_LOADING、INIT_LOADING_SUCCESS 为初始化配置阶段,之后进入主要需要处理的流程。
4.resultCallback(isSuccess,resultCode,resultMessage)
接口说明:在此接口处理整个活体流程的结果
参数说明:
resultCode |
resultMessage
|
说明 | 备注 |
---|---|---|---|
1000 | SUCCESS | 炫彩流程正常结束,不代表活体检测通过, 需通过调用raw_get_result接口获取活体检测的结果 | 炫彩流程成功 |
2000 | DISCONNECTED | webrtc连接断开,需要用户特殊处理,弹窗提升网络断开,刷新页面 | 炫彩流程失败 |
3000 | TIMEOUT | 检测流程超时,30秒,从建立连接完成开始计算 | 炫彩流程失败 |
4000 | SUPPORT_ERROR | 当前设备不支持炫彩活体:浏览器不支持webrtc,无法初始化 | |
4000 | PERMISSIONS_ERROR | 当前设备不支持炫彩活体:浏览器无权限访问摄像头或用户拒绝,或6s内仍无法获取权限 | |
4000 | NETWORK_ERROR | 当前设备不支持炫彩活体:建立webrtc连接后,6s内仍无法传输流 | |
5000 | TOKEN_EXPIRED | token超时/无效 | 炫彩流程失败 |
5000 | TOKEN_TIMES_EXCEEDED | token使用次数过多 | 炫彩流程失败 |
5000 | ILLEGAL_PARAMETER:{params} | 初始化传入参数不合法,{}内为具体不合法参数 | 炫彩流程失败 |
raw_get_result禁止使用前端调用,前端调用存在api_key泄漏风险
5.autoplayFailCallback(play)
接口说明:视频无法自动播放时回调,需要在用户点击事件内触发play。可不传,为空时会默认覆盖一个播放按钮
参数说明:
参数 | 说明 |
---|---|
play | 方法,需要放在用户事件内调用,如点击事件内调用play()。可不传,为空时会默认覆盖一个播放按钮 |
以上配置完成后,开始炫彩活体验证。
# 开始验证
1.start()
参数说明:开始验证,此时才会唤起摄像头。并在id为videoWrapper的标签内插入video标签。
示例代码:
rtcVideo.start()
2.version()
参数说明:获取当前版本号
示例代码:
rtcVideo.version()
# 终止验证
1.destroy()
参数说明:主动销毁过程,会关闭webrtc,终止流程。在成功/失败回调中无需调用。videoWrapper标签内的video不会删除,需要手动删除,也可直接删除videoWrapper标签。在打光中销毁,会停留在当前打光颜色,需要自行处理。
示例代码:
rtcVideo.destroy()
# 历史版本文档
https://bj-faceid-prod-asset.oss-cn-beijing.aliyuncs.com/raw_js_sdk/old-doc/jssdk_1.0.pdf