找到了一个不错的二维码生成库,这个生成库可以自定义一些属性去生成想要的样式的二维码,我这里生成一个类似于企业微信二维码的样式的二维码。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="easy.qrcode.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<!--二维码容器-->
<div id="qrcode"></div>
<!--调用-->
<script type="text/javascript">
var options = {
text: "https://segmentfault.com/", // 内容
colorDark : "#000000", // 暗色
colorLight : "#ffffff", // 亮色
correctLevel : QRCode.CorrectLevel.H, // 容错等级
dotScale: 0.6, // 信息点缩放比例
dotScaleTiming: 0.6, // 信息点缩放比例
dotScaleTiming_H: 0.6, // 信息点缩放比例
dotScaleTiming_V: 0.6, // 信息点缩放比例
dotScaleA: 0.6, // 信息点缩放比例
dotScaleAO: 0.6, // 信息点缩放比例
dotScaleAI: 0.6, // 信息点缩放比例
logo: "logo.png", // logo
logoWidth: 50, // logo宽度
logoHeight: 50, // logo高度
};
new QRCode(document.getElementById("qrcode"), options);
</script>
</body>
</html>
开源地址:https://github.com/ushelp/EasyQRCodeJS
使用示例:https://www.easyproject.cn/easyqrcodejs/tryit.html
企业微信二维码样式的特点
特点就是信息点比较小,比较密集,通过控制 Dot Scale
的值就可以让信息点变得很小、很密集,这个值叫做缩放比例。
生成结果:
easy.qrcode.min.js下载
推荐使用npm下载
npm install easyqrcodejs
下载后就会在 node_modules\easyqrcodejs\dist
里找到。
本文作者
TANKING
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。