java验证码

使用技术java,javaweb,vue,axios,html,css,js

效果呈现，后端进行数据验证

注意img里面的src路径返回的是一张图片

<li style="width: 500px;margin-bottom: 30px">

验证码:<el-input @blur="sr5" style="width: 100px;margin-left:-16px;" v-model="user.verify" placeholder="请输入内容"></el-input>

<a style="cursor: hand;margin: 100px;position: absolute" οnclick="fun1()">

<img style="height: 38px;position:relative;top:-100px;left: -30px" src="/journalism/CheckCodeServlet" alt="加载中..." id="img">

</a>

</li>

工具类CheckCodeServlet产生一个验证码图片 设置了session方便验证

package com.util;

import javax.imageio.ImageIO;

import javax.servlet.ServletException;

import javax.servlet.annotation.WebServlet;

import javax.servlet.http.Cookie;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import java.awt.*;

import java.awt.image.BufferedImage;

import java.io.File;

import java.io.IOException;

import java.io.OutputStream;

import java.util.Random;

@WebServlet("/CheckCodeServlet")

public class CheckCodeServlet extends HttpServlet {

@Override

protected 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/gif");

int width = 120;

int height = 50;

//画板

BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);

//画笔

Graphics g = image.getGraphics();

Font font = new Font("宋体",Font.BOLD,35);

g.setFont(font);

String imagePath = request.getServletContext().getRealPath("/img/11.png");

Image image1 = ImageIO.read(new File(imagePath));

g.drawImage(image1, 0, 0, 120, 50, null);

// String source = "0123456789abcdefghijklmABCDEFGH好人按时发生大发";

String source = "0123456789";

String infor = "";

for (int i = 0; i < 4; i++) {

//随机取一个字符

int index = new Random().nextInt(source.length()-1);

char myCode = source.charAt(index);

//让字的颜色随机

Random random = new Random();

g.setColor(new Color(20+random.nextInt(120),20+random.nextInt(120),20+random.nextInt(120)));

//画入文字

g.drawString(myCode+"", 15+i*20, 30+new Random().nextInt(20));

//画入干扰线

g.drawLine(random.nextInt(80), random.nextInt(40), random.nextInt(100), random.nextInt(40));

infor += myCode;

}

//记录到session，以备将来匹配

request.getSession().setAttribute("infor", infor);

// 创建Cookie对象

// Cookie cookie = new Cookie("yanzhen1", infor);

// response.addCookie(cookie);

//释放资源

g.dispose();

OutputStream out = response.getOutputStream();

ImageIO.write(image,"gif", out);

out.flush();

out.close();}}

输入完验证码之后将数据传到后台

axios.post("http://localhost:8080/journalism/verification?name="+"verify"+"&input="+this.user.verify).then((resp)=> {

console.log(resp.data);

if(resp.data==false){

this.ts5 = true;

}else{

this.ts5 = false;}})

将数据传递到后台之后，进行数据验证，然后返回数据，完成验证码验证

// 验证码

if("verify".equals(name)){

String input = req.getParameter("input");

System.out.println(input);

// 获取验证码里的session

HttpSession session = req.getSession();

String infor = (String)session.getAttribute("infor");

System.out.println(infor);

if(infor.equals(input)){

resp.getWriter().write("true");

}else{

resp.getWriter().write("false");

}

}