# QR・バーコード｜QRコード作成もバーコード作成もオフラインで 打ち込めば、そのままコードになります。作るために何かを送ることはありません。 > リンク、Wi-Fi、連絡先カードのQRコードや、EAN-13・UPC-A・Code 128・Code 39のバーコードを作れます。SVGでもPNGでもダウンロードできます。すべてブラウザの中で完結します。 これはhttps://abox.tools/ja/qr-barcode/にあるブラウザー用の対話型ツールです。ファイルはそのブラウザーを実行する端末上で処理します。意図した共有や任意の通信機能はページ内で説明します。以下は文章による説明です。利用するにはアドレスを開いてください。 ## コードとその中の文字は**ブラウザー内で処理**されます。処理のためのアップロードはありません。 QRコードとは、文字列に対する計算です。送るファイルもなければ、頼むサービスもありません。モードの選択、バージョンの決定、リード・ソロモン誤り訂正、マスク、バーコードのバーとその下のチェックディジット。そのすべてが、このページの中の、誰でも読める1000行ほどのJavaScriptの中で起きます。このツールにはネットワーク機能が一切ありません。ここではそれが、ほかの多くのページより重い意味を持ちます。エンコードされるのは、しばしばWi-Fiのパスワードだからです。 - ✗ アップロードなし - ✗ 登録なし - ✗ 有効期限なし - ✓ オフラインで動作 - ✓ ソース公開 ## 何もアップロードせずにQRコードを作る手順 1. **コードの種類を選びます。** QRコードは何でも入りますし、スマホのカメラが探しているのもこれなので、別の指定がない限りこれが答えです。バーコードに入れられるのは数字で、どれが必要かはそれを読む側が決めます。店頭ならEAN-13かUPC-A、出荷用の外装箱ならITF-14、社内用ならたいていCode 128です。 2. **中に入れるものを指定します。** いちばん多いのはリンクで、その上の欄からは、スマホが知っているほかの形式を組み立てられます。参加を提案してくるWi-Fi、保存を提案してくる連絡先カード、メール、SMS、電話番号、地図上の場所です。どれを選んでも、できあがった文字列はページに表示します。QRコードが抱えているのは、いつだってそれだけだからです。 3. **どれだけ傷んでよいかを決めます。** 4つの誤り訂正レベルは、検査用データをどれだけ持つかを決めるもので、多いほどコードは大きく密になります。画面ならL、ふつうの紙ならM、手で触られる、小さく印刷される、日の当たる窓に貼られるものならHです。毎日拭かれるメニューの上のコードなら、QかHの価値があります。 4. **大きさ、余白、色を決めます。** 余白はコードの一部です。周囲4モジュール分の静かな空白は仕様が求めているもので、それを削ることは、印刷したコードが読めない理由として最も多いものです。明るい地に暗い図形、しかも本当に差のある色にしてください。スキャナーが読むのは2色の差なので、白地に薄い灰色ではだめですし、暗い地に明るい図形は、かなり多くの読み取り機で完全に失敗します。 5. **手元のスマホで試します。** 千枚印刷する前に、画面に出ているものを1枚読ませてみてください。10秒で済み、プレビューでは捕まえられない種類の間違いをまとめて捕まえられます。エスケープが必要な文字を含むWi-Fiのパスワード、`https://`の抜けたリンク、1桁足りないバーコードの番号などです。 6. **SVGを受け取ります。** ピクセルではなく指示としてのコードなので、どんな大きさで印刷してもぼやけません。そしてぼやけた縁こそ、スキャナーが解像できないものです。貼り付け先がSVGを受け付けないなら、PNGも受け取ってください。1モジュールあたり整数ピクセルで描いているので、こちらにもぼやけた縁はありません。 ## 詳しい解説 [他人のスマホでもきちんと読み取れるQRコードの作り方](https://abox.tools/ja/guides/make-a-qr-code/): どの誤り訂正レベルを選ぶか、QRコードの周りの白い余白がコードの一部である理由、どれくらいの大きさで印刷すべきか、そして無料生成サイトの「ダイナミック」なコードが後で何を要求してくるか。 ## 箱の中のほかのツール - [QRコード・バーコード読み取りツール](https://abox.tools/ja/qr-barcode-reader/): コードにカメラを向けるか、写った画像を置いてください。読むのはここだけ、ほかのどこでもありません。 - [ハッシュとチェックサム](https://abox.tools/ja/hash-checksum/): 配布元が出した数字とダウンロードを照らし合わせる。どこにも送らずに。 - [パスワード・パスフレーズ生成](https://abox.tools/ja/password-generator/): 作るのはこのページ、動くのは手元のブラウザ。どこにも送られず、保存もされず、履歴も残りません。 - [JSONフォーマッター](https://abox.tools/ja/json-formatter/): JSON・XML・HTML・CSS・YAMLを、整形するか変換します。よそのサーバーに貼り付けるものは何もありません。 ## よくある質問 ### 打ち込んだものはどこかへ送られますか？ 送られません。QRコードとは文字列に対する計算で、その計算が走るのは手元の端末の、お使いのブラウザの中です。このツールにはネットワーク機能が一切なく、何も取りに行かず、何も送りません。ページの`Content-Security-Policy`には接続してよいアドレスがすべて挙がっていますが、そのどれも当サイトのものではありません。これはほかのページより重い意味を持ちます。人がQRコードに入れるものとして最も多いのは、自宅のWi-Fiのパスワードだからです。 ### このコードに期限はありますか。あとで使えなくなりませんか？ ありませんし、なりようがありません。打ち込んだものがそのままコードの中身なので、読み取れば永久にその文字列が返ってきます。期限が来るのは、他人のアドレスが中に入っているコードのほうです。「ダイナミック」なQRコードは生成元のサーバーへのリンクを抱えており、そこから本来のアドレスへ転送されます。つまり向こうはスキャンを数え、行き先を変え、試用期間が終われば止められます。ここでは何も、どこも経由しません。 ### 無料ですか。商用利用はできますか？ 無料です。アカウントも、透かしも、作れる枚数の上限もありません。できたものを製品にも、ポスターにも、店頭にも使えます。QRコードはデンソーウェーブの登録商標ですが、同社はコードを使う人に対してそれを行使しないと表明しています。仕様はISO/IEC 18004として公開されており、自由に実装できます。このページがしているのがそれです。このサイトには広告があり、それが費用を賄っています。 ### 誤り訂正レベルはどれを選べばいいですか？ 理由がなければMです。Lはコードがいちばん小さくなり、画面なら十分です。Mはふつうの取り扱いに耐えます。QとHは、小さく印刷される、ラミネートされる、窓に貼られる、ロゴで一部が隠されるコードのためのものです。1段上げるごとに検査用のデータが増えるので、同じ文字数でもより大きなシンボルが必要になります。LからHに移ると、同じ文字列でモジュール数がおよそ2倍になります。 ### QRコードにはどれだけ入りますか？ 最大の177モジュール四方で、数字なら7,089文字、大文字と数字なら4,296文字、それ以外なら2,953バイトまでです。しかもこれは誤り訂正がいちばん弱い場合で、いちばん強い場合はその3分の1ほどになります。実際には、上限を決めるのは形式ではなくスキャナーです。数百文字を超えるとモジュールが小さくなりすぎて、ふつうのスマホのカメラでは腕を伸ばした距離から解像できません。長いコードはたいてい、代わりに短いリンクを入れるべきだという合図です。 ### リンクを小文字で書くとコードが大きくなるのはなぜですか？ QRコードには大文字と数字のためのモードがあり、2文字を11ビットに詰め込みます。小文字にはそれがなく、1文字あたり8ビットかかります。`HTTPS://EXAMPLE.COM/PAGE`と書いたURLは、同じURLを小文字で書いた場合より3分の1ほど小さくなることがあります。スキームとホストは大文字小文字を区別しないので、大声で書いても大きさ以外は何も変わりません。ホストより後のパスは区別するので、そちらはそのままにしてください。 ### QRコードを読み取ることもできますか？ このページではできませんが、隣のページでできます。[読み取りツール](https://abox.tools/ja/qr-barcode-reader/)が写真やスクリーンショット、あるいはカメラを受け取って、中の文字列を返します。描くのに比べればかなり大きな仕事で、画像の中からシンボルを見つけ、撮った角度を補正し、傷んだところを直す。この三つはこのページには無い問題です。だからここのボタンではなく、独立した道具になっています。条件はほかと同じで、アップロードは一切なく、カメラの映像も残しません。 ### 余白は何のためにあり、小さくできますか？ QRコードの周りの白い部分は、コードの一部です。読み取り機はそれを使ってシンボルの終わりを見つけており、仕様は四方に4モジュール分を求めます。バーコードなら10モジュール分ほどです。ここでは0にもできますし、そうすれば見た目は整いますが、かなり多くのスキャナーがそもそも見つけられなくなります。とくに、背景が込み入っている場合です。場所が問題なら、余白を削るのではなくコードを小さくしてください。 ### どのバーコードが必要ですか？ 読み取る側が指定するものです。EAN-13は北米以外の流通用バーコード、UPC-Aは北米のものです。どちらもGS1から発行された番号が必要です。番号が識別しているのは製品だけでなく、その会社だからです。EAN-8は小さなパッケージ向けの短い版です。ITF-14は出荷用の外装箱に付きます。Code 128とCode 39は数字だけでなく文字も入り、登録は一切要りません。資産、棚、作業票など社内用のものには、これが正しい答えです。 ### チェックディジットとは何で、なぜ足されたのですか？ 流通用バーコードの最後の1桁で、その前の桁から計算されます。スキャナーが、誤読と正しい読み取りを見分けられるようにするためのものです。EAN-13は12桁を求めて13桁目を計算し、UPC-Aは11桁を求めて12桁目を計算します。短いほうの番号を打ち込めば、このページがそれを足します。完全な番号を打ち込めば、与えられた桁を検算し、黙って直すのではなく拒みます。誤った桁を静かに修正することは、他人の製品として読み取られるラベルを作ることだからです。 ### QRコードの真ん中にロゴを入れられますか？ 小さなロゴを入れられる場合はありますが、安全な面積の割合は保証できません。DENSOが示すHレベルの約30%は、任意のマスではなく全コードワードに対する復元率です。位置検出と位置合わせのパターンを隠さず、Hを使い、完成した印刷物を複数のスマートフォンで試してください。[DENSOの誤り訂正の説明](https://www.qrcode.com/en/about/error_correction.html)で基準を確認できます。 ### PNGよりSVGのほうが良いのはなぜですか？ コードとは縁の集まりであり、PNGはそれを作るためのピクセル数が固定されているからです。拡大すればどの縁もぼやけます。そしてぼやけた縁こそ、スキャナーが苦手とするものです。1200dpiのプリンターに512ピクセルのPNGを渡すのは、差を発明しろと頼んでいるのと同じです。SVGは正方形を指示として持っているので、名刺でも屋外広告でもくっきり印刷されます。ここのPNGは1モジュールあたり整数ピクセルで描いており、それがPNGにできる最善です。 ### オフラインでも動きますか？ 動きます。ページを一度読み込んでから通信を切っても、そのまま使えます。何もアップロードされていないことを示す、いちばん簡単な方法でもあります。コードを描いてもらうためにテキストをどこかへ送っている道具なら、線を抜いた瞬間に止まるからです。 ## この主張を確かめる方法 - **処理はこのブラウザー内で行います。** 入力と結果はブラウザー内で処理し、処理コードはそれらを処理用にアップロードしません。Content-Security-Policyは資源と接続先を制限しますが、許可済みの相手はリクエストを受け取れます。内容は検査せず、何も送られないことを単独で証明しません。具体的な操作の要求とソースを比較するか、切断中にローカル操作を完了してください。 - **何かを取りに行くコードがありません。** `src/`のどこにも`fetch`も`XMLHttpRequest`も`sendBeacon`もありません。コードは文字列から計算で組み立て、SVGとして描きます。このページの中で、手元の端末の上でです。 - **できたコードは、当サイトを指しません。** 打ち込んだものが、そのままコードの中身です。無料の生成サイトのいくつかは、自分のサイトへのリンクを含んだコードを返し、そこから本来のアドレスへ転送します。つまりスキャンのたびに向こうが数を数えており、そのドメインの費用を払うのをやめた日や、無料枠が終わったと決めた日に、コードは動かなくなります。ここでは短縮も、転送も、追跡もしません。ページに表示されている文字列が、そのまま絵の中の文字列です。 - **PNGは、画面に出ているSVGから作ります。** ダウンロードされるものは、プレビューと食い違いうる第2の描画ではありません。同じマークアップをブラウザに渡し、キャンバスに描いています。だからこそ、どこにも接続せずにそれができます。取りに行くフォントも、中に読み込む画像もないからです。 - **Googleが読み込むものと、渡されないもの。** 広告と計測のスクリプトはGoogleから、寄付ボタンはBuy Me a Coffeeから来ています。そのどれにも、打ち込んだものは渡されません。文字列をコードに変えるコードはすべてこのオリジンから配信され、リポジトリに載っています。 - **オフラインで動きます。** 通信を切ってもこのツールは何も変わりません。もともと通信する段階が存在しないからです。これがいちばん単純な証明です。 **自分で確かめてください。**以上のどれも、鵜呑みにする必要はありません。このページは、リポジトリにあるテンプレートと設定から、誰でも読んで実行できるビルドスクリプトが生成しています。その結果は`dist`ブランチに置いてあるので、配信されているものと、ソースをビルドした結果とを差分で比べられます。 https://github.com/A-Box-of-Tools/website まず読むとよいのは、Content-Security-Policyについては`config/site.toml`、QRコード本体については`src/qr-encode.js`と`src/qr.js`です。一方にモード、バージョン、ブロックが、もう一方に位置検出パターン、マスク、形式情報のビットがあります。誤り訂正については`src/gf256.js`、縞模様のほうについては`src/barcode.js`です。