jquery plugin QRCode online generation of two-dimensional code

jquery plugin QRCode online generation of two-dimensional code

Jquery.qrcode is a powerful jquery plugin that can be used to render two-dimensional code graphics, used to generate two-dimensional code, very practical, and need a friend's reference.

With the development of mobile Internet, two-dimensional code is now more and more widely used, sweep can browse the site, add a friend or something, compared to the manual input is really convenient too much.

Early did a comprehensive evaluation system, consider the gradual realization of mobile, a long series of IP address user input is also inconvenient, with the help of two-dimensional code, the user picked up the phone sweep can be directly into the system.

Based on this application scenario, the Web site to study the implementation of two-dimensional code, summed up in the following two kinds:

1, with some two-dimensional code generation website or two-dimensional code generator to generate two-dimensional code picture, and then hang on the site, such as code cloud Qr-code (two-dimensional code) online generator

Advantages: The development cost is zero, can quickly realize a variety of two-dimensional code;

Disadvantage: Change the maintenance of two-dimensional code slightly trouble

2, in the back-end using Java or. NET code to generate two-dimensional code pictures, and then refer to the Web site pictures, such as QRCode, zxing, etc.

Advantages: Customizable, can be quickly batch generation

Disadvantage: the implementation of the weight level, for the simple application of high development costs

3, in front of the page through JavaScript and other means of instant birth into two-dimensional code (ˇ?ˇ), such as Jquery-qrcode

Advantages: Lightweight implementation, reduce picture Io, save traffic

Disadvantage: not suitable for the generation of complex two-dimensional codes

Of course, in the practical application, these three ways of implementation is not completely isolated, we can also be based on the actual situation of the project to maximize efficiency and cost savings.

Evening time is not much on the election of a Jquery-qrcode study.

Jquery-qrcode

Jquery-qrcode is a jquery plug-in that can generate two-dimensional code on the browser side. It is independent, minimum compression after less than 4k, there is no picture download request. After you introduce the class library, you can easily add a two-dimensional code to your Web page with just one line of coding.

It is hosted on GitHub: Https://github.com/jeromeetienne/jquery-qrcode

Jquery-qrcode consists mainly of two files:

1, Qrcode.js: Two-dimensional Code algorithm implementation class

2, Jquery.qrcode.js: With jquery qrcode.js encapsulation, according to user parameters, realize canvas and table two ways to generate two-dimensional code rendering

After compression, only one file jquery.qrcode.min.js.

Code implementation

GitHub in fact already have very detailed use instructions and examples, here is not much to explain.

However, in order to facilitate future use, I still combined with the network on the use of the experience of the reorganization of a code.

The jquery-qrcode.html code is as follows:

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 The

Based on the official sample test, we will find that the identified Chinese two-dimensional code will be garbled.

Based on the interpretation of good intentions of netizens:

This is related to the mechanism of JS, Jquery-qrcode This library is to use the charCodeAt () this way to encode conversion,

This method by default will get its Unicode encoding, the general decoder is the use of UTF-8, iso-8859-1 and other means,

English is no problem, if it is Chinese, in general, Unicode is UTF-16 implementation, length 2 bits, and the UTF-8 code is 3 bits, so that two-dimensional code codec does not match.

The solution, of course, is to convert the string to UTF-8 before the two-dimensional code is encoded.

So we can solve this problem with the help of Utf16to8.js, the specific code is as follows:

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19

function Utf16to8 (str) {var out, I, Len, C; out = ""; len = str.length; for (i = 0; i < len; i++) {c = str.charcodeat (i); if ((C >= 0x0001) && (c <= 0x007f)) {out = = Str.chara T (i); else if (C > 0x07ff) {out + = String.fromCharCode (0xe0 | ((c >>) & 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; }

The above is today to share all the content of the hope that we can learn jquery help.