主要是生成数字和字母4位的二维码

我们会把生成的二维码放入到缓存中,有过期时间。当用二维码进行验证时需要根据key值拿到二维码的值,如果页面传过来的验证码和缓存中的一样,则说明验证码输入正确。

@RequestMapping(value = "/getImgCode")public void getImgCode(HttpServletRequest request, HttpServletResponse response, @RequestParam(defaultValue = "") String telephone) throws Exception {

    // 设置响应的类型格式为图片格式    response.setContentType("image/jpeg");    //禁止图像缓存。      response.setHeader("Pragma", "no-cache");    response.setHeader("Cache-Control", "no-cache");    response.setDateHeader("Expires", 0);    HttpSession session = request.getSession();

    ValidateCode vCode = new ValidateCode(140, 50, 4, 0);    String key = String.format(KConstants.Key.IMGCODE, telephone.trim());    SKBeanUtils.getRedisCRUD().set(key, vCode.getCode());    SKBeanUtils.getRedisCRUD().expire(key, 300);

    session.setAttribute("code", vCode.getCode());    // session.setMaxInactiveInterval(10*60);    System.out.println("getImgCode telephone ===>" + telephone + " code " + vCode.getCode());    vCode.write(response.getOutputStream());}
/**  *   * @param width 图片宽  * @param height 图片高  * @param codeCount 字符个数  * @param lineCount 干扰线条数  */  public  ValidateCode(int width,int height,int codeCount,int lineCount) {      this.width=width;      this.height=height;      this.codeCount=codeCount;      this.lineCount=lineCount;      this.createCode();  }  

public void createCode() {      int x = 0,fontHeight=0,codeY=0;      int red = 0, green = 0, blue = 0;  

    x = width / (codeCount);//每个字符的宽度      fontHeight = height -4;//字体的高度      codeY = height - 8;  

    // 图像buffer      buffImg = new BufferedImage(width, height,BufferedImage.TYPE_INT_RGB);      Graphics2D g = buffImg.createGraphics();      // 生成随机数      Random random = new Random();      // 将图像填充为白色      g.setColor(Color.WHITE);      g.fillRect(0, 0, width, height);      // 创建字体      ImgFontByte imgFont = new ImgFontByte();      Font font =imgFont.getFont(fontHeight);      g.setFont(font);  

    for (int i = 0; i < lineCount; i++) {          int xs = random.nextInt(width);          int ys = random.nextInt(height);          int xe = xs+random.nextInt(width/8);          int ye = ys+random.nextInt(height/8);          red = random.nextInt(255);          green = random.nextInt(255);          blue = random.nextInt(255);          g.setColor(new Color(red, green, blue));          g.drawLine(xs, ys, xe, ye);      }  

    // randomCode记录随机产生的验证码      StringBuffer randomCode = new StringBuffer();      // 随机产生codeCount个字符的验证码。      for (int i = 0; i < codeCount; i++) {          String strRand = String.valueOf(codeSequence[random.nextInt(codeSequence.length)]);          // 产生随机的颜色值,让输出的每个字符的颜色值都将不同。          red =0;          green = 0;          blue =0;          g.setColor(new Color(red, green, blue));          g.drawString(strRand, (i) * x, codeY);          // 将产生的四个随机数组合在一起。          randomCode.append(strRand);      }      // 将四位数字的验证码保存到Session中。      code=randomCode.toString();       }   

页面:这样的话就得到生成的二维码。
var url = "/getImgCode?telephone=" + account+"&timestamp=" + new Date().getTime();

$("#getImgCode").show();
$("#getImgCode").attr("src", url);

转载于:https://www.cnblogs.com/echo777/p/11549382.html

生成二维码接口,前端调用接口将二维码显示在页面上相关推荐

  1. JS前端调用TSC打印二维码、条码

    公司让用js调用TSC打印二维码,本人已调试成功,希望大家有所帮助! ActiveX下载地址:ActiveX下载地址! 实现代码:JS前端调用TSC打印二维码实现代码 <HTML> < ...

  2. 普歌-腾讯云短信+使用node发送短信(3种方法API、SDK)、封装工具、搭建web服务、写接口、调用接口发送短信、时效性判断、验证验证码的正确性(下)

    普歌-结合腾讯云短信服务+node搭建一个简单的发送短信web小项目 涉及技术: 腾讯云服务 后端服务:node+express 前端搭建:html+js 前言:本来这篇博客应该很早就发了,中间有一些 ...

  3. 链接生成动态二维码图片显示在页面上

    //引入jar包  core-3.3.0.jar  地址 http://jareye.com/jar/list.html?q=BarcodeFormat // js绑定二维码到页面 var url=& ...

  4. 根据接口文档书写接口,并在前端调用接口返回显示出数据(加下载)

    ---恢复内容开始--- 1.首先来看接口文档(其中一个接口): 接口的编写: 1 /** 2 * 7.11 余额明细查询接口3 *4 *@paramtoken5 *@parampageNum6 * ...

  5. axios请求接口http_axios调用接口

    axios调用接口 1. 按照axios npm install --save-dev axios 2.在main.js 引入axios, 设置全局属性$http 指向axios main.js im ...

  6. python发送短信接口_python 调用接口发短信

    调用接口发送短信 此处接口是移动云nas """ Create_of_date:2020-03-08 Author:nod description: 调用移动云mas接口 ...

  7. 顺丰快递查询接口的调用方法(附带源码)

    如何利用快递鸟提供的接口来查询顺丰快递的物流轨迹. 我们先来看一下,接口完成以后的实际显示效果 以下是产品应用截图, https://www.cnblogs.com/51api/p/12367728. ...

  8. 如何请求别人的接口(远程调用接口)

    httpclient作用 在java代码中,发送Http请求.通常用来实现远程接口调用. pom依赖 <dependency><groupId>commons-httpclie ...

  9. python页面调用接口_python调用接口——requests模块

    前提:安装pip install requests 导入import requests 1.get请求   result=requests.get(url,d).json()  或  .text 2. ...

最新文章

  1. 如何删除mac通用二进制文件
  2. 允许root远程登录Solaris
  3. ie6下js更新元素display:block后,仍然不显示的hack办法
  4. 原来这就是Java代码生成器的原理啊,太简单了
  5. 批量修改MSSQL架构名称
  6. 笔记-中项案例题-2019年下-人力资源管理和冲突管理
  7. nginx tomcat集群实现session共享
  8. php上传视频文件代码,php上传视频的代码
  9. Microsoft AI - Custom Vision in C#
  10. 前端学习(1170):findIndex
  11. python基础27 -----python进程终结篇-----IO模型
  12. c 宏变量/宏函数/log
  13. matlab回归分析sst_R语言 | 回归分析(一)
  14. 敏捷开发生态系统系列之一:序言及需求管理生态(客户价值导向-可工作软件-响应变化)...
  15. 汽车行业(车厂)常见英文缩写及其中文含义(不断完善中)
  16. 独家连载 | 深度学习“四大天王”,你知道几个?
  17. 用计算机处理表格说课稿,信息技术《电子表格的特点及应用》的说课稿
  18. 简单粗暴的动态气泡图
  19. 计算机u盘病毒清除方式,U盘如何格式化和清理病毒
  20. altium 去掉部分铺铜_DCS系统接地(四部分)

热门文章

  1. muduo网络库学习(九)日志类Logger和LogStream,将日志信息打印到屏幕
  2. aws beanstalk mysql_AWS Elastic Beanstalk
  3. CPU流水线的探秘之旅
  4. 华擎主板bios设置图解_华硕、华擎主板升级BIOS 支持全核5GHz处理器酷睿i99900KS
  5. 状态模式(c++实现)
  6. 如何QLayout内部的成员部件之间从左到右依次排列
  7. c++ primer 5th 练习11.38自己编写答案(用无序容器重写单词计数程序)
  8. 手写 单隐藏层神经网络_反向传播(Matlab实现)
  9. 深入浅出JSONP--解决ajax跨域问题
  10. ASP.NET 4 和 Visual Studio 2010 Web 开发概述