使用重写url机制实现验证码换一张功能


Posted in Javascript onAugust 01, 2017

 重写URL机制:为了保证一个url的地址唯一,可每次向服务器传递的参数不一样即可。

由数据请求的抱头信息可分析到:抱头信息包括http协议,IP地址,端口号,工程名,请求参数列表,要想访问的资源不发生变化,只能变化参数连表。

此处在实现验证码的换一张的功能时,就是利用了改变参数列表的值进行刷新。

详细代码实现:

<%@page import="javax.imageio.ImageIO"%> 
<%@page import="java.awt.Font"%> 
<%@page import="java.awt.Color"%> 
<%@page import="java.awt.Graphics"%> 
<%@page import="java.awt.image.BufferedImage"%> 
<%@ page contentType="image/jpeg" language="java" import="java.util.*" pageEncoding="UTF-8"%> 
<% 
int w=100; 
int h=30; 
BufferedImage bi=new BufferedImage(w,h,BufferedImage.TYPE_INT_RGB); 
Graphics g=bi.getGraphics(); 
Color c=g.getColor(); 
Font f=g.getFont();  
Random r=new Random(); 
Color bg=new Color(150+r.nextInt(100),150+r.nextInt(100),150+r.nextInt(100)); 
g.setColor(bg); 
g.fillRect(0, 0, w, h); 
String code=""; 
for(int i=1;i<=4;i++){ 
int num=r.nextInt(10); 
code=code+num; 
Color num_c=new Color(r.nextInt(150),r.nextInt(150),r.nextInt(150)); 
g.setColor(num_c); 
g.drawString(String.valueOf(num), 20*i, h/2); 
} 
request.getSession().setAttribute("code", code); 
//清空缓存 
response.setHeader("pragma", "bo-cache"); 
response.setHeader("cache-control", "bo-cache"); 
response.addDateHeader("expires", 0); 
ImageIO.write(bi, "jpeg", response.getOutputStream()); 
out.close(); 
 %>

添加登录页面: 

<%@ page contentType="text/html; charset=utf-8" language="java" import="java.util.*" pageEncoding="UTF-8"%> 
<%String path = request.getContextPath(); 
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; 
%> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
 <head> 
  <base href="<%=basePath%>" rel="external nofollow" > 
  <title>My JSP 'login.jsp' starting page</title> 
  <meta http-equiv="pragma" content="no-cache"> 
  <meta http-equiv="cache-control" content="no-cache"> 
  <meta http-equiv="expires" content="0">   
  <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 
  <meta http-equiv="description" content="This is my page"> 
  <!-- 
  <link rel="stylesheet" type="text/css" href="styles.css" rel="external nofollow" > 
  --> 
  <script type="text/javascript"> 
function changeimage(){ 
var d=new Date();//生成时间戳, 
document.getElementById("img").src="image.jsp?t="+d;//由变化的时间使参数连表发生变化,url重写 
} 
</script> 
 </head> 
 <body> 
 <font color="red">${requestScope.msg }</font> 
  <form action="loginServlet" method="post"> 
  name:<input type="text" name="uname"><br> 
  pwd:<input type="pwd" name="upwd"><br> 
  code:<input type="text" name="code" size="5"><img id="img" alt="" src="image.jsp "><a onclick="changeimage()">换一张</a><br> 
  <input type="submit" > 
  </form> 
 </body> 
</html>

利用时间的变化,每次生成时间戳,传参给请求的url,达到重写url的目的,从而实现了换一张的刷新功能。

使用重写url机制实现验证码换一张功能

总结

以上所述是小编给大家介绍的使用重写url机制实现验证码换一张功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
?牟┛途W扣了一??效果出?? target=
May 27 Javascript
JavaScript-世界上误解最深的语言分析
Aug 12 Javascript
Javascript学习笔记之相等符号与严格相等符号
Nov 23 Javascript
简单谈谈javascript代码复用模式
Jan 28 Javascript
js+css实现的圆角边框TAB选项卡滑动门代码分享(2款)
Aug 26 Javascript
javascript实现对表格元素进行排序操作
Nov 18 Javascript
javascript之Boolean类型对象
Jun 07 Javascript
仿百度换肤功能的简单实例代码
Jul 11 Javascript
Node.js 回调函数实例详解
Jul 06 Javascript
ES6中定义类和对象的方法示例
Jul 31 Javascript
extjs图形绘制之饼图实现方法分析
Mar 06 Javascript
jQuery 函数实例分析【函数声明、函数表达式、匿名函数等】
May 19 jQuery
js实现拖拽上传图片功能
Aug 01 #Javascript
Jquery中.bind()、.live()、.delegate()和.on()之间的区别详解
Aug 01 #jQuery
angularjs2 ng2 密码隐藏显示的实例代码
Aug 01 #Javascript
使用JavaScript进行表单校验功能
Aug 01 #Javascript
SpringMVC简单整合Angular2的示例
Jul 31 #Javascript
vue.js声明式渲染和条件与循环基础知识
Jul 31 #Javascript
在ABP框架中使用BootstrapTable组件的方法
Jul 31 #Javascript
You might like
php获取目录所有文件并将结果保存到数组(实例)
2013/10/25 PHP
ThinkPHP的cookie和session冲突造成Cookie不能使用的解决方法
2014/07/01 PHP
浅谈JavaScript中面向对象技术的模拟
2006/09/25 Javascript
创建你的第一个AngularJS应用的方法
2015/06/16 Javascript
JavaScript转换与解析JSON方法实例详解
2015/11/24 Javascript
基于JavaScript实现 网页切出 网站title变化代码
2016/04/03 Javascript
Bootstrap基本样式学习笔记之表格(2)
2016/12/07 Javascript
js实现下拉菜单效果
2017/03/01 Javascript
vue2.0的contextmenu右键弹出菜单的实例代码
2017/07/24 Javascript
浅谈函数调用的不同方式,以及this的指向
2017/09/17 Javascript
js实现登录注册框手机号和验证码校验(前端部分)
2017/09/28 Javascript
小程序关于请求同步的总结
2019/05/05 Javascript
Vue组件之高德地图地址选择功能的实例代码
2019/06/21 Javascript
浅谈目前可以使用ES10的5个新特性
2019/06/25 Javascript
layui 对弹窗 form表单赋值的实现方法
2019/09/04 Javascript
js+canvas实现图片格式webp/png/jpeg在线转换
2020/08/22 Javascript
javascript canvas实现简易时钟例子
2020/09/05 Javascript
vue + el-form 实现的多层循环表单验证
2020/11/25 Vue.js
web.py获取上传文件名的正确方法
2014/08/26 Python
查看Python安装路径以及安装包路径小技巧
2015/04/28 Python
Python计算字符宽度的方法
2016/06/14 Python
python里使用正则表达式的组嵌套实例详解
2017/10/24 Python
Python装饰器知识点补充
2018/05/28 Python
使用matplotlib中scatter方法画散点图
2019/03/19 Python
使用python进行波形及频谱绘制的方法
2019/06/17 Python
python各层级目录下import方法代码实例
2020/01/20 Python
Transpose 数组行列转置的限制方式
2020/02/11 Python
浅析Python 抽象工厂模式的优缺点
2020/07/13 Python
Python 高效编程技巧分享
2020/09/10 Python
Ubuntu配置Pytorch on Graph (PoG)环境过程图解
2020/11/19 Python
美国益智玩具购物网站:Fat Brain Toys
2017/11/03 全球购物
Waterford英国官方网站:世界上最受欢迎的优质水晶品牌
2019/08/17 全球购物
银行员工职业规划范文
2014/01/21 职场文书
2015国庆节66周年演讲稿
2015/03/20 职场文书
学校教学工作总结2015
2015/05/19 职场文书
golang用type-switch判断interface的实际存储类型
2022/04/14 Golang