记录：阿里云滑动验证
2024-05-30 15:34:26
- 导入依赖
<dependency><groupId>com.aliyun</groupId><artifactId>aliyun-java-sdk-core</artifactId><version>3.0.6</version></dependency><dependency><groupId>com.aliyun</groupId><artifactId>aliyun-java-sdk-afs</artifactId><version>1.0.0</version></dependency>
- 前端代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>主页</title>
</head><script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" charset="utf-8" src="//g.alicdn.com/sd/ncpc/nc.js?t=2015052012"></script>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" /><body><a style="display:block;width:200px;height:42px;line-height:42px;font-size:18px;text-align:center;margin:40px auto;font-weight:800;" href="#" class="tbox">登录</a><div class="modal fade" id="myModal"><div class="modal-dialog"><div class="modal-content"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button></div><div class="modal-body" style="width:500px"><h4 class="modal-title" align="center">登录框</h4><br/><form class="form-horizontal" role="form" id="form1"><div class="form-group" width="300px"><label for="name" class="col-sm-offset-2 col-sm-2 control-label">账号</label><div class="col-sm-5" width="300px"><input type="text" class="form-control" id="name" placeholder="请输您的入账号"></div></div><div class="form-group" width="300px"><label for="password" class="col-sm-offset-2 col-sm-2 control-label">密码</label><div class="col-sm-5" ><input type="password" class="form-control" id="password" placeholder="请输入您的密码"></div></div><div class="form-group"><label for="password" class="col-sm-offset-2 col-sm-2 control-label">验证</label><div id="your-dom-id" class=" col-sm-5 nc-container"></div></div><div class="form-group"><div class="col-sm-offset-4 col-sm-5"><button id="submitBtn" type="button" class="btn btn-default btn-block btn-primary">登录</button></div></div></form></div><div class="modal-footer"></div></div><!-- /.modal-content --></div><!-- /.modal-dialog -->
</div><!-- /.modal --><script type="text/javascript">
$(function(){$(".tbox").click(function(){$('#myModal').modal('show') //显示模态框})});
</script><script type="text/javascript">var result = false;var nc_token = ["FFFF0N00000000008A76", (new Date()).getTime(), Math.random()].join(':');var NC_Opt ={renderTo: "#your-dom-id",appkey: "FFFF0N00000000008A76",scene: "nc_login",token: nc_token,customWidth: 300,trans: {"key1": "code0"},elementID: ["usernameID"],is_Opt: 0,language: "cn",isEnabled: true,timeout: 3000,times: 5,apimap: {// 'analyze': '//a.com/nocaptcha/analyze.jsonp',// 'get_captcha': '//b.com/get_captcha/ver3',// 'get_captcha': '//pin3.aliyun.com/get_captcha/ver3'// 'get_img': '//c.com/get_img',// 'checkcode': '//d.com/captcha/checkcode.jsonp',// 'umid_Url': '//e.com/security/umscript/3.2.1/um.js',// 'uab_Url': '//aeu.alicdn.com/js/uac/909.js',// 'umid_serUrl': 'https://g.com/service/um.json'},callback: function (data) {window.console && console.log(nc_token)window.console && console.log(data.csessionid)window.console && console.log(data.sig)$.ajax({url: "/user/getLogin?token=" + nc_token,type: "post",dataType: "text",data: data,success:function (json) {result = true;if (json == "ok") {result = true;}},error:function(result) {alert("error");}});}}$('#myModal').on('hide.bs.modal', function () {// 执行一些动作...//$("#form1")[0].reset();document.getElementById("form1").reset();// $("#your-dom-id").__nc.reset();var ncs = new noCaptcha(NC_Opt);})var nc = new noCaptcha(NC_Opt)nc.upLang('cn', {_startTEXT: "请按住滑块，拖动到最右边",_yesTEXT: "验证通过",_error300: "哎呀，出错了，点击<a href=\"javascript:__nc.reset()\">刷新</a>再来一次",_errorNetwork: "网络不给力，请<a href=\"javascript:__nc.reset()\">点击刷新</a>",})$("#submitBtn").click(function(){var username=$("#name").val();var password =$("#password").val();if(result){if (false){alert("账号密码不可为空")return ;} else {$.ajax({url: "/user/index?username=" + username+"&password="+password,type: "post",dataType: "text",success:function (json) {alert(json)$("#form1")[0].reset();},error:function(result) {alert("error");}});}}else {alert("滑动验证验证")}})
</script>
</body>
</html>
- 后端代码
@RequestMapping("/getLogin")public String getLogin(HttpServletRequest req) throws ClientException {AuthenticateSigRequest request = new AuthenticateSigRequest();DefaultProfile profile = DefaultProfile.getProfile("cn-hangzhou", "AKID", "AKS");IAcsClient client = new DefaultAcsClient(profile);DefaultProfile.addEndpoint("cn-hangzhou", "cn-hangzhou", "afs", "afs.aliyuncs.com");String sessionId=req.getParameter("csessionid");String token=req.getParameter("token");request.setSessionId(sessionId);// 必填参数，从前端获取，不可更改，android和ios只传这个参数即可request.setSig(req.getParameter("sig"));// 必填参数，从前端获取，不可更改request.setToken(token);// 必填参数，从前端获取，不可更改request.setScene("nc_login");// 必填参数，从前端获取，不可更改request.setAppKey("FFFF0N00000000008A76");// 必填参数，后端填写request.setRemoteIp("192.168.1.1");// 必填参数，后端填写System.out.println(sessionId);System.out.println(token);String result="ok";try {AuthenticateSigResponse response = client.getAcsResponse(request);if(response.getCode() == 100) {System.out.println("验签通过");result="ok";} else {System.out.println("验签失败");result="failed";}// TODO} catch (Exception e) {e.printStackTrace();}return result;}
记录：阿里云滑动验证相关推荐
- vue项目中引入阿里云滑动验证
注册阿里云账号 参照滑动验证demo 滑动验证在vue中使用步骤 1.在vue-cli安装的项目中,index.html页面引入js <html><head><meta ...
- 阿里python认证_集成阿里云滑动验证(python)
阿里云的服务 数据风控下面有项滑动验证, 适合有人机验证场景的应用接入. 所谓滑动验证, 是在需要进行人机识别时, 前端出现验证滑块, 通过拖动滑块到末尾, 实现验证. 如果阿里云认为此次验证风险稍高 ...
- 阿里云人机验证(无痕)完整流程以及注意事项
阿里云人机验证(无痕)完整流程及注意事项 1.文档链接:阿里云人机验证文档 2.无痕验证流程图: 3.开发注意事项 前端注意事项: 1.前端代码在购买服务后可以直接获取,或者参考官方文档内代码 2.前 ...
- vue调用阿里云无痕验证
vue调用阿里云无痕验证 在调用阿里云无痕验证时有个先决条件需要全局变量先定义才能去加载js set_ALY_config () {var _this = thisreturn new Promise ...
- 记录阿里云Elastic Search实例使用经验
记录阿里云Elastic Search实例使用经验 购买服务器 购买完成开始设置并使用 1.打开实例管理页面 2.设置下kibana语言方便操作 3.登录kibana可视化管理平台 进入索引管理查看索 ...
- 记录阿里云虚拟主机FTP连接不上的解决办法
记录阿里云虚拟主机FTP连接不上的解决办法 FTP工具:filezilla 默认设置: 这样是连接不上的 解决办法: 这样就好了 成功截图:
- 记录阿里云 centOS FRP 树莓派 内网穿透
记录阿里云 centOS FRP 树莓派 内网穿透 我们知道windows上有一些穿透工具,花生壳向日葵这样的最近几年比较热门,几乎成了新的装机必备.我有一点嵌入式功底,在人工智能的背景下,除了嵌入式 ...
- 记录阿里云ECS实例重启之后无法登录解决方法（亲身实践）
提示:记录阿里云ECS实例重启之后无法登录解决方法 文章目录 前言 一.重启实例以后重新修改密码后无法登录? 二.咨询阿里云客服 1.查看远程禁止登录状态 2.进行修改 前言 一.重启实例以后重新修改 ...
- 智能验证码 阿里云人机验证的使用（PHP）
尝试了一下午,弄成功了下阿里云的人机验证功能,感觉文档说得有点跳脱,做个记录. 现在的验证码越来越简单人性化,阿里云的人机验证结合了鼠标轨迹记录获取,点击触点分析等,使得原来需要劳心费神输文字点汉字的 ...
最新文章
- Win8Metro(C#)数字图像处理--2.3图像反色
- linux中将文本中的单词换掉的指令_从零开始学Linux运维|19.文本处理相关命令(2)...
- 等待 dg597 服务的连接超时
- 全球IPv6网络6月6日正式启动
- 管线命令 cut grep
- linux 命令都是bash,Linux 命令分类_bash基础特性
- 本地java【动态监听】zk集群节点变化
- LDAP命令介绍---verify-index--验证索引
- 怎么看mysql的最大连接数_怎么查看和修改 MySQL 的最大连接数？
- Python学习笔记：使用Python操作数据库
- 蛋壳租客迎来好消息！微众银行开放贷款结清入口
- python 斐波那契数列 yield_Python中的yield到底是个什么鬼？
- HTML Text Editor
- NET 技术FAQ(六)-----属性
- 华硕asus k013 me176cx rom固件刷机包
- RuntimeError: Cannot re-initialize CUDA in forked subprocess解决方法之一
- 每日一滴——python之time.sleep()
- 这3款音频文件转文字工具，操作真的很简单
- mysql decimal 类型_MySQL中decimal类型用法的简单介绍
- Python爬虫入门-小试ImagesPipeline爬取pixabay和煎蛋之为什么是‘404’