使用重写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 相关文章推荐
PJBlog插件 防刷新的在线播放器
Oct 25 Javascript
javascript中的delete使用详解
Apr 11 Javascript
使用js检测浏览器的实现代码
May 14 Javascript
JS字符串拼接在ie中都报错的解决方法
Mar 27 Javascript
js unicode 编码解析关于数据转换为中文的两种方法
Apr 21 Javascript
优化Node.js Web应用运行速度的10个技巧
Sep 03 Javascript
一个JavaScript递归实现反转数组字符串的实例
Oct 14 Javascript
js实现上下左右弹框划出效果
Mar 08 Javascript
关于axios如何全局注册浅析
Jan 14 Javascript
Angular 利用路由跳转到指定页面的指定位置方法
Aug 31 Javascript
vuex + keep-alive实现tab标签页面缓存功能
Oct 17 Javascript
JavaScript中的函数式编程详解
Aug 22 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应用提速面面观
2006/10/09 PHP
Android ProgressBar进度条和ProgressDialog进度框的展示DEMO
2013/06/19 PHP
XAMPP安装与使用方法详细解析
2013/11/27 PHP
百度工程师讲PHP函数的实现原理及性能分析(二)
2015/05/13 PHP
PHP foreach遍历多维数组实现方式
2016/11/16 PHP
阿里云Win2016安装Apache和PHP环境图文教程
2018/03/11 PHP
PHP封装XML和JSON格式数据接口操作示例
2019/03/06 PHP
php使用yield对性能提升的测试实例分析
2019/09/19 PHP
23个超流行的jQuery相册插件整理分享
2011/04/25 Javascript
jQuery事件之键盘事件(ctrl+Enter回车键提交表单等)
2014/05/11 Javascript
Jquery中CSS选择器用法分析
2015/02/10 Javascript
javasript实现密码的隐藏与显示
2015/05/08 Javascript
分享js粘帖屏幕截图到web页面插件screenshot-paste
2020/08/21 Javascript
AngularJs表单验证实例详解
2016/05/30 Javascript
JS获取随机数和时间转换的简单实例
2016/07/10 Javascript
Vue.js第二天学习笔记(vue-router)
2016/12/01 Javascript
详解js中常规日期格式处理、月历渲染和倒计时函数
2016/12/28 Javascript
javascript实现二叉树的代码
2017/06/08 Javascript
Node+OCR实现图像文字识别功能
2018/11/26 Javascript
angular6开发steps步骤条组件
2019/07/04 Javascript
基于纯JS实现多张图片的懒加载Lazy过程解析
2019/10/14 Javascript
Vue为什么要谨慎使用$attrs与$listeners
2020/08/27 Javascript
matplotlib subplots 设置总图的标题方法
2018/05/25 Python
Django命名URL和反向解析URL实现解析
2019/08/09 Python
使用Django搭建web服务器的例子(最最正确的方式)
2019/08/29 Python
详解Python图像处理库Pillow常用使用方法
2019/09/02 Python
python实现邮件循环自动发件功能
2020/09/11 Python
英国在线药房:Express Chemist
2019/03/28 全球购物
俄罗斯最大的在线珠宝大卖场:Nebo
2019/12/08 全球购物
乌克兰品牌化妆品和香水在线商店:Bomond
2020/01/14 全球购物
质检的岗位职责
2013/11/17 职场文书
个人贷款授权委托书样本
2014/10/07 职场文书
个园导游词
2015/02/04 职场文书
公司优秀员工推荐信
2015/03/24 职场文书
2015年人民调解工作总结
2015/05/18 职场文书
教你win10系统中APPCRASH事件问题解决方法
2022/07/15 数码科技