二维码是一个近几年来移动设备上超流行的一种编码方式,最早出现在20世纪20年代,到1988年才引入中国。现在,日常生活中更是随处可见。它比传统的Bar Code条形码能存更多的信息,也能表示更多的数据类型。它具有条码技术的一些共性:每种码制有其特定的字符集;每个字符占有一定的宽度;具有一定的校验功能等。同时还具有对不同行的信息自动识别功能、及处理图形旋转变化点。下面通过一些小案例,不靠第三方平台,轻松制作自己的二维码图片。网上有很多教程,本次记录只是为了填充下小站内容,欢迎指教!
文章源自亦枫博客-https://yflad.cn/1842.html
前面介绍,可直接跳到第三个目录文章源自亦枫博客-https://yflad.cn/1842.html
文章源自亦枫博客-https://yflad.cn/1842.html
利与弊
文章源自亦枫博客-https://yflad.cn/1842.html
QRCode
QR Code码,是由Denso公司于1994年9月研制的一种矩阵二维码符号,它具有一维条码及其它二维条码所具有的信息容量大、可靠性高、可表示汉字及图象多种文字信息、保密防伪性强等优点。文章源自亦枫博客-https://yflad.cn/1842.html
超高速文章源自亦枫博客-https://yflad.cn/1842.html
从QR Code码的英文名称Quick Response Code可以看出,超高速识读特点是QR Code码区别于四一七条码、Data Matrix等二维码的主要特性。由于在用CCD识读QR Code码时,整个QR Code码符号中信息的读取是通过QR Code码符号的位置探测图形,用硬件来实现,因此,信息识读过程所需时间很短,它具有超高速识读特点。用CCD二维条码识读设备,每秒可识读30个含有100个字符的QR Code码符号;对于含有相同数据信息的四一七条码符号,每秒仅能识读3个符号;对于Data Matrix矩阵码,每秒仅能识读2~3个符号。QR Code码的超高速识读特性使它能够广泛应用于工业自动化生产线管理等领域。文章源自亦枫博客-https://yflad.cn/1842.html
全方位文章源自亦枫博客-https://yflad.cn/1842.html
QR Code码具有全方位(360°)识读特点,这是QR Code码优于行排式二维条码如四一七条码的另一主要特点,由于四一七条码是将一维条码符号在行排高度上的截短来实现的,因此,,它很难实现全方位识读,其识读方位角仅为±10°。文章源自亦枫博客-https://yflad.cn/1842.html
能够有效地表示汉字文章源自亦枫博客-https://yflad.cn/1842.html
由于QR Code码用特定的数据压缩模式表示汉字,它仅用13bit可表示一个汉字,而四一七条码、Data Matrix等二维码没有特定的汉字表示模式,因此仅用字节表示模式来表示汉字,在用字节模式表示汉字时,需用16bit(二个字节)表示一个汉字,因此QR Code码比其它的二维条码表示汉字的效率提高了20%。文章源自亦枫博客-https://yflad.cn/1842.html
——摘自《百度百科》文章源自亦枫博客-https://yflad.cn/1842.html
文章源自亦枫博客-https://yflad.cn/1842.html
文章源自亦枫博客-https://yflad.cn/1842.html
前期准备
1、PHP环境
windows 有 [code]WampServer[/code],[code]phpStudy[/code],[code]PHPWAMP[/code]...
MAC 有 [code]MAMP Pro[/code]...
推荐用上面的集成环境好些,可以省好多配置时间
2、GD库
大部分的集成环境都是默认开启GD的,如何查看:新建一个PHP文件,粘贴[code] phpinfo(); [/code] 运行,搜索gd,当看到 enabled 即表示开启
3、下载 PHP QRCode
网址:https://sourceforge.net/projects/phpqrcode/files/releases/
PHP QRCode实例 一
1、解压缩包,新建一个PHP文件
QRCode生成二维码可以说是非常简单,两行代码即可搞定:
- <?php
- // 引入 PHP QRCode
- include "./phpqrcode/qrlib.php";
- // 生成 Yflad
- QRcode::png('Yflad');
运行,即可看到一个二维码
如果你想自定义二维码的长宽等信息,在 QRCode 下的png方法,有如下参数:
- png($text, $outfile = false, $level = QR_ECLEVEL_L, $size = 3, $margin = 4, $saveandprint=false)
它们的含义分别是:
- $text, // 生成的二维码 内容
- $outfile = false, // 生成的二维码 文件名,false为 不保存
- $level = QR_ECLEVEL_L, //级别,也是容错率。下面会有介绍
- $size = 3, //大小
- $margin = 4, //外边距
- $saveandprint=false //是否 保存和打印。true为保存并打印
如下代码,会生成一个名为 abc 的 .png 文件,保存并打印出来
- QRcode::png('Yflad', 'abc.png', QR_ECLEVEL_, 10, 2, true);
关于此处,应该是有个bug,如果你照我上面的代码写,应该是打印不出来的,参数没有传递出去
解决如下:打开在 phpqrcode 目录下的 qrencode.php 文件,去掉 286 行的[code]$saveandprint[/code] 后面的 [code]=false[/code]。完整代码如下:
- {
- $enc = QRencode::factory($level, $size, $margin);
- return $enc->encodePNG($text, $outfile, $saveandprint);
- }
这时候在刷新页面,就可以显示了。
关于 $level
参数$level表示容错率,也就是有被覆盖的区域还能识别。它有四个级别,分别是 L, H, M, Q
[code]QR_ECLEVEL_L,[/code] 最大 7% 的错误能够被纠正;
[code]QR_ECLEVEL_M,[/code] 最大 15% 的错误能够被纠正;
[code]QR_ECLEVEL_Q,[/code] 最大 25% 的错误能够被纠正;
[code]QR_ECLEVEL_H,[/code] 最大 30% 的错误能够被纠正;
jquery 生成 QRCode实例 二
jquery 对比 PHP 的好处是极少占用服务器的资源。
新建一个 HTML 页面,粘贴以下代码:
已标明注释
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>Title</title>
- <meta name="author" content="yflad, yflad@qq.com, https://yflad.cn"/>
- </head>
- <body>
- <!--创建一个DOM元素,包含生成的qrcode图像。-->
- <div id="qrcode"></div>
- <!--引入 jquery-->
- <script src="//cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
- <!--引入托管 qrcode-->
- <script src="https://cdn.bootcss.com/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>
- <script>
- // 生成二维码,设置宽、高,内容
- $('#qrcode').qrcode({width: 100,height: 100,text: "这是一个二维码"});
- </script>
- </body>
- </html>
如果不想使用第三方托管,可以下载 jquery 文件。地址:https://github.com/jeromeetienne/jquery-qrcode
注释掉引入托管 qrcode,并引入本地 js
- <!--引入 qrcode-->
- <script src="jquery-qrcode-master/jquery.qrcode.min.js"></script>
生成 QRCode实例 三
QRCode.js 是一个用于生成二维码图片的插件。
下载 QRCode.js。地址:https://github.com/davidshimjs/qrcodejs
新建一个 HTML 页面,粘贴以下代码:
相关代码已注释
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>Title</title>
- <meta name="author" content="yflad, yflad@qq.com, https://yflad.cn"/>
- <script type="text/javascript" src="qrcodejs-master/jquery.min.js"></script>
- <!-- 引入 qrcode -->
- <script type="text/javascript" src="qrcodejs-master/qrcode.js"></script>
- </head>
- <body>
- <!--创建一个DOM元素,包含生成的qrcode图像。-->
- <div id="qrcode"></div>
- <!--调用-->
- <script>
- new QRCode(document.getElementById("qrcode"), "这是一个二维码");
- </script>
- </body>
- </html>
QRCode.js 扩展 一
自定义QRCodejs 的一些参数,已经标明相关注释
- <script>
- var qrcode = new QRCode(document.getElementById("qrcode"), { // 显示二维码的元素或该元素的 ID
- text: "https://yflad.cn/", // 内容可以是文字,链接,邮箱
- width: 150, //设置宽度
- height: 150, // 设置高度
- colorDark : "#0774ab", // 设置前景色
- colorLight : "#c0c1c1", // 设置背景色
- correctLevel : QRCode.CorrectLevel.L // 设置容错级别,上面有介绍
- });
- </script>
QRCode.js 扩展 二
做一个小例子
CSS代码:
- <style type="text/css">
- .form {
- width: 450px;
- height: 400px;
- margin: 0px auto;
- border: 1px solid #f00;
- }
- .form dl.row:after{
- visibility:hidden;
- display:block;
- clear:both;
- height:0;
- font-size:0;
- }
- .form dl.row dt{
- float:left;
- clear:left;
- position:relative;
- width:5em;
- line-height:20px;
- text-align:rightright;
- }
- .form dl.row dd{
- position:relative;
- margin-left:6em;
- }
- </style>
HTML代码:
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>Title</title>
- <meta name="author" content="yflad, yflad@qq.com, https://yflad.cn"/>
- <script type="text/javascript" src="qrcodejs-master/jquery.min.js"></script>
- <!-- 引入 qrcode -->
- <script type="text/javascript" src="qrcodejs-master/qrcode.js"></script>
- </head>
- <body>
- <div class="form">
- <dl class="row">
- <dt>输入内容: </dt>
- <dd><input type="text" id="qrcode_text" class="input" placeholder="支持文本、网址和电子邮箱..." size="30"></dd>
- </dl>
- <dl class="row">
- <dt>预览: </dt>
- <dd>
- <div id="qrcode"></div>
- </dd>
- </dl>
- </div>
- <script>
- (function() {
- var qrcode = new QRCode('qrcode');
- $('#qrcode_text').on('change', function() {
- qrcode.makeCode(this.value);
- });
- })();
- </script>
- </body>
- </html>
注意文件的引入路径
可以测试下:
- 在这个框内输入内容,然后鼠标点下其它地方:
- 预览:
PHP 生成电子名片 实例 四
电子名片在我们生活中很少用到,主要就是方便别人加下你的联系信息。不用手打,或者复制,扫描下确认即可。
如同上面的 [code] PHP QRCode实例 一 [/code] 新建一个 PHP 页面,引入 [code]qrlib.php[/code]
粘贴以下代码:
- <?php
- include "./phpqrcode/qrlib.php"; // 引入
- $content = 'BEGIN:VCARD'."\n";
- $content .= 'VERSION:2.1'."\n";
- $content .= 'N:亦'."\n"; // 姓
- $content .= 'FN:枫'."\n"; //名
- $content .= 'ORG:北京富康大道'."\n"; //公司地址
- $content .= 'TITLE:CEO'."\n"; //职位
- $content .= 'TEL;WORK;VOICE:13988889999'."\n"; //工作单位电话
- $content .= 'TEL;HOME;VOICE:730555222'."\n"; //家里电话
- $content .= 'TEL;TYPE=Cell:13899996666'."\n"; //移动电话
- $content .= 'ADR;HOME:;;瑶海区;合肥市;安徽省;230000;中国'."\n"; //家庭住址
- $content .= 'EMAIL:yflad@qq.com'."\n"; //邮箱
- $content .= 'URL:https://yflad.cn'."\n"; //网址
- $content .= 'END:VCARD'."\n"; //结束标记
- QRcode::png($content); // 打印
需要注意的是,微信扫描可以正常添加。当用QQ扫描时,“名”会显示不出来。我不知道是不是我手机的缘故,如果你也是这种情况的话,可以注释掉【FN】这行,直接在姓打上全称。有兴趣的可以测试下。根据自己需要有选择的填写就行,也可以自己根据 [code]QRCode.js 扩展 二[/code] 集成个API
总结
这篇文章花了我差不多大半天的时间整理,演示。现在已经快到凌晨三点了,写到这忍不住伸个懒腰,虽然网上类似的文章很多,但当自己亲自整理记录下来时,才感觉到很舒心,记忆也更加深刻。以前觉得时间过的好慢,但当你认真投入一件事情的时候,时间真的不够用。从寒假来,每天坐在电脑前,不觉时间在流逝,只是老妈或者老爸来叫我起来活动会、吃饭,哈哈!我都想不到现在自己会这么用功,自恋下。嘿嘿!!!
希望这篇文章也能帮助下需要的人,我也是个小白,所以不要我问些高深的问题了。欢迎下方留言探讨,欢迎大神指点!
小站集成的二维码工具,欢迎测试使用!
广东省惠州市 3F
我进入的不是PHPqrcode这个PHP文件而是qrcode这个文件 然后根据你说的把false去掉 出来的是空白图片也没生成文件,想问下楼主咋回事 打扰了
云南省 2F
请问用phpqrcode的png函数生成时,想让第一个参数$text是数据库调出来的内容应该怎么设置呢?从数据库调出来的东西用一个$result表示,也就是说第一个参数不放具体文本,放一个数组?感谢!
B1
@ Jane 我没试过。很抱歉帮不到你,建议看看官方的文档//phpqrcode.sourceforge.net/
湖北省武汉市 B2
@ 亦枫 result是拿sql查出来的,直接把第一个参数写成’$result’,扫了之后就是$result,不能这么干 感谢回复!
江苏省常州市 1F
还是弄不明白~!
B1
@ pigceo 有兴趣的话,可以多百度看看。没兴趣权当了解呗