登录图形验证码

[html]
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <base href="<%=basePath%>">

    <title>My JSP 'index.jsp' starting page</title>

</head>
<form action="./LoginServlet" method="post">
      <body>
      员工信息录入<br/>

                              用户名：<input type="text" value="" name="username" /> <br/>
                              密码：<input type="password" name="psw"/> <br/>
            验证码：<input name="checkcode" type="text" classs="big-input" maxlength="20" value="" /><br/>
        <img src="${pageContext.request.contextPath }/ImageServlet" onclick="nextPic();" id="pic" title="看不清，再来一张" /><br/>
                              保存用户名和密码<input type="checkbox" name="save" value="yes" /><br/>


            <input type="submit" value="保存" />
       </body>

       <script type="text/javascript">
       function nextPic(){
         var picStr=document.getElementById("pic");
         //使用随机数
        // picStr.src="${pageContext.request.contextPath }/ImageServlet?"+Math.random();

        //使用时间戳
        picStr.src="${pageContext.request.contextPath }/ImageServlet?"+Date.parse(new Date());

       }

       </script>
</form>
</html>
ImageServlet:
[java]
package aaa;

import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.io.PrintWriter;
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 ImageServlet extends HttpServlet {

    private int width=85;
    private int height=30;
    //定义验证码的使用的字母和数字
    private char[] charSeq="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789".toCharArray();
    private int codeCount=4;
    //定义验证码的基线
    private int codeX;
    private int codeY;
    public ImageServlet() {
        super();
    }

    public void destroy() {
        super.destroy(); // Just puts "destroy" string in log
        // Put your code here
    }

    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        doPost(request,response);
    }

    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        request.setCharacterEncoding("utf-8");
        response.setContentType("text/html;charset=utf-8");
        //PrintWriter out = response.getWriter();
        HttpSession session=request.getSession();
        /*
         * BufferedImage描述具有可以访问图像缓冲区的image
         * Graphics类是所有图形上下文
         */
        BufferedImage image=new BufferedImage(width,height,BufferedImage.TYPE_INT_RGB);
        Graphics g=image.getGraphics();
        //将此图形上下文的当前颜色设置为指定颜色
        g.setColor(Color.white);
        g.fillRect(0, 0, width, height);
        //设置边框的yans
        g.setColor(Color.black);
        g.drawRect(0, 0, width-1, height-1);
        //生成验证码
        Random random=new Random();
      &nb

补充：web前端 , HTML 5 ,

登录 图形验证码

登录图形验证码