后端生成二维码，Base64后，前端直接使用

开放中，可能会遇到生成二维码的时候，这个时候，可以前端生成，也可以后端生成。

这时候，就可以看，把压力放在哪比较好。

当二维码信息比较小，或者前端迭代比较困难的时候（APP发布），就可以选择后端生成二维码。

二维码这种图片，一般比较小，可直接生成，要是再放到文件服务器，未免有些多余，不如直接返回给前端。

但是，如果返回文件流的话，前后端都不太好操作，并且可能因为网络原因，导致文件流损坏，但是Base64后，作为一个字段返回给前端，结构清晰，前端也好操作。

一.后端工具类

此工具类用到Hutool工具类和Google二维码包（zxing）

1.依赖

<dependency>
   <groupId>com.google.zxing</groupId>
   <artifactId>core</artifactId>
   <version>3.3.0</version>
</dependency>
<dependency>
   <groupId>com.google.zxing</groupId>
   <artifactId>javase</artifactId>
   <version>3.3.0</version>
</dependency>

<dependency>
   <groupId>cn.hutool</groupId>
   <artifactId>hutool-all</artifactId>
   <version>4.5.16</version>
</dependency>

import cn.hutool.core.codec.Base64;
import cn.hutool.core.img.ImgUtil;
import cn.hutool.extra.qrcode.QrCodeUtil;
import cn.hutool.extra.qrcode.QrConfig;

import java.awt.*;
import java.io.ByteArrayOutputStream;

/**
 * @author litong
 * @date 2019/10/14 18:14
 */
public class QRCodeUtil {

    /**
     * 生成二维码
     *
     * @param text 储存内容
     * @param width  宽度
     * @param height  高度
     * @return
     */
    public static String getQRCodeBase64(String text, int width, int height) {
        QrConfig config = new QrConfig(width, height);
        // 设置边距，既二维码和背景之间的边距
        config.setMargin(1);
        // 设置前景色，既二维码颜色（青色）
        config.setForeColor(Color.BLACK.getRGB());
        // 设置背景色（灰色）
        config.setBackColor(Color.WHITE.getRGB());
        // 生成二维码到文件，也可以到流
        ByteArrayOutputStream outputStream = new ByteArrayOutputStream();
        QrCodeUtil.generate(text, config, ImgUtil.IMAGE_TYPE_PNG, outputStream);
        byte[] pngData = outputStream.toByteArray();
        // 这个前缀，可前端加，可后端加，不加的话，不能识别为图片
        return "data:image/png;base64," + Base64.encode(pngData);
    }

    /**
     * 生成二维码
     *
     * @param text 储存内容
     * @param config 自定义配置
     * @return
     */
    public static String getQRCodeBase64(String text, QrConfig config) {
        // 生成二维码到文件，也可以到流
        ByteArrayOutputStream outputStream = new ByteArrayOutputStream();
        QrCodeUtil.generate(text, config, ImgUtil.IMAGE_TYPE_PNG, outputStream);
        byte[] pngData = outputStream.toByteArray();
        return "data:image/png;base64," + Base64.encode(pngData);
    }


    public static void main(String[] args) {
        QrConfig config = new QrConfig(100, 100);
        // 设置边距，既二维码和背景之间的边距
        config.setMargin(3);
        // 设置前景色，既二维码颜色（青色）
        config.setForeColor(Color.CYAN.getRGB());
        // 设置背景色（灰色）
        config.setBackColor(Color.GRAY.getRGB());
        // 生成二维码到文件，也可以到流
        ByteArrayOutputStream outputStream = new ByteArrayOutputStream();
        QrCodeUtil.generate("wawaw", config, ImgUtil.IMAGE_TYPE_PNG, outputStream);
        byte[] pngData = outputStream.toByteArray();
        System.out.println(Base64.encode(pngData));
    }
}

二.前端显示

前端可直接显示

<img src="data:image/png;base64,iVBORwAANSU......VORK5CYII=" />