ギガサイト便
HTMLをURL化
セキュリティ

AI生成HTMLにhidden input内の個人情報が残っていないか確認する方法

AIが生成したHTMLのフォームの中に、`<input type="hidden">`で隠された値が入っていないか確認したことはありますか。hidden inputはユーザーの画面には表示されませんが、HTMLソースやDevToolsで誰でも読める値です。テスト用のユーザーIDや内部の管理コード、個人情報が埋め込まれたまま公開されることを防ぐ確認方法を解説します。

5分で読める

なぜ危ないのか

hidden inputは`<input type="hidden" name="userId" value="12345">`のように書かれ、ブラウザの表示領域には一切現れません。しかしHTMLのソースコードには普通に記述されているため、ページのソース表示やDevToolsを開けば誰でも値を読めます。AIがモックデータとして実際のユーザーIDや社員番号をvalue属性に埋め込むことがあるため、生成後の確認が不可欠です。

フォームを含むHTMLをプレビューURLで共有する場合、hidden inputの値はフォーム送信時にサーバーへ送られるため、テスト用の認証トークンや管理権限を示すフラグが含まれていると、受け取った相手がフォームを送信することで意図しない操作が実行される可能性もあります。

  • 相手がログインなしで開ける状態か確認する
  • PCとスマホで最低1回ずつ表示を確認する
  • 内部情報・個人情報・不要な外部送信が残っていないか見る
  • レビュー期限と修正時の差し替え方を決めておく

ソースで見る場所

HTMLをテキストエディタで開き、`type="hidden"`または`type='hidden'`を検索します。見つかった箇所のvalue属性の値を確認し、数字の羅列（IDや電話番号）、メールアドレス形式の文字列、Base64エンコードされたような長い文字列が入っていないかチェックします。

DevToolsのElementsパネルでformタグを展開すると、hidden inputのノードが表示されます。また、Consoleパネルで`document.querySelectorAll('input[type="hidden"]')`を実行すると全hidden input要素の一覧が取得でき、各要素のvalue属性を確認できます。

  • HTML内の外部script・form action・iframeを確認する
  • APIキーやトークンらしき文字列がないか検索する
  • 画像・CSS・JSのパスが公開後も解決できるか見る
  • noindexと認証を混同せず、必要なら両方設定する

安全に共有する設定

テスト用の値が埋め込まれているhidden inputは、共有前にvalue属性を空にするか、要素ごと削除します。フォームの動作確認が目的ではなくデザインレビューが目的である場合は、`<form>`タグ内の入力要素をすべてダミーに置き換えるか削除してから共有してください。

AI生成フォームを共有する際は、`action`属性の送信先URLも確認します。実際のAPIエンドポイントや内部サービスのURLが`action`に書かれていると、レビュアーがフォームを試験的に送信した際に本番データへの影響が生じる可能性があります。レビュー用にはaction属性を`#`に変更するか削除してから配布してください。

  • HTML内の外部script・form action・iframeを確認する
  • APIキーやトークンらしき文字列がないか検索する
  • 画像・CSS・JSのパスが公開後も解決できるか見る
  • noindexと認証を混同せず、必要なら両方設定する

再発防止ルール

AIへのフォーム生成プロンプトに「hidden inputのvalue属性にはダミー値や空文字を使い、実際のIDや個人情報を入れないこと」と明示します。また「フォームのactionは`#`にすること」も合わせて指示しておくと、誤ったエンドポイントへの送信を防げます。

公開前チェックの自動化として、`grep -n 'type="hidden"' ./output.html`を実行し、各行のvalue属性を確認するプロセスをデプロイスクリプトに組み込みます。value属性が空でない場合にワーニングを表示する簡単なシェルスクリプトを作成しておくと、定期的な手動確認の省力化になります。

  • HTML内の外部script・form action・iframeを確認する
  • APIキーやトークンらしき文字列がないか検索する
  • 画像・CSS・JSのパスが公開後も解決できるか見る
  • noindexと認証を混同せず、必要なら両方設定する

よくある質問

hidden inputの値を空にするとフォームが正しく動作しなくなることはありますか？

通常のデモやデザインレビュー用途であれば問題ありません。実際の送信機能が必要な場合は、フォームの動作確認用の環境を別途用意し、共有用HTMLとは分離することを推奨します。

Base64エンコードされたhidden inputの値も個人情報になりますか？

はい。Base64は暗号化ではなくエンコードなので、誰でも簡単にデコードできます。value属性にBase64文字列が入っている場合はデコードして内容を確認してください。

CSSで`display:none`にしたinputとhidden inputは何が違いますか？

機能的にはどちらも表示されませんが、`type="hidden"`はフォーム送信時に必ずデータが含まれます。`display:none`のinputも送信対象になることがあるため、両方を確認対象にしてください。

関連記事

「セキュリティ」の記事をもっと見る →