使用重写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 相关文章推荐
用javascript父窗口控制只弹出一个子窗口
Apr 10 Javascript
修改jQuery.Autocomplete插件 支持中文输入法 避免TAB、ENTER键失效、导致表单提交
Oct 11 Javascript
JavaScript中几种常见排序算法小结
Feb 22 Javascript
常用DOM整理
Jun 16 Javascript
整理JavaScript创建对象的八种方法
Nov 03 Javascript
JavaScript高级程序设计(第三版)学习笔记6、7章
Mar 11 Javascript
JS验证input输入框(字母,数字,符号,中文)
Mar 23 Javascript
Node.js对MongoDB数据库实现模糊查询的方法
May 03 Javascript
基于AngularJS实现表单验证功能
Jul 28 Javascript
微信小程序实现全国机场索引列表
Jan 31 Javascript
vue.js轮播图组件使用方法详解
Jul 03 Javascript
angularJs中json数据转换与本地存储的实例
Oct 08 Javascript
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
mysql From_unixtime及UNIX_TIMESTAMP及DATE_FORMAT日期函数
2010/03/21 PHP
DedeCMS dede_channeltype表字段注释
2010/04/07 PHP
ThinkPHP中实例Model方法的区别说明
2010/08/21 PHP
ThinkPHP3.1新特性之多数据库操作更加完善
2014/06/19 PHP
php运行时动态创建函数的方法
2015/03/16 PHP
PHP响应post请求上传文件的方法
2015/12/17 PHP
PHP实现基于文本的摩斯电码生成器
2016/01/11 PHP
浅谈Coreseek、Sphinx-for-chinaese、Sphinx+Scws的区别
2016/12/15 PHP
基于jQuery的图片剪切插件
2011/08/03 Javascript
Jquery实现点击切换图片并隐藏显示内容(2种方法实现)
2013/04/11 Javascript
如何阻止复制剪切和粘贴事件为了表单内容的安全
2013/05/23 Javascript
Jjcarousellite 实现图片列表滚动的简单实例
2013/11/29 Javascript
js对象继承之原型链继承实例
2015/01/10 Javascript
浅谈javascript的Touch事件
2015/09/27 Javascript
bootstrap vue.js实现tab效果
2017/02/07 Javascript
如何利用Fabric自动化你的任务
2016/10/20 Python
python统计字母、空格、数字等字符个数的实例
2018/06/29 Python
不知道这5种下划线的含义,你就不算真的会Python!
2018/10/09 Python
pandas对dataFrame中某一个列的数据进行处理的方法
2019/07/08 Python
使用python制作游戏下载进度条的代码(程序说明见注释)
2019/10/24 Python
如何在Python对Excel进行读取
2020/06/04 Python
Python Django中间件使用原理及流程分析
2020/06/13 Python
可视化pytorch 模型中不同BN层的running mean曲线实例
2020/06/24 Python
python空元组在all中返回结果详解
2020/12/15 Python
html5 Canvas画图教程(11)—使用lineTo/arc/bezierCurveTo画椭圆形
2013/01/09 HTML / CSS
澳大利亚最大的百货公司:Myer
2018/12/21 全球购物
为什么如下的代码int a=100,b=100;long int c=a * b;不能工作
2013/11/29 面试题
EJB的角色和三个对象
2015/12/31 面试题
入学生会自荐书范文
2014/02/05 职场文书
机电职业生涯规划书范文
2014/03/08 职场文书
马智宇结婚主持词
2014/04/01 职场文书
优质服务演讲稿
2014/05/14 职场文书
校车安全责任书
2014/08/25 职场文书
2014幼儿园保育员工作总结
2014/11/10 职场文书
第四次工业革命,打工人与机器人的竞争
2022/04/21 数码科技
Redis 报错 error:NOAUTH Authentication required
2022/05/15 Redis