先在Web目录下的lib目录中导入jar包：ValidateCode.jar
然后创建一个Servlet类来创建验证码：ValidateCodeServlet.java
创建验证码将验证码存储到session中，用于在浏览器中输入时进行对比将验证码以图片的形式发给浏览器，这样页面中的图片路径就可以直接加载这个验证码了
package com.robot.servlet;import cn.dsna.util.images.ValidateCode;import javax.servlet.ServletException;import javax.servlet.annotation.WebServlet;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import javax.servlet.http.HttpSession;import java.io.IOException;/*** @author 张宝旭*/@WebServlet(name = "ValidateCodeServlet", value = "/validateCode")public class ValidateCodeServlet extends HttpServlet {protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {doGet(request, response);}protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {// 1 创建验证码ValidateCode validateCode = new ValidateCode(100, 30, 4, 30);// 2 将验证码存储到SessionHttpSession session = request.getSession();session.setAttribute("validateCode", validateCode.getCode());// 3 将验证码以图片的形式发给浏览器validateCode.write(response.getOutputStream());}}
在登录界面的表单中：login.jsp，创建输入验证码的输入框，其中图片的src路径就可以直接加载ValidateCodeServlet中输出的图片了，此validateCode是在Servlet中定义的路径value = “/validateCode”，不是取session中的值
<span style="color: orange; font-size: 35px; ">验证码<input id="login-validate" name="validate" type="text" placeholder="请输入验证码" style="font-size: 25px"/><img id="img" src="validateCode" οnclick="changeImg()"/></span>
在验证码图片中实现了点击图片就刷新的方法
<script type="text/javascript">function changeImg() {document.getElementById("img").src="validateCode?n="+Math.random();}</script>
此时session中存储了验证码，在页面中也有验证码图片，可以输入验证码了，然后需要的就是将输入的验证码和存储的验证码匹配，检查是否正确
在登录的Servlet中进行判断：LoginServlet.java
获取提交过来的验证码，再获取session中存储的验证码，判断两者是否匹配，如果不匹配，则还跳转到登录界面重新登录，如果匹配成功，就继续执行接下来的代码
String validate1 = request.getParameter("validate");String validate2 = (String) session.getAttribute("validateCode");if (!validate1.equalsIgnoreCase(validate2)) {response.sendRedirect("login.jsp");return;}
最终效果大致如下
