验证码大家都知道,它的作用也不用我多说了吧。如果不太清楚请参见百度百科中的解释,一般验证码的生成就是随机产生字符(数字、字母或者汉字等),然后将这些生成的字符绘制成一张图片,再在图片上加上一些干扰元素,如各种线条之类的。好了废话不多说一起往下看:
简单的登录页面(代码并不完整,只有验证码部分)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> < html > < head > < title >验证码</ title > < script type = "text/javascript" > < span style = "white-space:pre" data-filtered = "filtered" ></ span >< span style = "white-space:pre" > </ span > //刷新验证码的js函数 < span style = "white-space:pre" > </ span >function changeCode() { < span style = "white-space:pre" > </ span >var imgNode = document.getElementById("vimg"); < span style = "white-space:pre" > </ span >//重新加载验证码,达到刷新的目的 < span style = "white-space:pre" > </ span >imgNode.src = "servlet/AuthImageServlet?t=" + Math.random(); // 防止浏览器缓存的问题 < span style = "white-space:pre" > </ span >} </ script > </ head > < body > < form action = "checkServlet" method = "post" > < label >输入验证码</ label >< br /> < input type = "text" name = "randomCode" />< img id = "vimg" title = "点击更换" onclick = "changeCode();" src = "servlet/AuthImageServlet" >< br /> < input type = "submit" value = "submit" > </ form > </ body > </ html > |
通过session.getAttribute("rand"),获得生成的验证码,然后跟用户输入的进行比较,再根据比较结果做相应的处理。
通过servlet生成验证码:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
|
package com.util.servlet; import java.awt.Color; import java.awt.Font; import java.awt.Graphics; import java.awt.image.BufferedImage; import java.io.IOException; import java.util.Random; import javax.imageio.ImageIO; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpSession; public class AuthImageServlet extends HttpServlet { private static final String CONTENT_TYPE = "text/html; charset=gb2312" ; //设置字母的大小,大小 private Font mFont = new Font( "Times New Roman" , Font.PLAIN, 17 ); public void init() throws ServletException { super .init(); } Color getRandColor( int fc, int bc) { Random random = new Random(); if (fc> 255 ) fc= 255 ; if (bc> 255 ) bc= 255 ; int r=fc+random.nextInt(bc-fc); int g=fc+random.nextInt(bc-fc); int b=fc+random.nextInt(bc-fc); return new Color(r,g,b); } public void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setHeader( "Pragma" , "No-cache" ); response.setHeader( "Cache-Control" , "no-cache" ); response.setDateHeader( "Expires" , 0 ); //表明生成的响应是图片 response.setContentType( "image/jpeg" ); int width= 100 , height= 18 ; BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB); Graphics g = image.getGraphics(); Random random = new Random(); g.setColor(getRandColor( 200 , 250 )); g.fillRect( 1 , 1 , width- 1 , height- 1 ); g.setColor( new Color( 102 , 102 , 102 )); g.drawRect( 0 , 0 , width- 1 , height- 1 ); g.setFont(mFont); g.setColor(getRandColor( 160 , 200 )); //画随机线 for ( int i= 0 ;i< 155 ;i++) { int x = random.nextInt(width - 1 ); int y = random.nextInt(height - 1 ); int xl = random.nextInt( 6 ) + 1 ; int yl = random.nextInt( 12 ) + 1 ; g.drawLine(x,y,x + xl,y + yl); } //从另一方向画随机线 for ( int i = 0 ;i < 70 ;i++) { int x = random.nextInt(width - 1 ); int y = random.nextInt(height - 1 ); int xl = random.nextInt( 12 ) + 1 ; int yl = random.nextInt( 6 ) + 1 ; g.drawLine(x,y,x - xl,y - yl); } //生成随机数,并将随机数字转换为字母 String sRand= "" ; for ( int i= 0 ;i< 6 ;i++) { int itmp = random.nextInt( 26 ) + 65 ; char ctmp = ( char )itmp; sRand += String.valueOf(ctmp); g.setColor( new Color( 20 +random.nextInt( 110 ), 20 +random.nextInt( 110 ), 20 +random.nextInt( 110 ))); g.drawString(String.valueOf(ctmp), 15 *i+ 10 , 16 ); } HttpSession session = request.getSession( true ); session.setAttribute( "rand" ,sRand); g.dispose(); ImageIO.write(image, "JPEG" , response.getOutputStream()); } } |
web.xml中的servlet配置信息:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<? xml version = "1.0" encoding = "UTF-8" ?> < web-app version = "2.5" xmlns = "http://java.sun.com/xml/ns/javaee" xmlns:xsi = "http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"> < servlet > < servlet-name >AuthImageServlet</ servlet-name > < servlet-class >com.util.servlet.AuthImageServlet</ servlet-class > </ servlet > < servlet-mapping > < servlet-name >AuthImageServlet</ servlet-name > < url-pattern >/servlet/AuthImageServlet</ url-pattern > </ servlet-mapping > < welcome-file-list > < welcome-file >index.jsp</ welcome-file > </ welcome-file-list > </ web-app > |
就这样验证码的功能就实现了,很简单、很实用。当然还有更加美观,更加严密的方式,有兴趣的朋友可以深入研究。这里就跟大家分享一个比较简单的方式。欢迎各位批评指正。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持服务器之家。
原文链接:http://blog.csdn.net/liushuijinger/article/details/9473359