なぜ危ないのか
localStorageに書き込まれたデータは、明示的に削除するかブラウザのデータをクリアしない限り永続的に残ります。共有URLを開いた外部のレビュアーがページを操作した際にlocalStorageに個人情報が書き込まれると、そのコンピュータを共用している別の人物がDevToolsのApplicationパネルを開くことで情報にアクセスできます。特に会社の共用PCや図書館などの公共端末で開かれた場合のリスクは高くなります。
AIが生成するHTMLには、ユーザー操作のシミュレーションとして「ログイン状態を保存する」「入力値を自動補完する」などの機能が含まれることがあります。これらの機能がlocalStorageを使っている場合、テストユーザーの情報がブラウザに書き込まれます。デモとしては便利な機能でも、不特定多数が閲覧できる環境では情報保護の問題になります。
- 相手がログインなしで開ける状態か確認する
- PCとスマホで最低1回ずつ表示を確認する
- 内部情報・個人情報・不要な外部送信が残っていないか見る
- レビュー期限と修正時の差し替え方を決めておく
ソースで見る場所
HTMLに含まれるすべてのJavaScriptを対象に、`localStorage.setItem`の呼び出しを探します。設定される値がハードコードされているか変数経由かを確認し、変数経由の場合はその変数がどのような値を取りうるかをコードで追跡します。フォームの入力値をそのままlocalStorageに書き込むパターン（`localStorage.setItem('email', document.getElementById('email').value)`）が特に危険です。
外部JSライブラリを読み込んでいる場合、そのライブラリがlocalStorageを使っている可能性もあります。例えばフォームのバリデーションライブラリや状態管理ライブラリはlocalStorageを内部的に使うことがあります。ネットワークタブで読み込まれているライブラリのリストを確認し、それぞれのドキュメントでlocalStorageの使用有無を調べてください。
- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する
安全に共有する設定
localStorageへの書き込みが必要な機能を無効化せずに共有したい場合は、書き込む値にリスクのないダミーデータを使います。`localStorage.setItem('userEmail', 'demo@example.com')`のように、明らかに架空とわかる値に置き換えてから共有してください。フォームから動的に入力値を書き込む処理は削除するか、実行されないようにコメントアウトします。
ページを開くたびにlocalStorageをクリアする処理を追加する方法は確実ですが、機能に影響が出る可能性があります。代替として、共有URL専用のクエリパラメータ（`?preview=true`）を検出してlocalStorageへの書き込みをスキップするコードを追加する方法もあります。これにより、デモとしての動作と共有時の安全性を両立できます。
- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する
再発防止ルール
AIへのプロンプトにlocalStorageの使用ポリシーを明記します。「デモ目的のHTMLではlocalStorageに個人情報を書き込まないこと。ユーザー操作の状態管理が必要な場合はJavaScriptの変数やsessionStorageを使うこと」という指示を標準テンプレートに加えます。
共有後の後処理として、レビューが完了したURLに対してlocalStorageのデータが残っていないかをチェックする手順を確立します。特定の期間を過ぎたら共有URLを自動的に無効化する設定（ギガサイト便の期限機能など）と組み合わせると、見落としが減ります。
- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する
よくある質問
localStorageに書き込まれた個人情報はいつ削除されますか？
JavaScriptで明示的に`localStorage.removeItem`または`localStorage.clear`を呼ばない限り、ブラウザのデータクリアまで永続します。ユーザーがブラウザの設定から手動で削除するか、ブラウザのキャッシュクリアを行うまで残り続けます。
localStorageのデータが漏えいしているか確認するにはどうすればよいですか？
DevToolsのApplicationパネルのLocal Storageセクションで対象ドメインのデータを確認します。個人情報らしきデータが含まれていれば漏えいのリスクがあります。確認後は同パネルの「Clear All」で削除してください。
localStorageではなくCookieに個人情報が保存されている場合も同様の問題がありますか？
はい。CookieはHTTPリクエストに自動的に付与されるため、localStorageより危険度が高い場合もあります。DevToolsのApplicationパネルのCookiesセクションも合わせて確認してください。