【记录】滑动拼图验证码

滑动拼图验证码素材管理

在一次项目中,为了使验证码更加贴合自身风格。我找到了一款验证码产品可以通过设置图片素材,来修改验证码的底图,使其更加契合。下面就是我对该产品的一些记录。

我的素材

进入到素材管理,我的素材一般默认为空,可以通过文件上传和从官方素材库中选择。

接下来,点击按钮实现上传图片:

预览我的图片素材:

 

前端验证码的图片显示:

素材库

官方也提供了一些图片给用户选择,用户只需进入素材库,通过选择自己喜欢的图片,点击即可加入我的素材。

选择图片到我的素材:

我的素材加入成功:

前端验证码显示:

相关链接

SDK下载:KgCaptcha (KgCaptcha) · GitHub

在线体验:凯格行为验证码在线体验

开发文档:凯格行为验证码-开发文档

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
滑动拼图验证码在小红书中的应用类似于其他网站。滑动拼图验证码是一种人机验证机制,通过用户拖动滑块将缺口对齐,以证明用户是真实的人类,而不是自动化程序或恶意机器人。 具体到小红书的实现,根据引用中提供的代码,可以看到它使用了一个名为`slideverify`的自定义组件。这个组件接受一些参数,如滑块宽度、滑块高度、滑块位置等,并提供了一些回调函数,如`onSuccess`、`onRefresh`等。 其中,`getImageVerifyCode`函数用于获取验证码图片,并将图片的地址赋值给`imgurl`和`miniimgurl`。`imgurl`存储原始大小的验证码图片地址,`miniimgurl`存储缩略图的验证码图片地址。 `onRefresh`函数用于刷新验证码,它会清空`imgurl`和`miniimgurl`的值,并重新调用`getImageVerifyCode`函数获取新的验证码图片。 `onSuccess`函数在滑动结束后,将滑动的距离作为参数传入,并调用`verifyImageCode`函数进行后台验证。根据后台返回的验证结果,如果通过则显示成功信息,否则显示错误信息,并调用`onRefresh`函数刷新验证码。 总的来说,滑动拼图验证码在小红书中的实现是通过自定义组件和一些回调函数来完成的,它增加了用户与机器的交互,提高了系统的安全性。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [Vue实现滑动拼图验证码功能](https://download.csdn.net/download/weixin_38747917/14818686)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"] - *2* [3分钟使用Halcon识别网易滑块拼图验证码](https://blog.csdn.net/qq_29888333/article/details/84192678)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"] - *3* [Java Vue uni-app 三端实现,滑动拼图验证码](https://blog.csdn.net/qq_32698323/article/details/118876646)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值