福野泰介の一日一創

QRコード化できるデータは4種類、数字(0-9のみ)、アルファベット大文字+数字+記号( $%*+-./:)、バイナリデータ、そしてSJIS。 SJISはもう古いので、実質3種。数字のみや、アルファベット大文字のみの場合、小さく作れます。

QRコード生成ライブラリ「kazuhikoarase / qrcode-generator」にESモジュールを追加した「taisukef / qrcode-generator」では、バイナリデータを扱えていなかったので追加実装。バイナリデータのQRコード化に成功！

<script type="module"> import { QRCode } from "https://js.sabae.cc/QRCode.js"; const data = new Uint8Array([1, 2, 3]); // const data = "福井"; document.body.appendChild(new QRCode(data)); </script> ESJamでもサクッと試せる、シンプルコード。これだけでQRコードが画面に表示されます。

<script type="module" src="https://js.sabae.cc/QRCode.js"></script> <qr-code value="福井"></qr-code> HTML拡張タグとしても簡単に使えます！JavaScriptを1文字も書かなくてOK!

いままで文字化けしていた「漢字」のQRコードも

この通り！iPhoneのカメラアプリで確認できます

ただしバイナリデータをQRコード化したものはiPhoneのカメラアプリでは表示できません。 先日作った「jsQR-es」など、バイナリデータ表示対応のリーダーを使ってご確認ください。
（参考、AndroidでQRコードのバイナリデータを取得する (iOS対応!)→ アプリ「QRefine」

新型コロナワクチン接種証明書アプリでは、バイナリデータをわざわざBase64でエンコードし、更に数字化してサイズを縮小しようとしていますが、バイナリデータでエンコードすればもっとシンプルになりますね。（せっかく本文を数字化しているのに、"shc:/"と小文字アルファベットを使ったヘッダを加えているせいでバイナリデータとしてエンコードされてしまっている。せめて大文字であれば・・・）

バイナリベースのCBORを使ったトラストデータ「Rensa」をQRコード化する準備が整いました！