前言

生成二维码的方式有很多种,你可以把资源消耗放在客户端使用一些前端的二维码生成组件,如果想要存储一些生成二维码的操作日志就可以使用到服务端的二维码工具。最近业务需要并且领导也想要一点花样的二维码对其研究了一些,和大家分享一下。

前端

Jquery的qrcode

Jquery提供了简单二维码的生成,满足无特殊需求的开发者制作简单的二维码,使用也是相当简单。

  1. 引入js,如果你没下载到本地,也可以使用云端的js,链接:https://cdn.bootcss.com/jquery.qrcode/1.0/jquery.qrcode.min.js
1
2
<script src="jquery.min.js"></script>
<script type="text/javascript" src="jquery.qrcode.min.js"></script>
  1. 创建Dom元素
1
<div id="qrcode"></div>
  1. js编写代码生成二维码
1
2
3
4
5
<script>
jQuery(function(){
jQuery('#qrcode').qrcode("https://www.baidu.com/");
});
</script>

除此之外还有许多其他进阶的用法,如一些大小样式调整等。

qrbtf

一款开源的艺术二维码生成器,支持vue,【官方网站】、【Github】,如果你只想使用Javascript版本的可以试试第三方魔改的qrbtf,使用也是方便,不过如果要修改其相关样式还是比较困难的(特别是三个信息点个人感觉有点大)。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
// 通过script 引入
<script src="./dist/beautifyQrcode.js"></script>

<script>
// 选择性引入对应方法
const {
encodeData,
renderer25D,
rendererRect,
rendererRound,
rendererRandRound,
rendererDSJ,
rendererRandRect,
rendererImage,
rendererResImage,
} = window.beautifyQrcode;

// 根据文档传递参数调用对应的方法生成二维码即可,比如
/**
* 生成二维码数据
* @param {Object} options
* @param {String} options.text 二维码内容
* @param {Number} [options.width] 生成svg的宽度 默认100%
* @param {Number} [options.height] 生成svg的高度 默认100%
* @param {Number} [options.correctLevel] 容错率 1=>7% 0 =>15% 3=>25% 2=>30%
* @param {Boolean} [options.isSpace] 生成内容是否预留空隙 默认true
*/
const qrcode = encodeData({
text: "test",
correctLevel: 0,
});
/**
* A1
* @param {Object} qrcode
* @param {Object} options
* @param {Number} [options.type] 信息点样式 0=>矩形 1=>圆形,2=>随机
* @param {Number} [options.size] 信息点缩放
* @param {String} [options.opacity] 信息点不透明度
* @param {String} [options.posType] 定位点样式 0=>矩形 1=>圆形 2=>行星
* @param {String} [options.otherColor] 信息点颜色
* @param {String} [options.posColor] 定位点点颜色
* @return {String} svg图片
*/
const A1 = rendererRect(qrcode);
</script>

后端

ZXing

ZXing,一个支持在图像中解码和生成条形码(如二维码、PDF 417、EAN、UPC、Aztec、Data Matrix、Codabar)的库。ZXing(“zebra crossing”)是一个开源的、多格式的、用Java实现的一维/二维条码图像处理库,具有到其他语言的端口。

  1. 使用引入Maven
1
2
3
4
5
6
7
8
9
10
11
<!-- ZXing -->
<dependency>
<groupId>com.google.zxing</groupId>
<artifactId>core</artifactId>
<version>3.3.3</version>
</dependency>
<dependency>
<groupId>com.google.zxing</groupId>
<artifactId>javase</artifactId>
<version>3.3.3</version>
</dependency>
  1. 使用
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
public class Test{

public static void main(String[] args) {
try {
QREncode();
QRReader(new File("D:\\zxing1.gif"));
} catch (WriterException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
} catch (NotFoundException e) {
e.printStackTrace();
}
}

/**
* 生成二维码
*/
public static void QREncode() throws WriterException, IOException {
String content = "test";//二维码内容
int width = 200; // 图像宽度
int height = 200; // 图像高度
String format = "gif";// 图像类型
Map<EncodeHintType, Object> hints = new HashMap<>();
//内容编码格式
hints.put(EncodeHintType.CHARACTER_SET, "UTF-8");
// 指定纠错等级
hints.put(EncodeHintType.ERROR_CORRECTION, ErrorCorrectionLevel.H);
//设置二维码边的空度,非负数
hints.put(EncodeHintType.MARGIN, 1);
BitMatrix bitMatrix = new MultiFormatWriter().encode(content, BarcodeFormat.QR_CODE, width, height, hints);
MatrixToImageWriter.writeToPath(bitMatrix, format, new File("D:\\zxing.gif").toPath());// 输出原图片
MatrixToImageConfig matrixToImageConfig = new MatrixToImageConfig(0xFF000001, 0xFFFFFFFF);
/*
问题:生成二维码正常,生成带logo的二维码logo变成黑白
原因:MatrixToImageConfig默认黑白,需要设置BLACK、WHITE
解决:https://ququjioulai.iteye.com/blog/2254382
*/
BufferedImage bufferedImage = LogoMatrix(MatrixToImageWriter.toBufferedImage(bitMatrix,matrixToImageConfig), new File("D:\\logo.png"));
ImageIO.write(bufferedImage, "gif", new File("D:\\zxing1.gif"));//输出带logo图片
System.out.println("输出成功.");
}

/**
* 识别二维码
*/
public static void QRReader(File file) throws IOException, NotFoundException {
MultiFormatReader formatReader = new MultiFormatReader();
//读取指定的二维码文件
BufferedImage bufferedImage =ImageIO.read(file);
BinaryBitmap binaryBitmap= new BinaryBitmap(new HybridBinarizer(new BufferedImageLuminanceSource(bufferedImage)));
//定义二维码参数
Map hints= new HashMap<>();
hints.put(EncodeHintType.CHARACTER_SET, "utf-8");
com.google.zxing.Result result = formatReader.decode(binaryBitmap, hints);
//输出相关的二维码信息
System.out.println("解析结果:"+result.toString());
System.out.println("二维码格式类型:"+result.getBarcodeFormat());
System.out.println("二维码文本内容:"+result.getText());
bufferedImage.flush();
}

/**
* 二维码添加logo
* @param matrixImage 源二维码图片
* @param logoFile logo图片
* @return 返回带有logo的二维码图片
* 参考:https://blog.csdn.net/weixin_39494923/article/details/79058799
*/
public static BufferedImage LogoMatrix(BufferedImage matrixImage, File logoFile) throws IOException{
/**
* 读取二维码图片,并构建绘图对象
*/
Graphics2D g2 = matrixImage.createGraphics();

int matrixWidth = matrixImage.getWidth();
int matrixHeigh = matrixImage.getHeight();

/**
* 读取Logo图片
*/
BufferedImage logo = ImageIO.read(logoFile);

//开始绘制图片
g2.drawImage(logo,matrixWidth/5*2,matrixHeigh/5*2, matrixWidth/5, matrixHeigh/5, null);//绘制
BasicStroke stroke = new BasicStroke(5,BasicStroke.CAP_ROUND,BasicStroke.JOIN_ROUND);
g2.setStroke(stroke);// 设置笔画对象
//指定弧度的圆角矩形
RoundRectangle2D.Float round = new RoundRectangle2D.Float(matrixWidth/5*2, matrixHeigh/5*2, matrixWidth/5, matrixHeigh/5,20,20);
g2.setColor(Color.white);
g2.draw(round);// 绘制圆弧矩形

//设置logo 有一道灰色边框
BasicStroke stroke2 = new BasicStroke(1,BasicStroke.CAP_ROUND,BasicStroke.JOIN_ROUND);
g2.setStroke(stroke2);// 设置笔画对象
RoundRectangle2D.Float round2 = new RoundRectangle2D.Float(matrixWidth/5*2+2, matrixHeigh/5*2+2, matrixWidth/5-4, matrixHeigh/5-4,20,20);
g2.setColor(new Color(128,128,128));
g2.draw(round2);// 绘制圆弧矩形

g2.dispose();
matrixImage.flush() ;
return matrixImage ;
}
}

QuickMedia

QuickMedia项目,主要基于一些开源的项目实现复杂的图片、音频、视频、二维码等多媒体文件处理的二次封装类库,主要借助Builder模式简化各种复杂的调用方式,供使用者最低成本的实现开箱即用。

相比于ZXing,QuickMedia对其进行了封装,让使用者调用生成二维码接口更加简单,代码更加简洁。

  1. 使用
1
2
3
4
5
<dependency>
<groupId>com.github.liuyueyi.media</groupId>
<artifactId>qrcode-plugin</artifactId>
<version>2.5.3</version>
</dependency>
  1. 然后就是调用
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
/** 基本二维码 */
String msg = "http://weixin.qq.com/r/FS9waAPEg178rUcL93oH";
// 生成二维码,并输出为qr.png图片
boolean ans = QrCodeGenWrapper.of(msg).asFile("qr.png");

/** 带logo二维码生成 */
String msgLogo = "http://weixin.qq.com/r/FS9waAPEg178rUcL93oH";
// 这里的图片地址,支持网络图片,本地相对路劲图片,本地绝对路径图片
String logo = "https://static.oschina.net/uploads/user/283/566591_100.jpeg";
boolean ansLogo = QrCodeGenWrapper.of(msgLogo)
.setLogo(logo)
.setLogoStyle(QrCodeOptions.LogoStyle.ROUND)
.setLogoBgColor(0xfffefefe)
.setLogoBorderBgColor(0xffc7c7c7)
.setLogoBorder(true)
.asFile("/tmp/lqr3.png");

不仅如此,还可以指定背景,调整信息点、探测点样式等,这位大佬不仅仅是二维码,像音频那些也有组件,想要了解的朋友可以区看看,觉得不错的话可以给大佬一个Star

ps:因作者能力有限,有错误的地方请见谅

  • 喜欢这篇文章的话可以用快捷键 Ctrl + D 来收藏本页

最后更新: 2023年09月06日 15:52

原始链接: https://blog.hdqyf.club/2023/07/18/20230718-Java花式二维码生成/

× 请我吃糖~
打赏二维码