jquery.qrcode.js 是一个能够在客户端生成矩阵二维码QRCode 的jquery插件 ,使用它可以很方便的在页面上生成二维条码。此插件是能够独立使用的,体积也比较小,使用gzip压缩后才不到4kb。因为它是直接在客户端生成的条码, 所以不会有图片下载的过程,能够实现快速生成。它是基于一个多语言的类库封装的,也不依赖于其他额外的服务。
好处:使用jquery-qrcode的好处,不需要在服务器端生成多余的二维码图片,二维码直接通过JavaScript直接在客户端生成,有效减少带宽,以及维护成本。
官网上的 qrcode.js 文件里没有实现中文的支持和LOGO的添加,现在我们将这个文件修改为jquery.qrcode.js文件了。此外还需要一个对中文进行转码的文件,该文件为utf.js。然后在 jquery.qrcode.js 文件中调用了 utf.js 文件的 utf16to8(str) 方法对其中文进行了转码。
实现的代码如下:
<div id="qr-code" class="qr-code">
<img id="qrCodeIco" style="display: none;" src="./image/chs@3x.png" alt="">
</div>
//生成二维码
$('#qr-code').qrcode("http://www.baidu.com");
$("#qr-code canvas")[0].getContext('2d').drawImage($("#qrCodeIco")[0], 100, 100, 65, 65);