ブラウザで動くQRコードリーダーを作った(Android向け)

ブラウザで利用可能なQRコードリーダーを作った。 目的は、Android端末でのQRコードの読み取り。

利用はここから

QRコードリーダー
説明・注意端末側で処理するので画像などのデータはサーバに送信されません。端末に保存済みの画像からの読み込みとカメラを利用しての読み込みに対応しています。読み取れないこともあります。関連記事:ブラウザで動くQRコードリーダーを作った(Andr...

ホーム画面にショートカットなどを追加して使う形になる。ショートカットの追加については、下記の記事を書いた。

Androidスマホのブラウザでショートカットをホーム画面に追加
Androidのスマホのブラウザでホーム画面にショートカットを置けるものを調べた。 といっても、調べたブラウザは3つだけ。 Chrome 定番。ほぼ入ってると思う。 Firefox なんとなく入れたくなる。 ...

細かいこと

カメラで読み取りたいと思って、videoタグから画像を読み込めるようにしたが、Android端末では<input type="file" accept="image/png,image/jpg,image/jpeg,image/gif">な要素でもカメラを使用して撮影したあと、その(一時領域上の?)ファイルを指定できるようだ。

inputタグを使って撮影した方がピント合わせの面では楽だろう。しかし、小さくないQRコードであれば、videoタグの利用は手早く済むといった利点がある。

videoタグの利用はブラウザにカメラの使用権限を許可しないといけないので、抵抗がある場合はinputタグを利用すれば済む。

読み込むQRコードとしては、URLと電話番号の形式はリンクを生成するようにしてある。そうでないものは、文字列として、textareaタグに収めるに留めることにした。コピーはtextareaタグをタップするだけで全選択になるようにしてある。

iOS系統は標準のカメラアプリでQRコードを読み取ってくれるので、非常に便利。Androidにはそういうのが無くて残念。機種によってはあるのだろうか。

使用したライブラリ

さすがにジェネレータは作る必要ないかな。

タイトルとURLをコピーしました