通过虚拟图片绘制验证码,创建一个类继承HttpServlet,在doGet中实现:
package cn.edu.svtcc.servlet;
import javax.imageio.ImageIO;
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 java.awt.*;
import java.awt.image.BufferedImage;
import java.io.ByteArrayOutputStream;
import java.io.IOException;
@WebServlet("/generateImg")
public class GenerateCodImgServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//1.生成一张图片
BufferedImage image=new BufferedImage(201,50,BufferedImage.TYPE_INT_RGB);
Graphics g=image.getGraphics();
//产生文字
String chars="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
String code="";
for (int i=0;i<6;i++){
int pos=(int)(Math.random()*chars.length());
char ch=chars.charAt(pos);
code=code+ch;
}
//在Session中存储code
req.getSession().setAttribute("code",code);
//绘制文字
g.setColor(Color.WHITE);
g.setFont(new Font("宋体",Font.ITALIC|Font.BOLD,38));
g.drawString(code,35,40);
//绘制干扰点
for (int i=0;i<=100;i++){
int x=(int)(Math.random()*201);
int y=(int)(Math.random()*50);
g.drawOval(x,y,1,1);
}
g.dispose();
//2.将图片发送给浏览器
//2.1将图片转换为二进制
ByteArrayOutputStream bos=new ByteArrayOutputStream();
ImageIO.write(image,"JPEG",bos);
byte[] buf=bos.toByteArray();
//2.2发送给浏览器
resp.getOutputStream().write(buf);
}
}
JavaScript板块,通过使用src="${pageContext.servletContext.contextPath}/generateImg"的方式展示在浏览器当中:
<div class="form-group clearfix">
<div class="col-md-8 col-xs-8" style="padding: 0px;">
<input placeholder="请输入验证码" type="text" class="form-control" name="code" style="border-top-right-radius: 0;border-bottom-right-radius: 0">
</div>
<div class="col-md-4 col-xs-4" style="padding: 3px;border: 1px solid #4E8CC0;border-left: none;background: linear-gradient(to right,#e2e2e2,#ffffff)">
<a href="${pageContext.servletContext.contextPath}/login"> <img id="captchaImg" name="captchaImg" onclick="$('#captchaImg').attr('src','/web/aptcha?7d42f96539b14a2598a4a6ad610c655f&img.jpg')" style="width:108px;height:30px;padding:0px;margin:0px;" src="${pageContext.servletContext.contextPath}/generateImg">
</a></div>
</div>
最终结果:
点击链接还有更多相关技术:使用javaScript,javaWeb技术实现二手车展系统的后端开发-Java文档类资源-CSDN下载
该贴为此相关技术之一哟!