0.0.6 • Published 3 years ago
humi-ncpc v0.0.6
humi-ncpc
封装react滑动验证组建
install
npm install humi-ncpc默认安装最新版本
use
# 组件中引入
import HumiNcpc from 'humi-ncpc';
# 样式引入
import 'humi-ncpc/lib/main.min.css';
<HumiNcpc appkey={"FFFF0N000000000072D4"} />arguments
| 参数 | 含义 | 是否必填 |
|---|---|---|
| renderTo | 声明滑动验证需要渲染的目标元素ID | 是 |
| appkey | 应用标示。它和scene字段一起决定了滑动验证的业务场景与后端对应使用的策略模型。您可以从console的配置里找到它正确的值，请勿乱写 | 是 |
| scene | 场景标示。它和appkey字段一起决定了滑动验证的业务场景与后端对应使用的策略模型。您可以从console的配置里找到它正确的值，请勿乱写 | 是 |
| token | 滑动验证码的主键，请务必不需要写死固定值。请确保每个用户每次打开页面时，token都是不同的。建议格式为”您的appkey”+”时间戳”+”随机数” | 是 |
| customWidth | 滑动条的长度，建议预留300像素以上 | 否 |
| trans | 业务键字段。您可以不写此字段，也可以按照下文中”问题排查与错误码”部分文档配置此字段，便于线上问题排查 | 否 |
| elementID | 通过Dom的ID属性自动填写trans业务键，您可以不写此字段，也可以按照下文中”问题排查与错误码”部分文档配置此字段，便于线上问题排查 | 否 |
| is_Opt | 是否自己配置底层采集组件。如无特殊场景请保持写0或不写此项。默认为0 | 否 |
| isEnabled | 是否启用，无特殊场景请默认写true。默认为true | 否 |
| timeout | 内部网络请求的超时时间，一般不需要改，默认值为3000ms | 否 |
| times | 允许服务器超时重复次数，默认5次 | 否 |
| apimap | 用于自己指定滑动验证各项请求的接口地址。如无特殊情况，请不要配置这里的apimap | 否 |
| callback | 前端滑动验证通过时会触发此回调，您可以在这个回调中将token、sessionid、sig记录下来，随业务请求带到您的server端调用验签 | 是 |
function
| 方法名 | 参数 | 作用 |
|---|---|---|
| reload | 无 | 任何时候调用此方法，可以将滑动验证重置为初始状态(等待滑动) |
| hide | 无 | 任何时候调用此方法，可以隐藏滑动验证组件 |
| show | 无 | 在调用hide方法后，任何时候调用此方法，可以展示滑动验证组件 |
| getToken | 无 | 任何时候调用此方法，可以获取当前滑动验证实例的token |
| setTrans | Object | 可以设置滑动验证的业务键，方便问题排查定位。详见”问题排查与错误码说明”部分 |
| upLang | String,Object | 用于配置NC自定义文案，详见”自定义文案与多语言”部分 |
| destroy | 无 | 销毁当前滑动验证实例 |