验证码大家都知道,它的作用也不用我多说了吧。如果不太清楚请参见百度百科中的解释,一般验证码的生成就是随机产生字符(数字、字母或者汉字等),然后将这些生成的字符绘制成一张图片,再在图片上加上一些干扰元素,如各种线条之类的。好了废话不多说一起往下看:

简单的登录页面(代码并不完整,只有验证码部分)

<%@ 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生成验证码:

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配置信息:

<?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>

就这样验证码的功能就实现了,很简单、很实用。当然还有更加美观,更加严密的方式,有兴趣的朋友可以深入研究。这里就跟大家分享一个比较简单的方式。欢迎各位批评指正。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

02-09 08:52