使用重写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 相关文章推荐
写的htc的数据表格
Jan 20 Javascript
javascript 显示当前系统时间代码
Dec 28 Javascript
Javascript中string转date示例代码
Nov 01 Javascript
js控制input输入字符解析
Dec 27 Javascript
struts2+jquery组合验证注册用户是否存在
Apr 30 Javascript
浅析javascript函数表达式
Feb 10 Javascript
javaScript语法总结
Nov 25 Javascript
详解Angular.js指令中scope类型的几种特殊情况
Feb 21 Javascript
Bootstrap表格制作代码
Mar 17 Javascript
详解Node.js串行化流程控制
May 04 Javascript
在 Vue 项目中引入 tinymce 富文本编辑器的完整代码
May 04 Javascript
Vue.js 利用v-for中的index值实现隔行变色
Aug 01 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
PHP中array_slice函数用法实例详解
2014/11/25 PHP
Laravel 5框架学习之子视图和表单复用
2015/04/09 PHP
php递归遍历多维数组的方法
2015/04/18 PHP
PHP实现的各类hash算法长度及性能测试实例
2017/08/27 PHP
thinkPHP5.0框架验证码调用及点击图片刷新简单实现方法
2018/09/07 PHP
用javascript实现改变TEXTAREA滚动条和按钮的颜色,以及怎样让滚动条变得扁平
2007/04/20 Javascript
js querySelector和getElementById通过id获取元素的区别
2012/04/20 Javascript
点击标签切换和自动切换DIV选项卡
2014/08/10 Javascript
jquery.cookie.js使用指南
2015/01/05 Javascript
使用jQuery管理选择结果
2015/01/20 Javascript
jQuery使用fadein方法实现渐出效果实例
2015/03/27 Javascript
关于backbone url请求中参数带有中文存入数据库是乱码的快速解决办法
2016/06/13 Javascript
JavaScript中一些特殊的字符运算
2017/08/17 Javascript
vue监听scroll的坑的解决方法
2017/09/07 Javascript
ES6中数组array新增方法实例总结
2017/11/07 Javascript
浏览器调试动态js脚本的方法(图解)
2018/01/19 Javascript
深入剖析Express cookie-parser中间件实现示例
2018/02/01 Javascript
NodeJS实现自定义流的方法
2018/08/01 NodeJs
vue.js 实现评价五角星组件的实例代码
2018/08/13 Javascript
vue中使用gojs/jointjs的示例代码
2018/08/24 Javascript
vue iview实现动态新增和删除
2020/06/17 Javascript
Python可变参数用法实例分析
2017/04/02 Python
Python统计纯文本文件中英文单词出现个数的方法总结【测试可用】
2018/07/25 Python
pybind11在Windows下的使用教程
2019/07/04 Python
REISS英国官网:伦敦High Street最受欢迎品牌
2016/12/21 全球购物
美国猫狗药物和用品网站:PetCareRx
2017/01/05 全球购物
国际商务系学生个人的自我评价
2013/11/26 职场文书
幼儿园开学家长寄语
2014/01/19 职场文书
前厅收银主管岗位职责
2014/02/04 职场文书
校园安全广播稿
2014/02/08 职场文书
国际经济与贸易专业求职信
2014/07/10 职场文书
教师批评与自我批评总结
2014/10/16 职场文书
小学教研工作总结2015
2015/05/13 职场文书
世界上超棒的8种逻辑思维
2019/08/06 职场文书
如何利用golang运用mysql数据库
2022/03/13 Golang
Linux下搭建SFTP服务器的命令详解
2022/06/25 Servers