使用jquery.qrcode.min.js实现中文转化二维码_jquery
程序员文章站
2022-03-08 22:10:46
...
今天还是要讲一下关于二维码的知识,前几篇讲解中有讲到我使用的可以生成二维码的js是qrcode.js,然后结合Cordovad的插件$cordovaBarcodeScanner插件可以扫描二维码,这样就基本完成了简单的扫一扫功能。后来在项目进行,开始要调用后台数据和传参数到接口的时候发现qrcode.js它只能解析英文或者数字,并且只能解析一个字符串!
而我所需要的是将一个对象转化成二维码,然后在扫描的时候取出对象中的数据,显然qrcode.js不能实现,经过查找,找到另一个jquery.qrcode.min.js(支持中文转化二维码).
下面让我来介绍一下具体的步骤和代码实现吧!
一、这是我找到的jquery.qrcode.min.js(支持中文转化二维码)代码,需要引入到你的项目里去:
/** * Created by ncloud on 16/3/8. */ //jquery.qrcode.min.js (function (r) { r.fn.qrcode = function (h) { var s; function u(a) { this.mode = s; this.data = a } function o(a, c) { this.typeNumber = a; this.errorCorrectLevel = c; this.modules = null; this.moduleCount = 0; this.dataCache = null; this.dataList = [] } function q(a, c) { if (void 0 == a.length) throw Error(a.length + "/" + c); for (var d = 0; d a || this.moduleCount c || this.moduleCount this.typeNumber) { for (var a = 1, a = 1; 40 > a; a++) { for (var c = p.getRSBlocks(a, this.errorCorrectLevel), d = new t, b = 0, e = 0; e = d; d++) if (!(-1 >= a + d || this.moduleCount = b; b++)-1 >= c + b || this.moduleCount = d && (0 == b || 6 == b) || 0 = b && (0 == d || 6 == d) || 2 = d && 2 = b ? !0 : !1) }, getBestMaskPattern: function () { for (var a = 0, c = 0, d = 0; 8 > d; d++) { this.makeImpl(!0, d); var b = j.getLostPoint(this); if (0 == d || a > b) a = b, c = d } return c }, createMovieClip: function (a, c, d) { a = a.createEmptyMovieClip(c, d); this.make(); for (c = 0; c = f; f++) for (var i = -2; 2 >= i; i++) this.modules[b + f][e + i] = -2 == f || 2 == f || -2 == i || 2 == i || 0 == f && 0 == i ? !0 : !1 } }, setupTypeNumber: function (a) { for (var c = j.getBCHTypeNumber(this.typeNumber), d = 0; 18 > d; d++) { var b = !a && 1 == (c >> d & 1); this.modules[Math.floor(d / 3)][d % 3 + this.moduleCount - 8 - 3] = b } for (d = 0; 18 > d; d++) b = !a && 1 == (c >> d & 1), this.modules[d % 3 + this.moduleCount - 8 - 3][Math.floor(d / 3)] = b }, setupTypeInfo: function (a, c) { for (var d = j.getBCHTypeInfo(this.errorCorrectLevel b; b++) { var e = !a && 1 == (d >> b & 1); 6 > b ? this.modules[b][8] = e : 8 > b ? this.modules[b + 1][8] = e : this.modules[this.moduleCount - 15 + b][8] = e } for (b = 0; 15 > b; b++) e = !a && 1 == (d >> b & 1), 8 > b ? this.modules[8][this.moduleCount - b - 1] = e : 9 > b ? this.modules[8][15 - b - 1 + 1] = e : this.modules[8][15 - b - 1] = e; this.modules[this.moduleCount - 8][8] = !a }, mapData: function (a, c) { for (var d = -1, b = this.moduleCount - 1, e = 7, f = 0, i = this.moduleCount - 1; 0 g; g++) if (null == this.modules[b][i - g]) { var n = !1; f >> e & 1)); j.getMask(c, b, i - g) && (n = !n); this.modules[b][i - g] = n; e--; -1 == e && (f++, e = 7) } b += d; if (0 > b || this.moduleCount 8 * a) throw Error("code length overflow. (" + b.getLengthInBits() + ">" + 8 * a + ")"); for (b.getLengthInBits() + 4 = 8 * a); ) { b.put(o.PAD0, 8); if (b.getLengthInBits() >= 8 * a) break; b.put(o.PAD1, 8) } return o.createBytes(b, c) }; o.createBytes = function (a, c) { for (var d = 0, b = 0, e = 0, f = Array(c.length), i = Array(c.length), g = 0; g >>= 1; return c }, getPatternPosition: function (a) { return j.PATTERN_POSITION_TABLE[a - 1] }, getMask: function (a, c, d) { switch (a) { case 0: return 0 == (c + d) % 2; case 1: return 0 == c % 2; case 2: return 0 == d % 3; case 3: return 0 == (c + d) % 3; case 4: return 0 == (Math.floor(c / 2) + Math.floor(d / 3)) % 2; case 5: return 0 == c * d % 2 + c * d % 3; case 6: return 0 == (c * d % 2 + c * d % 3) % 2; case 7: return 0 == (c * d % 3 + (c + d) % 2) % 2; default: throw Error("bad maskPattern:" + a); } }, getErrorCorrectPolynomial: function (a) { for (var c = new q([1], 0), d = 0; d c) switch (a) { case 1: return 10; case 2: return 9; case s: return 8; case 8: return 8; default: throw Error("mode:" + a); } else if (27 > c) switch (a) { case 1: return 12; case 2: return 11; case s: return 16; case 8: return 10; default: throw Error("mode:" + a); } else if (41 > c) switch (a) { case 1: return 14; case 2: return 13; case s: return 16; case 8: return 12; default: throw Error("mode:" + a); } else throw Error("type:" + c); }, getLostPoint: function (a) { for (var c = a.getModuleCount(), d = 0, b = 0; b = g; g++) if (!(0 > b + g || c = h; h++) 0 > e + h || c a) throw Error("glog(" + a + ")"); return l.LOG_TABLE[a] }, gexp: function (a) { for (; 0 > a; ) a += 255; for (; 256 m; m++) l.EXP_TABLE[m] = 1 m; m++) l.EXP_TABLE[m] = l.EXP_TABLE[m - 4] ^ l.EXP_TABLE[m - 5] ^ l.EXP_TABLE[m - 6] ^ l.EXP_TABLE[m - 8]; for (m = 0; 255 > m; m++) l.LOG_TABLE[l.EXP_TABLE[m]] = m; q.prototype = { get: function (a) { return this.num[a] }, getLength: function () { return this.num.length }, multiply: function (a) { for (var c = Array(this.getLength() + a.getLength() - 1), d = 0; d this.getLength() - a.getLength()) return this; for (var c = l.glog(this.get(0)) - l.glog(a.get(0)), d = Array(this.getLength()), b = 0; b >> 7 - a % 8 & 1) }, put: function (a, c) { for (var d = 0; d >> c - d - 1 & 1)) }, getLengthInBits: function () { return this.length }, putBit: function (a) { var c = Math.floor(this.length / 8); this.buffer.length >> this.length % 8); this.length++ } }; "string" === typeof h && (h = { text: h }); h = r.extend({}, { render: "canvas", width: 256, height: 256, typeNumber: -1, correctLevel: 2, background: "#ffffff", foreground: "#000000" }, h); return this.each(function () { var a; if ("canvas" == h.render) { a = new o(h.typeNumber, h.correctLevel); a.addData(h.text); a.make(); var c = document.createElement("canvas"); c.width = h.width; c.height = h.height; for (var d = c.getContext("2d"), b = h.width / a.getModuleCount(), e = h.height / a.getModuleCount(), f = 0; f ").css("width", h.width + "px").css("height", h.height + "px").css("border", "0px").css("border-collapse", "collapse").css("background-color", h.background); d = h.width / a.getModuleCount(); b = h.height / a.getModuleCount(); for (e = 0; e ").css("height", b + "px").appendTo(c); for (i = 0; i ").css("width", d + "px").css("background-color", a.isDark(e, i) ? h.foreground : h.background).appendTo(f) } } a = c; jQuery(a).appendTo(this) }) } })(jQuery);
二、HTML代码,与之前的不同,修改了一些代码:
(二维码)
三、JS代码,这里需要将信息转化一下utf16转化为utf8格式,才能实现转化为二维码,我是将一个对象转化的:
function utf16to8(str) { var out, i, len, c; out = ""; len = str.length; for (i = 0; i = 0x0001) && (c 0x07FF) { out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F)); out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F)); out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F)); } else { out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F)); out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F)); } } return out; } //{name: currentUser.UserName, id: currentUser.Id}这个是我需要转化的对象,也是我在扫描二维码的时候需要解析出来的内容 $(function () { jQuery('#Qrcode').qrcode(utf16to8(angular.toJson({name: currentUser.UserName, id: currentUser.Id}))) });
至于怎么将二维码保存到手机,我之前的文章中有讲到的,如果想实现的话可以参考一下~
好了,具体实现的步骤就是这样了,大家可以提意见或者参考一下!
上一篇: Python接口使用OpenCV的方法
下一篇: Java开发中的23种设计模式详解