jqueryプラグインqrcodeはオンラインで二次元コードを生成します。
モバイルインターネットの発展につれて、二次元コードはますます広く使われてきました。ついでに掃除すればウェブサイトを見たり、友達を入れたりできるので、手作業で入力するより本当に便利です。
前の段階は総合的な評価システムを作って、段階的にモバイル化を実現することを考慮して、長い列のIPアドレスのユーザーは入力しても不便で、二次元コードを借りると、ユーザーは携帯電話を持って掃除して直接システムに入ることができます。
この応用シーンに基づいて、インターネットを利用してウェブサイトの二次元コードの実現方法を研究しました。要約すると、次の2つがあります。
1、いくつかの二次元コードを使ってウェブサイトまたは二次元コード生成器を生成し、QR-Coode（二次元コード）オンラインジェネレータなどのウェブサイトに掛けます。
利点：開発コストはゼロで、多様な二次元コードを迅速に実現できる。
短所：QRコードのメンテナンスを変更するのは少し面倒です。
2、バックエンドでjavaまたは.netコードを利用して二次元コード画像を生成し、またウェブサイトで画像を引用する。例えば、qrceode、zxingなど。
長所：カスタマイズ性が強く、迅速に大量に生成できます。
短所：ヘビー級の実現方式は、簡単な応用にとって開発コストが高いです。
3、フロントページでjavascriptなどの方式で即時に二次元コードになる（ˇ?ˇ) ，jquery-qrceodeのようです
特典：ライト級の実現方式で、画像IOを減らし、流量を節約する。
短所：複雑な二次元コードの生成には適していません。
もちろん、実際の応用においても、この3つの実現方法は完全に孤立しているわけではありません。プロジェクトの実際の状況に合わせて適用し、最大限に効率を高め、コストを節約することもできます。
夜も時間があまりないので、jquery-qrcodeを選んで研究してみました。
jquery-qrceode
jquery-qrceodeは、ブラウザの端で二次元コードを生成することができるjqueryプラグインです。独立しています。最小圧縮後は4 k未満です。写真のダウンロード要求もありません。このライブラリを導入すると、1行のコードだけで、ウェブページに2次元コードを追加することができます。
その信託はgithbにあります。https://github.com/jeromeetienne/jquery-qrcode
jquery-qrceodeは主に二つのファイルを含んでいます。
1、QRCode.js：QRコードアルゴリズム実現類
2、jquery.qrceode.js：jqueryでQrcorde.jsをカプセル化し、ユーザーパラメータによってcanvasとtableの2つの方式でレンダリングして二次元コードを生成する。
圧縮したのは一つのファイルだけです。
コードの実装
githubには既に非常に詳細な使用説明と例があります。ここでは多くの説明を行いません。
でも、これから使うために、やはりネット上の皆さんの使う心得と合わせてコードを整理し直します。
jquery-qrceode.コードは以下の通りです。
ネットユーザーの心遣いによると、
これはjsの仕組みに関係しています。jquery-QrcodeというライブラリはcharCodeAt()という方式で符号化変換されています。
この方法はデフォルトでUnicodeコードを取得します。一般的なデコーダはUTF-8、ISO-859-1などの方式を採用しています。
英語は大丈夫です。中国語であれば、UnicodeはUTF-16で実現され、長さは2桁です。UTF-8は3桁です。このように二次元コードの復号化は一致しません。
解決方法はもちろん、二次元コードをエンコードする前に文字列をUTF-8に変換します。
ですから、私たちはこの問題をutf 16 to8.jsを使って解決できます。具体的なコードは以下の通りです。
前の段階は総合的な評価システムを作って、段階的にモバイル化を実現することを考慮して、長い列のIPアドレスのユーザーは入力しても不便で、二次元コードを借りると、ユーザーは携帯電話を持って掃除して直接システムに入ることができます。
この応用シーンに基づいて、インターネットを利用してウェブサイトの二次元コードの実現方法を研究しました。要約すると、次の2つがあります。
1、いくつかの二次元コードを使ってウェブサイトまたは二次元コード生成器を生成し、QR-Coode（二次元コード）オンラインジェネレータなどのウェブサイトに掛けます。
利点：開発コストはゼロで、多様な二次元コードを迅速に実現できる。
短所：QRコードのメンテナンスを変更するのは少し面倒です。
2、バックエンドでjavaまたは.netコードを利用して二次元コード画像を生成し、またウェブサイトで画像を引用する。例えば、qrceode、zxingなど。
長所：カスタマイズ性が強く、迅速に大量に生成できます。
短所：ヘビー級の実現方式は、簡単な応用にとって開発コストが高いです。
3、フロントページでjavascriptなどの方式で即時に二次元コードになる（ˇ?ˇ) ，jquery-qrceodeのようです
特典：ライト級の実現方式で、画像IOを減らし、流量を節約する。
短所：複雑な二次元コードの生成には適していません。
もちろん、実際の応用においても、この3つの実現方法は完全に孤立しているわけではありません。プロジェクトの実際の状況に合わせて適用し、最大限に効率を高め、コストを節約することもできます。
夜も時間があまりないので、jquery-qrcodeを選んで研究してみました。
jquery-qrceode
jquery-qrceodeは、ブラウザの端で二次元コードを生成することができるjqueryプラグインです。独立しています。最小圧縮後は4 k未満です。写真のダウンロード要求もありません。このライブラリを導入すると、1行のコードだけで、ウェブページに2次元コードを追加することができます。
その信託はgithbにあります。https://github.com/jeromeetienne/jquery-qrcode
jquery-qrceodeは主に二つのファイルを含んでいます。
1、QRCode.js：QRコードアルゴリズム実現類
2、jquery.qrceode.js：jqueryでQrcorde.jsをカプセル化し、ユーザーパラメータによってcanvasとtableの2つの方式でレンダリングして二次元コードを生成する。
圧縮したのは一つのファイルだけです。
コードの実装
githubには既に非常に詳細な使用説明と例があります。ここでは多くの説明を行いません。
でも、これから使うために、やはりネット上の皆さんの使う心得と合わせてコードを整理し直します。
jquery-qrceode.コードは以下の通りです。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title> jquery-qrcode </title>
</head>
<body>
<!-- CDN jQuery -->
<script src="http://libs.baidu.com/jquery/2.0.3/jquery.min.js"></script>
<!-- jquery.qrcode.js -->
<script src="jquery.qrcode.min.js"></script>
<!-- jquery.qrcode.js qrcode.js -->
<!--jquery.qrcode.js：jquery -->
<!--<script src="jquery.qrcode.js"></script>-->
<!--qrcode.js： -->
<!--<script src="qrcode.js"></script>-->
<script src="jquery.qrcode.min.js"></script>
<!-- ， utf16t8.js -->
<script src="utf16to8.js"></script>
<div id="qrcodeCanvas"></div>
<div id="qrcodeTable"></div>
<script>
// ，render canvas
$('#qrcodeCanvas').qrcode("https://www.jb51.net/");
// ，
$('#qrcodeTable').qrcode({
text: utf16to8(" ：https://www.jb51.net/"),// ， , ， utf16to8
render: "table",// canvas table， canvas，canvas
width: 256,// ， 256
height: 256,// ， 256， ，
typeNumber: -1,// ， -1
//correctLevel: QRErrorCorrectLevel.H,// ， QRErrorCorrectLevel.H， correctLevel
background: "#ffffff",// ，
foreground: "#000000"// ，
});
</script>
<body>
</html>
ネットユーザーの心遣いによると、
これはjsの仕組みに関係しています。jquery-QrcodeというライブラリはcharCodeAt()という方式で符号化変換されています。
この方法はデフォルトでUnicodeコードを取得します。一般的なデコーダはUTF-8、ISO-859-1などの方式を採用しています。
英語は大丈夫です。中国語であれば、UnicodeはUTF-16で実現され、長さは2桁です。UTF-8は3桁です。このように二次元コードの復号化は一致しません。
解決方法はもちろん、二次元コードをエンコードする前に文字列をUTF-8に変換します。
ですから、私たちはこの問題をutf 16 to8.jsを使って解決できます。具体的なコードは以下の通りです。
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.charAt(i);
} else if (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;
}