您的位置:首页 > 其它

Response实现验证码功能

2015-10-14 20:03 316 查看
Servlet代码:

public static final int WIDTH=120;
public static final int HEIGHT=35;
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {

BufferedImage image=new BufferedImage(WIDTH, HEIGHT, BufferedImage.TYPE_INT_RGB);
Graphics  g=image.getGraphics();

//1 设置背景颜色
setBackGround(g);

//2 设置边框
setBorder(g);

//3 画出干扰线
drawRandomLine(g);

//4 写随机数
drawRandomNum((Graphics2D)g);

//5 图形写给浏览器
response.setContentType("image/jpeg");
response.setHeader("Expires", "-1");
response.setHeader("Cache-Control", "no-cache");
response.setHeader("Pragma", "no-cache");
ImageIO.write(image, "jpg", response.getOutputStream());
}

private void drawRandomNum(Graphics2D g) {
g.setColor(Color.RED);
g.setFont(new Font("宋体",Font.BOLD,20));
String base = "\u7684\u4e00\u4e86\u662f\u6211\u4e0d\u5728\u4eba\u4eec\u6709\u6765\u4ed6\u8fd9\u4e0a\u7740\u4e2a\u5730\u5230\u5927\u91cc\u8bf4\u5c31\u53bb\u5b50\u5f97\u4e5f\u548c\u90a3\u8981\u4e0b\u770b\u5929\u65f6\u8fc7\u51fa\u5c0f\u4e48\u8d77\u4f60\u90fd\u628a\u597d\u8fd8\u591a\u6ca1\u4e3a";
int x=5;
for(int i=0;i<4;i++){
int degree=new Random().nextInt()%30;
String ch=base.charAt(new Random().nextInt(base.length()))+"";
g.rotate(degree*Math.PI/180, x, 20);
g.drawString(ch, x, 20);
g.rotate(-degree*Math.PI/180, x, 20);
x+=30;
}
}

private void drawRandomLine(Graphics g) {
g.setColor(Color.GREEN);
for(int i=0;i<5;i++){
int x1=new Random().nextInt(WIDTH);
int y1=new Random().nextInt(HEIGHT);

int x2=new Random().nextInt(WIDTH);
int y2=new Random().nextInt(HEIGHT);
g.drawLine(x1, y1, x2, y2);
}

}

private void setBorder(Graphics g) {
g.setColor(Color.BLUE);
g.drawRect(1, 1, WIDTH-2, HEIGHT-2);
}

private void setBackGround(Graphics g) {
g.setColor(Color.WHITE);
g.fillRect(0, 0, WIDTH, HEIGHT);
}


jsp代码:

<html>
<head>
<script>
function changeImage(img){
img.src=img.src+"?"+new Date().getTime(); //改变地址
}
</script>
</head>

<body>
<form>
用户名:<input type="text" name="username"> <br/>
密码:<input type="text" name="password">  <br/>
认证码:<input type="text" name="checkcode">
<img src="/day07/servlet/ResponseDemo4" onclick="changeImage(this)"  alt="换一张" style="cursor:hand">  <br/>
<input type="submit" value="注册">
</form>
</body>
</html>


onclick调用的方法能不能改成下边的这行:

onclick="this.src=this.src"


实践是错误的。第一次你请求的地址是

http://localhost:8080/day07/servlet/ResponseDemo4


因为你再次请求得地址和上边是一样的,浏览器里边有缓存,所有页面并没有刷新,没有得到我们想要的效果。

因此我们使用下边的方法

img.src=img.src+"?"+new Date().getTime(); //改变地址


我们的传送方式是 get()方法,因此我们后边可以传送一个没有用的数据,只是为了改变这个请求的网址。就会得到下边的地址:

http://localhost:8080/day07/servlet/ResponseDemo4?1444884854019


所以这次就会得到我们想要的效果。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: