HTML5はQRコードスキャンと解析を実装します

この記事では、主にHTML5のQRコードのスキャンと解析に関する関連情報を紹介します。それを必要とする友達はそれを参照できます。

導入：

最近、会社プロジェクトには要件があります。 Weiboクライアントでは、H5ページのボタンがネイティブと対話してカメラを呼び出し、QRコードをスキャンして解析できます。 Weibo以外のクライアント（SafariなどのWeChatまたはネイティブブラウザ）で、システムの写真またはアップロードボタンを呼び出し、写真を撮ったり画像をアップロードしたりしてQRコードを解析します。

2番目のソリューションでは、フロントエンドJSのQRコードを解析する必要があります。これは、サードパーティの解析ライブラリjsqrcodeに依存します。このライブラリは、すでにブラウザ側でカメラを呼び出すという操作をサポートしていますが、GetUsermediaと呼ばれるプロパティに依存しています。この属性はモバイルブラウザではサポートされていないため、間接的に写真をアップロードすることでQRコードを解析することのみができます。

getUsermediaプロパティは、ブラウザリストと互換性があります。

まず第一に、QRコードを解析するためのこのような優れたコードを提供してくれたJSQRCodeの開発者に感謝します。 jsqrcodeアドレス：私をクリックしてください

私のコードベースアドレス：私をクリックしてください

1。問題が解決しました：

1。Weiboクライアントのカメラを呼び出してQRコードをスキャンして解析できます。

2。QRコードをスキャンして、ネイティブブラウザーとWeChatクライアントで解析することができます。

2。利点：

WebまたはH5ターミナルは、コードスキャン作業を直接完了できます。

3。短所：

画像が明確でない場合（写真を撮ったり写真をスキャンしたりするときにQRコードに非常に近い必要がある）場合、失敗するのは簡単で、ネイティブカメラ分析と比較して1〜2秒の遅延があります。

このプラグインは、zepto.jsまたはjquery.jsで使用する必要があります

1.使用する必要があるページに次の順序でLIBディレクトリ内のJSファイルを紹介します