概述与资源

本文是OnePass API H5的部署文档,用于指导 OnePass API H5的集成。

安装

准备工作:服务端部署完成(服务端部署文档

1.页面引用onepass.js

2.初始化onepass对象

为了避免影响认证的响应时间,建议开发者在页面加载的时候进行初始化。

字段说明: app_id 为客户在极验后台申请的。审核成功后生效

var opInstance = new GOP({            
app_id: '您的app_id', // 在极验后台获取,生成app_id后等待极验审核成功后生效
timeout: 10000, // 超时时长,默认30000
pre_init: true // 是否初始化时获取运营商参数
});

3 网络状态判断方法(非必选)

说明:该方法可提升非纯4G网络环境下用户的使用体验,为可选方法,不使用该方法不影响正常接入使用。

// 调用网关接口前,用户可先调用checkNetInfo 方法获取用户的网络状态; 可选方法
let net = opInstance.checkNetInfo();
if (net !== 'wifi'){
// 调用网关验证
}else{
// 调用原有认证方式不调用网关验证
}

4.调用网关接口

opInstance.gateway({phone: '13333333333'})

5.调用onGatewaySuccess、onGatewayFail 获取校验结果

opInstance.onGatewaySuccess(function(data){
// data 结构: { process_id:'abcd', phone:'13333333333', accesscode: 'abc' }。
// 网关成功,获取校验结果
// 调用 result 接口, 以下是伪代码示例
axios({
method: 'POST',
headers: { 'content-type': 'application/x-www-form-urlencoded' },
url: '您API地址',// 您的服务端校验接口
data: `app_id=${this.app_id}&phone=${data.phone}&process_id=${data.process_id}`
}).then(res=>{
if(res.data && res.data.status === 200 && res.data.data.result === '0'){
// success
} else {
// fail, 可以调用短信等其他验证形式
}
});

}).onGatewayFail(function(){
// step2: 网关失败,可以调用短信等其他验证形式
})

6.请在head中添加代码

<meta content="always" name="referrer">

方法说明

gateway(options) 调用网关

参数options结构: { phone: ‘13333333333’ },传入需要校验的号码。

onGatewaySuccess(fn)网关成功返回

fn 成功返回函数,返回函数参数是Object, 结构:{ process_id: ‘xxxx’, phone:’13333333333’, accesscode: ‘abc’ }。

onGatewayFail(fn) 网关失败返回

fn 失败返回函数,返回函数参数是Object, 结构:{ code: 100 },错误码参考说明

checkNetInfo() 返回当前网络状态

返回cellular、wifi、unknown 三种状态。建议网络状态为cellular和unknown情况时调用网关接口,网络状态为wifi时不调用网关接口。

错误码

错误码 说明 常见原因 解决方法
100 pre_gateway接口网络失败 断网,超时或者跨域 检测网络
101 pre_gateway接口返回数据错误 数据格式不对 查看文档确认格式正确
102 接口网络失败 断网,超时或者跨域 检测网络
103 电信接口失败 是否是数据网络 检测网络,服务查看日志
104 移动接口失败 是否是数据网络,备案refer是否与当前页面refer一致 检测网络,确认备案refer, 服务查看日志
105 record_token接口网络失败 断网,超时或者跨域 检测网络
106 record_token接口失败 是否是数据网络 检测网络,服务查看日志
107 联通接口失败 是否是数据网络 检测网络,服务查看日志
108 切换运营商接口失败 超时接口错误 检测网络,服务查看日志