三つの実験と鍵
本ツール「Web Crypto API テスター & 暗号化ラボ」は，モダンブラウザに標準搭載されているwindow.crypto.subtleインターフェースの動作を視覚的に検証するための実験室です．利用者は，用途が異なる三つの暗号アルゴリズム（AES-GCM，RSA-OAEP，HMAC-SHA256）をタブで切り替えながら，それぞれの鍵生成，データの暗号化・復号，または共有秘密鍵によるMACとその検証のプロセスを段階的に実行できます．
入力されたテキストや生成された鍵データに対する変換処理はブラウザ内で実行され，結果は即座に画面上のフィールドへ反映されます．
各タブの最初のステップには「鍵を生成」する操作が配置されています．本ラボでは，APIのgenerateKeyメソッドを呼び出し，得られたCryptoKeyオブジェクトからバイナリデータをエクスポートして画面に文字列として表示します．エクスポートを許可するフラグ（extractable: true）を設定しているのは，あくまで教育目的のデモとして鍵の構造（Base64形式やJWK形式など）を可視化するためです．
生成された鍵は一時メモリ上にのみ保持され，ブラウザの再読み込みや，このページのタブを閉じると消失します．AES・RSA・HMACの操作タブを切り替えるだけでは鍵の状態は保持されます．また，HMACの平文・検証値を変更すると以前の検証結果を消し，AES・RSAの暗号文を変更すると復号表示を消します．
平文を変更しただけで以前の暗号文が消えるわけではありません．
AESのIVと復号
対称鍵暗号の実験タブでは，認証付き暗号であるAES-GCM（256bit）を用いたテキストの暗号化プロセスを検証します．「鍵 & IV をランダム生成」を実行すると，Base64でエンコードされた共通鍵と，暗号化に必要となる12バイトの初期化ベクトル（IV）がHEX（16進数）形式で出力されます．
平文を入力して暗号化操作を行うと，内部でTextEncoderにより平文がバイト列に変換され，指定された鍵とIVを用いて暗号データが生成されます．
ここで重要な仕様として，暗号化ボタンを押下するたびに新しい12バイトのIVがwindow.crypto.getRandomValuesによって再生成される点が挙げられます．AES-GCMの規格上，同一の鍵に対して同じIVを使い回すことはセキュリティ上の致命的な脆弱性に繋がるため，本ラボでも毎回新しいIVを適用し，その都度HEX文字列を画面に更新表示しています．
出力されたBase64形式の暗号文は，クリップボードへコピーして復号のテストに利用できます．復号化を実行する際は，メモリ上の共通鍵，直近で使用されたHEX形式のIV，そしてBase64暗号文の三要素が厳密に一致した場合にのみ，TextDecoderによる平文への復元が成功します．
情報が一致しない場合は例外が発生し，ログに失敗メッセージが出力されます．
RSAと長さ制限
非対称鍵暗号の実験タブでは，RSA-OAEP（モジュラス長2048bit，パブリックエクスポーネント65537，ハッシュ関数SHA-256）を利用した公開鍵暗号のプロセスをシミュレートします．鍵ペア生成を実行すると，公開鍵と秘密鍵がそれぞれJWK（JSON Web Key）形式の文字列として表示されます．
JWKフォーマットは鍵の属性情報（kty，n，e，dなど）を構造化して表現するため，非対称暗号の構成要素を目視で確認するのに適しています．本ラボでは外部からの鍵のインポート機能は持たず，生成されたこのペアを用いて暗号化・復号のテストを行います．
公開鍵を用いて平文を暗号化する際，本システム特有の制約に直面します．2048bitのRSA-OAEPでSHA-256を使用する場合，暗号化できる入力データの上限はUTF-8エンコーディングにおいて190バイトまでとなります．これを超える長さの文字列を入力して暗号化を試みると，事前のバリデーション処理（rsaOaepInputBytes）によって境界エラーの例外が発生し処理が中断されます．
この制限はブロック暗号とは異なる公開鍵暗号特有の仕様であり，RSAが長文の直接暗号化ではなく共通鍵の受け渡し等に用いられる理由を体験するための実装です．生成されたBase64暗号文は，秘密鍵を用いることで復号化のテストが可能です．
HMAC生成と検証
共有秘密鍵によるMACの実験タブでは，データが改ざんされていないこと（完全性）と正しい鍵で生成されたこと（真正性）を証明するHMAC-SHA256（256bit）の仕組みを検証します．鍵生成を行うと，署名と検証の双方で利用する単一のRaw Base64形式の鍵がセットされます．
「共有秘密鍵によるMACを生成」を実行すると，入力された平文に対してwindow.crypto.subtle.signメソッドが適用され，ArrayBufferとして得られた署名がHEX形式の文字列として画面に出力されます．検証用HEXの読み込み時には，空白文字を除去したうえで64桁の16進数かを確認するstrictHexBytesが使われます．
形式不正は入力エラーであり，形式が正しくても値が異なる場合は不一致になります．生成された署名は，テストを円滑に行うため下部の検証用フィールドに自動転記されます．
「署名を検証」操作では，現在の平文ペイロード，検証用フィールドのHEX署名，およびメモリ上のHMAC鍵の三つを照合します．window.crypto.subtle.verifyメソッドの結果がtrueであれば「合格（有効な署名）」と表示されます．同じ鍵・同じ平文・同じMACで一致を確認します．
平文やMACの値を変更して再検証すれば不一致となる例を試せます．HMACは公開鍵の電子署名ではなく，検証者も同じ秘密鍵を持つ必要があり，第三者への署名者証明ではありません．平文の入力が変化した際には検証結果が一旦クリアされるため，古い判定と新しい入力状態が混同されることはありません．
生成コードの読み方
本ラボの機能として，UI上での操作（鍵生成や暗号化など）に連動し，各タブの下部にJavaScriptの実装コードスニペットが動的に生成されます．このスニペットは，実際のウェブ開発における実装例として参照できるボイラープレートコードです．
コードを読み解くポイントは，Web Crypto APIの処理が非同期関数（Promise）として設計されており，awaitキーワードを使用して結果を受け取っている点です．例えばAES-GCMの暗号化コードでは，入力されたテキストをTextEncoderでUint8Arrayのバイト列に変換する処理，getRandomValuesによる12バイトのIV生成，そしてcrypto.subtle.encryptへパラメータを渡す手順が順を追って記述されています．
UIに入力したテキストは，生成コード内で構文エラーが生じないようJSON.stringifyを介して適切にエスケープされて埋め込まれます．さらに，暗号化されたバイナリバッファからBase64への変換処理や，ArrayBufferからHEX配列へのマッピング手法なども記述されており，API固有のバイナリデータの取り扱いを具体的なコード単位で確認できます．
表示されたスニペットは右上のコピーボタンから取得可能です．
鍵の消失と運用との違い
本ツールにおける各種データの変換はブラウザ内で処理される仕様ですが，このラボ環境と実際のセキュアなアプリケーション運用との間には設計上の違いがあります．前述の通り，ここで生成されるCryptoKeyオブジェクトは構造の確認を目的としてエクスポート可能な状態で生成され，一時的な状態としてメモリに保持されます．
そのため，ブラウザのリロードを行ったりタブを閉じたりすると，生成した鍵データや暗号文は完全に消失します．
実際のシステム運用においては，永続化が必要な機密の鍵（秘密鍵や共通鍵）を画面上にテキスト表示したり，コピーして汎用のテキストエディタに貼り付けたりする運用は推奨されません．実運用では，鍵の用途・保存先・アクセス権限を設計し，非エクスポート設定や専用の鍵管理システム（KMS）などを検討します．
IndexedDBへ保存するだけで安全になるわけではなく，非エクスポート鍵でも許可された暗号操作は実行できます．本ツールはあくまでWeb Crypto APIのインターフェースやパラメータの挙動を学ぶための教育用デモであり，厳密な鍵の保護，利用者の認証機構，データベースへの永続保存といった実際の運用に不可欠なシステム要件は実装されていません．
そのため，業務で利用している本番の鍵や機密データを入力してのテストは行わないでください．