详解JSP开发之生成图片验证码的简单步骤

2024-09-05 00:18:47

字体：大中小

来源：转载

供稿：网友

在网上注册用户时，往往需要根据图片给出的图片验证码输入验证码，今天错新技术频道小编就带大家来学习详解JSP开发之生成图片验证码的简单步骤吧！

简单来说分为三步骤：

1.底层用Java实现生成验证码图片
2.通过配置文件调用实现Java生成片
3.通过HTML技术把图片显示到网页

首先是最底层Java生成图片代码

package cn.hncu.servlets;import java.awt.Color;import java.awt.Font;import java.awt.Graphics;import java.awt.image.BufferedImage;import java.io.FileOutputStream;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;public class CodeImgServlet extends HttpServlet {  @Override  protected void service(HttpServletRequest req, HttpServletResponse resp)      throws ServletException, IOException {    //☆1☆--相比纯java方式有变化的地方    resp.setContentType("image/jpeg");//设置http响应头---告诉浏览器我现在发的是这个图片格式的数据，你用相应的方式来解析    //定义图片的宽和高    int w=60;    int h=30;    //声明一个RGB格式的内存中的图片    BufferedImage img = new BufferedImage(w, h, BufferedImage.TYPE_INT_RGB);    Graphics g = img.getGraphics();    //把背景变白色    g.setColor(Color.white);    g.fillRect(0, 0, w, h);    //设置字体    g.setFont(new Font("aa",Font.BOLD,18));    //产生并draw出4个随机数字    Random r = new Random();    for(int i=0;i<4;i++){      int a = r.nextInt(10);//生成0~9之间的随机整数      int y = 15+r.nextInt(20);//产生随机的垂直位置      //产生随机颜色      Color c = new Color(r.nextInt(256),r.nextInt(256),r.nextInt(256));      g.setColor(c);      g.drawString(""+a, i*15, y);    }    //画几条干扰线    for(int i=0;i<10;i++){      //产生随机颜色      Color c = new Color(r.nextInt(256),r.nextInt(256),r.nextInt(256));      g.setColor(c);      g.drawLine(r.nextInt(60), r.nextInt(30), r.nextInt(60), r.nextInt(30));    }    g.dispose();//类似于IO中的flush(),把图形数据刷到img中    //把内存图片img对象保存到一个jpg文件    ImageIO.write(img, "JPEG", resp.getOutputStream() );//☆2☆  }}

项目中的Web.xml配置文件代码

<?xml version="1.0" encoding="UTF-8"?><web-app version="3.0"   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_3_0.xsd"> <display-name></display-name>  <!-- 安全目录中的jsp文件如果要允许外面访问，得在web.xml进行配置，配置成一个jsp-servlet --> <servlet>  <servlet-name>ajsp</servlet-name>  <!-- 配置servlet用servlet-class, 配置jsp页面用jsp-file标签 -->  <jsp-file>/WEB-INF/jsps/a.jsp</jsp-file> </servlet> <!--   <servlet>  <servlet-name>CodeImgServlet</servlet-name>  <servlet-class>cn.hncu.servlets.CodeImgServlet</servlet-class>  </servlet>  <servlet>  <servlet-name>LoginServlet</servlet-name>  <servlet-class>cn.hncu.servlets.LoginServlet</servlet-class>  </servlet>  -->   <servlet>    <servlet-name>CodeImgServlet</servlet-name>    <servlet-class>cn.hncu.servlets.CodeImgServlet</servlet-class>   </servlet>   <servlet>    <servlet-name>LoginServlet</servlet-name>    <servlet-class>cn.hncu.servlets.LoginServlet</servlet-class>   </servlet> <!-- 给servlet配置访问路径 --> <servlet-mapping>  <servlet-name>ajsp</servlet-name>  <url-pattern>/x/a.asp</url-pattern> </servlet-mapping> <servlet-mapping>  <servlet-name>CodeImgServlet</servlet-name>  <url-pattern>/code</url-pattern> </servlet-mapping> <servlet-mapping>  <servlet-name>LoginServlet</servlet-name>  <url-pattern>/LoginServlet</url-pattern> </servlet-mapping> <welcome-file-list>  <welcome-file>index.jsp</welcome-file> </welcome-file-list></web-app>

主页面代码登录代码

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <script type="text/javascript">   function changeImg(){     var img = document.getElementById("codeImg");     // 当src每次的路径方式变化时，就会去重新请求一次后台。     img.src="code?"+new Date().getTime();   } </script> </head> <body>  <h2>用户注册</h2>   <form action="LoginServlet" method="post">      姓名:<input type="text" name="name"><br/>      密码:<input type="password" name="pwd"><br/>    <!--      验证码:<input type="text" name="code"/><img src="imgs/a.jpg"/><br/>     -->      验证码:<input type="text" name="code"/><img id="codeImg" src="code"/><a href="javascript:changeImg();" rel="external nofollow" >看不清</a><br/>     <input type="submit" value="注册">   </form>   <br/><br/>   <hr/>   <a href="WEB-INF/jsps/a.jsp" rel="external nofollow" >WA---a.jsp</a> <br/>   <a href="/helloWebProj/x/a.asp" rel="external nofollow" >AC---a.jsp</a> <br/> </body></html>

当页面加载，就向TOMCAT请求服务，调用前面的JAVA类，生成图片，再通过HTML文档，将图片加载到页面来。

其次Web.xml配置文件还可以用来设置访问安全目录文件（WEB-INF）

 <servlet>     <servlet-name>ajsp</servlet-name>    <!-- 配置servlet用servlet-class, 配置jsp页面用jsp-file标签 -->     <jsp-file>/WEB-INF/jsps/a.jsp</jsp-file>   </servlet>     <servlet>    <servlet-name>CodeImgServlet</servlet-name>    <servlet-class>cn.hncu.servlets.CodeImgServlet</servlet-class>   </servlet>   <servlet>    <servlet-name>LoginServlet</servlet-name>    <servlet-class>cn.hncu.servlets.LoginServlet</servlet-class>   </servlet> <!-- 给servlet配置访问路径 --> <servlet-mapping>  <servlet-name>ajsp</servlet-name>  <url-pattern>/x/a.asp</url-pattern> </servlet-mapping> <servlet-mapping>  <servlet-name>CodeImgServlet</servlet-name>  <url-pattern>/code</url-pattern> </servlet-mapping> <servlet-mapping>  <servlet-name>LoginServlet</servlet-name>  <url-pattern>/LoginServlet</url-pattern> </servlet-mapping>上述的文章内容就是由错新技术频道小编为大家介绍的详解JSP开发之生成图片验证码的简单步骤，如果您有更好的内容知识，欢迎来错新技术频道网站留言哦。

上一篇：详解JSP中使用过滤器进行内容编码的解决办法

下一篇：JSP Session超时设置的实现方法