在登陆页面写出一次性图片验证码

最新推荐文章于 2019-06-18 08:27:20 发布

灵泽~

最新推荐文章于 2019-06-18 08:27:20 发布

阅读量1.2k

点赞数 3

分类专栏： java 生态圈

本文链接：https://blog.csdn.net/qq_38263083/article/details/81778059

版权

java 生态圈专栏收录该内容

46 篇文章 0 订阅

订阅专栏

在登陆页面增加图片验证码

第一步：

生成随机图片验证码：

主要使用 imageio 以及 BufferedImage，注意我的生成的验证码图片保存路径在F盘，大家可以随意更改

/**
     * 此java文件主要用于生成随机的验证码图片，保存在F:/a.jpg
     */
    
    
    //最终的TestCode
    private static StringBuilder lastCode = new StringBuilder();
    
    //返回最终的TestCode
    public static StringBuilder getLastCode() {
        return lastCode;
    }

    //生成随机的字母
    public  void produceIdentifyCodeImage() {
        String code[] = {"3","4","5","z","x","c","v","b","n","m","a","s","d","f","g"};
        String codeType[] = {"TimesRoman","Courier","Arial",
                            "宋体","仿宋","微软雅黑","Monospaced ",
                            "TimesRoman","Courier","Arial"};
        
        int randomNum[] =  getRandomNum(4);
        
        
        if(lastCode.length()!=0) {
            lastCode.replace(0, lastCode.length(), "");
        }
        
        BufferedImage bi = new BufferedImage(130, 60, BufferedImage.TYPE_INT_BGR);
        Graphics2D g = (Graphics2D) bi.getGraphics();
        g.setColor(Color.white);
        g.fillRect(0, 0, 150, 70);
        for(int i=0;i<4;i++) {
            g.setFont(new Font(codeType[randomNum[i]], Font.BOLD, 30));
            g.setColor(new Color(i*60, i*45, i*32));
            g.drawLine(randomNum[i]*7, randomNum[i]*15, randomNum[i]*160,randomNum[i]*130);
            
            g.drawString(code[randomNum[i]], 10+i*30, 30);
            lastCode.append(code[randomNum[i]]);
        }
        g.drawRect(0, 0, 149, 69);
        try {
            ImageIO.write(bi, "JPEG", new FileOutputStream("F:/a.jpg"));
            
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
    
    //生成随机数
    private static int[] getRandomNum(int num) {
        int RandomNum[] = new int[num];
        for(int i=0;i<num;i++) {
            int OnlyrandomNum = (int) (Math.random()*10);
            RandomNum[i] = OnlyrandomNum;
        }
        return RandomNum;
    }
    

//此部分用来给servlet来获得bufferedimage
    public static BufferedImage getIdentifyCodeImage() {
        ShowPicture sp = new ShowPicture();
        sp.produceIdentifyCodeImage();
        File file = new File("F:/a.jpg");
        BufferedImage image = null;
        try {
            image = ImageIO.read(file);
            
        } catch (IOException e) {
            e.printStackTrace();
        }
        
        
        return image;
    }
    



    //此部分用在servlet中将BufferedImage输出到response.getOutputStream()
    public void out(BufferedImage bi,OutputStream os) {
        
        try {
            ImageIO.write(bi, "JPEG", os);
        } catch (IOException e) {
            e.printStackTrace();
        }
        
    }

验证码图片如下：

第二步：

已经可以生成随机验证码图片那么这一步就将随机验证码返发送到登陆页面或者你需要的页面了

先写出一个servlet（表名验证码需要请求的路径)

@WebServlet("/VerifyCode")
public class VerifyCode extends HttpServlet {


	/**
	 * 此Servlet处理来之Login.jsp的验证码请求
	 * 把生成的图片输出流输入到response流中
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		ShowPicture sp = new ShowPicture();
		//得到图片bufferImage对象
		BufferedImage bi = sp.getIdentifyCodeImage();
		//得到验证码字符串
		String vcode = sp.getLastCode().toString();
		
		//输出图片,通过response将图片的流输出到请求的页面中去
		sp.out(bi, response.getOutputStream());
        //这里输出的就是每次请求的验证码（用于后期大家用来作为与用户填写的验证码比较）
		System.out.println(vcode);
	}
}

第三步：

就是写一个jsp页面将验证码图片显示出来

我这里也随便写了换一张的功能，换一张之后，在第二步中得到的验证码就是最新的验证码，大家不用担心

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>

<script type="text/javascript">
	var i=0;
    function change() {
    	
		var v = document.getElementById("img");
		//这里如果需要黄一张只要重新请求一尺生成验证码的servlet即可
		//这里只要将请求的路径每次都不一样即可
		//这里的意思就是求情的路径不发生改变，我只是改变没吃请求的参数即？之后的部分
		//大家也可以改其他的，但是请求的路径不能错
		v.src = "/day02_2/VerifyCode?use="+(i++);
	}

</script>

<body>
	<%-- 验证码 --%>
	<img  id="img" src="${pageContext.request.contextPath }/VerifyCode">
	<!-- 按下超链接进入js操作将img的请求路径重新改变发送一次 -->
	<a href="javascript:change()">换一张</a>
</body>
</html>

第四步：

查看：登陆jsp页面

控制台输出的验证码：

按下换一张功能：

控制台效果：

上面的代码就是源码，但是大家需要根据自己的javaweb项目更改一些项目名。

灵泽~

关注

3
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
在登陆页面写出一次性图片验证码

在登陆页面增加图片验证码第一步：生成随机图片验证码：主要使用 imageio 以及 BufferedImage，注意我的生成的验证码图片保存路径在F盘，大家可以随意更改/** * 此java文件主要用于生成随机的验证码图片，保存在F:/a.jpg */ //最终的TestCode private static Str...
复制链接

扫一扫

专栏目录