栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > 后端开发 > Java

spring boot生成随机四位字符的验证码图片由vue前端获取使用

Java 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

spring boot生成随机四位字符的验证码图片由vue前端获取使用

一、创建spring boot后端项目,在controller中编写生成验证码的信息,通过流响应给浏览器

 

代码
BufferedImage bufferedImage = new BufferedImage(100,50,BufferedImage.TYPE_INT_BGR);
log.info("创建画板开始------------------");
Graphics2D graphics = bufferedImage.createGraphics();

log.info("设置背景颜色------------------");
graphics.setColor(Color.WHITE);

graphics.setBackground(Color.WHITE);

graphics.fillRect(0,0,100,50);
List list = new ArrayList<>();

Random random = new Random();

log.info("生成随机数------------------");
for(int i = 0 ; i < 4; i ++){
    list.add(data[random.nextInt(data.length)]);
}

log.info("设置字体,形状,大小------------------");
graphics.setFont(new Font("宋体",Font.BOLD|Font.ITALIC,20));
Color [] c = new Color[]{
        Color.BLUE,Color.PINK,Color.RED,Color.YELLOW,Color.GREEN
};

log.info("写数据到图片指定位置------------------");
for(int i = 0;i 

 二、创建vue脚手架前端项目,当页面加载的时候发送axios请求进行获取。

代码
created:function () {
      console.log(111111);
    axios.get("/api/dxq/getCode",{responseType: 'blob'}).then(res=>{
       console.log(res.data);
        console.log(window.URL.createObjectURL(res.data));
       this.codeUrl = window.URL.createObjectURL(res.data);
//       this.routers = res.data.data;
   }).catch(err=>{
       alert("查询出错!");
   });


  }

三、结果:

 

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/458475.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号