java生成二维码—web方式

骑电动车的小黄

已于 2023-05-03 10:19:28 修改

阅读量1.2k

点赞数 2

分类专栏： JAVA 文章标签：前端 java javascript

于 2023-02-13 22:34:25 首次发布

本文链接：https://blog.youkuaiyun.com/qq_38258642/article/details/129018485

版权

JAVA 专栏收录该内容

3 篇文章

订阅专栏

文章描述了一个使用Vue.js前端框架结合后端Java接口生成二维码的过程。用户在文本框输入字符，点击按钮后，前端调用后台接口，将数据转化为二维码的base64字符串，然后在页面上显示二维码图片。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

呈现效果

在文本框中输入字符，点击生成二维码按钮，调用后台生成二维码接口生成二维码并返回二维码 base64字符串，字符串中信息添加到 img标签 src属性中即可显示二维码图片。

前端代码实现

vue 文件代码

主要还是以实现功能为主，就没有做任何布局和美化

<template>
    <div>
        <inputtype="text"v-model="qrCodeText"><buttontype="button" @click="clickGetCode()">生成二维码</button>
        <img:src="'data:image/png;base64,'+ this.base64QrCode"style="width: 20vw;">
    </div>
</template>
<script>
import { getQrCode } from'@/api/downloadDoc/index'// 引入接口exportdefault {
  name: 'QrCode',
  data () {
    return {
      qrCodeText: '',
      base64QrCode: ''
    }
  },
  // 2、添加自定义组件components: {
  },
  // 初始化调用方法
  created () {

  },
  methods: {
    clickGetCode () {
      // 调用后台接口生成二维码getQrCode(this.qrCodeText).then(data => {
        // 返回的字符串赋值给 src 属性绑定的变量this.base64QrCode = data
      })
    }

  }
}
</script>

请求后台代码

import request from'../http'// 使用实例

export functiongetQrCode (qrCodeText) {
  returnrequest({
    url: '/ming/getQrCode?qrCodeText=' + qrCodeText,
    method: 'get'
  })
}

后端代码实现

后端代码实现请参考之前文章： java生成二维码图片、转base64 - 掘金 (juejin.cn)
需要注意的是之前文章是直接写死的硬编码，这里是需要提供接口给前端，之前是介绍了两种方法生成二维码，这里需要使用的是第一种方法转 base64之后把字符串返回给前端。以下是修改过后的代码可供参考：

@RequestMapping("/getQrCode")
publicStringgetQrCode(@RequestParam String qrCodeText){
    String base64 = "";
    // 需要生成的二维码的文字、地址String QrCodeStr = qrCodeText;
    // 创建二维码try {
        Map<EncodeHintType, String> charcter = new HashMap<>();
        // 设置字符集
        charcter.put(EncodeHintType.CHARACTER_SET, "UTF-8");
        // 设置二维码的四个参数   需要生成的字符串，类型设置为二维码，二维码宽度，二维码高度，字符串字符集
        BitMatrix bitMatrix = newMultiFormatWriter()
                .encode(QrCodeStr, BarcodeFormat.QR_CODE, 500, 500, charcter);
        // 二维码像素，也就是上面设置的 500int width = bitMatrix.getWidth();
        int height = bitMatrix.getHeight();
        // 创建二维码对象
        BufferedImage image = newBufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
        for (int x = 0; x < width; x++) {
            for (int y = 0; y < height; y++) {
                // 按照上面定义好的二维码颜色编码生成二维码
                image.setRGB(x, y, bitMatrix.get(x, y) ? BLACK : WHITE);
            }
        }
        // 1、第一种方式// 生成的二维码图片对象转 base64
        ByteArrayOutputStream stream = newByteArrayOutputStream();
        // 设置图片的格式
        ImageIO.write(image, "png", stream);
        // 生成的二维码base64
        base64 = Base64.encode(stream.toByteArray());
    } catch (Exception e) {
        e.printStackTrace();
    }
    return base64;
}