行为式验证码

全新人机验证方式,高效拦截机器行为,业务安全第一道防线。搭载风险感知引擎,智能切换验证难度,安全性高,极致用户体验。读屏软件深度适配,视障群体也可轻松使用,符合工信部无障碍适配要求

平台支持(兼容性)

AndroidiOS
适用版本区间:4.4 - 13.0适用版本区间:9 - 14

环境准备

CocoaPods安装教程

资源引入/集成

在 pubspec.yaml 中添加

dependencies:
    captcha_plugin_flutter: ^1.0.1

调用示例

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final CaptchaPluginFlutter captchaPlugin = new CaptchaPluginFlutter();

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Plugin example app'),
        ),
        body: Center(
            child: new Column(
          children: [
            TextButton(
                onPressed: () => {init()},
                child: Text("初始化")),
            TextButton(
                onPressed: () => {showCaptcha()},
                child: Text("显示验证码")),
          ],
        )),
      ),
    );
  }
  
   /**
   * 初始化验证码
   */
  void init() {
    CaptchaPluginConfig styleConfig = CaptchaPluginConfig(
        radius: 10,
        capBarTextColor:"#25D4D0",
        capBarTextSize: 18,
        capBarTextWeight:"bold",
        borderColor:"#25D4D0",
        borderRadius:10,
        backgroundMoving:"#DC143C",
        executeBorderRadius:10,
        executeBackground:"#DC143C",
        capBarTextAlign:"center",
        capPaddingTop:10,
        capPaddingRight:10,
        capPaddingBottom:10,
        capPaddingLeft:10,
        paddingTop:15,
        paddingBottom:15
    );

    captchaPlugin.init({
      "captcha_id": "易盾业务id",
      "is_debug": true,
      "is_no_sense_mode": false,
      "dimAmount": 0.8,
      "is_touch_outside_disappear": true,
      "timeout": 8000,
      "is_hide_close_button": false,
      "use_default_fallback": true,
      "failed_max_retry_count": 4,
      "language_type": "ja",
      "is_close_button_bottom":true,
      "styleConfig":styleConfig.toJson(),
    });
  }
  
   /**
   * 弹出验证码
   */
  void showCaptcha() {
    captchaPlugin.showCaptcha(
        onLoaded: () {
          print("================onLoaded==============");
        },
        onSuccess: (dynamic data) {
          print(data);
        },
        onClose: (dynamic data) {
           print(data);
        },
        onError: (dynamic data) {
          print(data);
    });
  }
}

SDK 方法说明

1. 初始化

代码说明:

CaptchaPluginFlutter captchaPlugin = new CaptchaPluginFlutter();
captchaIns.init(options)
options 支持的可配置项说明
keyvalue 类型是否必填默认值描述
captcha_idString易盾获取到的业务 id
is_debugboolfalse是否启动 debug 模式
is_no_sense_modeboolfalse是否为智能无感知
dimAmountdouble0.5验证码框遮罩层透明度
is_touch_outside_disappearbooltrue点击弹窗外部是否可以关闭验证码
timeoutint10000超时时间/ms
is_hide_close_buttonboolfalse是否隐藏关闭按钮
use_default_fallbackbooltrue是否采用默认降级
failed_max_retry_countint3失败后尝试最大次数
language_typeStringzh-CN多语言语言类型
loading_textString智能检测中自定义加载文案
control_bar_start_urlString自定义滑块开始背景
control_bar_moving_urlString自定义滑块滑动背景
control_bar_error_urlString自定义滑块错误背景
themeStringlight主题/dark、light两种
is_show_loadingbooltrue是否显示loading
is_close_button_bottomboolfalse关闭按钮是否在下方
styleConfigclassfalse验证码UI自定义配置
language_type 多语言对应表
多语言值说明
zh-TW中文繁体
en英文
ja日语
ko韩文
th泰语
vi越南语
fr法语
ru俄语
ar阿拉伯语
de德语
it意大利语
he希伯来语
hi印地语
id印尼语
my缅甸语
lo老挝语
ms马来语
pl波兰语
pt葡萄牙语
es西班牙语
tr土耳其语
nl荷兰语
es-la拉美西语
pt-br巴西葡语
sv瑞典语
no挪威语
da丹麦语
cs捷克语
hu匈牙利语
sk斯洛伐克语
ro罗马尼亚语
el希腊语
sr塞尔维亚语
bs波斯尼亚语
mk马其顿语
bg保加利亚语
fi芬兰语
et爱沙尼亚语
lv拉脱维亚语
lt立陶宛语
sl斯洛文尼亚语
hr克罗地亚语
uk乌克兰语
vi越南语
fa波斯语
ca加泰罗尼亚语
gl加利西亚语
eu巴斯克语
ka格鲁吉亚语
az阿塞拜疆语
uz乌兹别克语
km高棉语
si僧伽罗语
ur乌尔都语
bo藏语
be白俄罗斯语
kk哈萨克语(西里尔文)
bn孟加拉语
fil菲律宾语
jv爪哇语
ne尼泊尔语
sw斯瓦西里语
mi毛利语
am阿姆哈拉语
te泰卢固语
mr马拉地语
ta泰米尔语
gu古吉拉特语
kn卡纳达语
ml马来亚拉姆语
or欧里亚语
pa旁遮普语
as阿萨姆语
mai迈蒂利语
mn蒙古语(西里尔文)
ug维吾尔语
styleConfig 验证码UI自定义配置对应表
UI配置项类型描述
radiusint验证码圆角
capBarTextAlignString弹框头部标题文字对齐方式,可选值为 left center right
capBarBorderColorString弹框头部下边框颜色,想要去掉的话可取 transparent 或者与背景色同色 #fff
capBarTextColorString弹框头部标题文字颜色
capBarTextSizeint弹框头部标题文字字体大小
capBarTextWeightString弹框头部标题文字字体体重,可设置粗细,参考:capBarTextWeight: normal、bold、lighter、bolder、100、200、300、400、500、600、700、800、900更多详情参考:https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight
capBarTitleHeightint弹框头部标题所在容器高度
capBodyPaddingint验证码弹框 body 部分的内边距,相当于总体设置 capPaddingTop,capPaddingRight,capPaddingBottom,capPaddingLeft
capPaddingTopint验证码弹框 body 部分的【上】内边距,覆盖 capPadding 对于上内边距的设置,单位px
capPaddingRightint验证码弹框 body 部分的【右】内边距,覆盖 capPadding 对于右内边距的设置,单位px
capPaddingBottomint验证码弹框 body 部分的【底】内边距,覆盖 capPadding 对于底内边距的设置,单位px
capPaddingLeftint验证码弹框 body 部分的【左】内边距,覆盖 capPadding 对于左内边距的设置,单位px
paddingTopint弹框【上】内边距,实践时候可与 capPaddingTop 配合,单位px
paddingBottomint弹框【下】内边距,实践时候可与 capPaddingBottom 配合,单位px
capBorderRadiusint验证码弹框body圆角
borderColorString滑块的边框颜色
backgroundString滑块的背景颜色
borderColorMovingString滑块的滑动时边框颜色,滑动类型验证码下有效
backgroundMovingString滑块的滑动时背景颜色,滑动类型验证码下有效
borderColorSuccessString滑块的成功时边框颜色,此颜色同步了文字成功时文字颜色、滑块背景颜色
backgroundSuccessString滑块的成功时背景颜色
backgroundErrorString滑块的失败时背景颜色
borderColorErrorString失败时边框颜色
slideBackgroundString滑块的滑块背景颜色
textSizeint滑块的内容文本大小
textColorString滑块内容文本颜色(滑块滑动前的颜色,失败、成功前的颜色)
heightint滑块的高度
borderRadiusint滑滑块的圆角
gapString滑块与验证码视图之间的距离,单位px
executeBorderRadiusint组件圆角大小
executeBackgroundString组件背景色
executeTopString组件外层容器距离组件顶部距离,单位px
executeRightString组件外层容器距离组件右侧距离,单位px

2. 显示验证码

代码说明:

captchaPlugin.showCaptcha(
    onLoaded: () {
       
    },
    onSuccess: (dynamic data) {
       
    },
    onClose: (dynamic data) {
        
    },
    onError: (dynamic data) {
        
    }
);

回调值说明:

类型描述
onSuccess回调message:结果描述信息
validate:二次校验数据,如果验证结果为false,validate返回空
result:验证结果 BOOL:YES/NO
onClose回调message:manual手动关闭
message:auto 自动关闭
onError回调message:错误信息
code:错误码

3. 销毁验证码弹窗

代码说明:

captchaIns.destroy()

Libraries

captcha_plugin_config
captcha_plugin_flutter