java+jsp登陆注册验证码案例

#在我学习javaweb项目时,写了一个简单的登录注册,然后就想到了为登陆注册添加一个验证码的操作#

他是通过jsp的img标签的src发一个请求路径到Java类然后生成一个图片然后再图片上添加上四个随机字母组成验证码的操作。

前端jsp部分代码

html

<input type="text" name="userCode" maxlength="4">
<img id="img" src="ValidateCodeServlet"  width="100" height="30">

javascript

<script type="text/javascript">
 $("#img").click(function (){
      $("#img").src="ValidateCodeServlet?m="+Math.random();
  });
</script>

java类

@WebServlet("/ValidateCodeServlet")
public class ValidateCodeServlet extends HttpServlet {
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

        int width=300;//验证码宽度
        int height=90;//验证码高度
        // 创建图片
        BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
        //绘制图片,从图片对象中获取绘制图片的“笔”
        Graphics2D pen = image.createGraphics();
        //绘制背景
        pen.setColor(getRandomColor());
        //绘制实心矩形
        pen.fillRect(0,0,width,height);
        int letterNum=4;//设置验证码长度
        int space=20;//设置验证码字符间隔
        int letterWidth=(width-(letterNum+1)*space)/letterNum;//设置验证码所占宽度
        String vCode="";//设置一个空字符串用于后续拼接
        /**
         * 利用循环随机生成四个随机字符组合验证码
         * */
        for (int i = 0; i <letterNum ; i++) {
            int ascii=random.nextInt(26)+97;//生成97-122ascii
            byte[] bs={(byte)ascii};
            String letter = new String(bs);
            vCode=vCode+letter;
            pen.setColor(getRandomColor());
            pen.setFont(new Font("Gallium", Font.BOLD,70));//设置验证码字母字体
            pen.drawString(letter,space+(letterWidth+space)*i,height-space);
        }
        req.getSession().setAttribute("vCode",vCode);
        //图片绘制完成之后,将图片通过response的输出流相应到客户端
        ImageIO.write(image,"png",resp.getOutputStream());
    }
    Random random = new Random();
    private Color getRandomColor(){
        int r=random.nextInt(256);
        int g=random.nextInt(256);
        int b=random.nextInt(256);
        Color color = new Color(r, g, b);
        return  color;
    }

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值