セキュリティ

AI生成HTMLを安全に共有する方法

AIにHTMLを作らせると、見た目は一見完成しているのに、中身には外部スクリプトの読み込みや、見覚えのないフォーム送信先、APIキーのような文字列が紛れ込んでいることがあります。生成したHTMLをそのまま共有する前に、何を確認すべきかを押さえておきましょう。公開前チェックを仕組みにしておけば、事故の大半は未然に防げます。

なぜAI生成HTMLはそのまま公開すると危ういのか

AIは指示にもとづいて「それらしく動く」コードを生成します。しかし、どこにデータを送るか、どの外部サービスを読み込むかまで、人間が意図したとおりとは限りません。

たとえば、フォームの送信先が実在しないドメインや、まったく関係のない外部サービスになっていることがあります。サンプルとして埋め込まれたAPIキーが、そのまま残っているケースも見かけます。

これらは画面上には見えません。ソースコードを開いて初めて気づく種類のリスクです。

公開前に最低限チェックすべき項目

まず、次の観点でHTMLの中身を確認します。1つでも当てはまれば、共有する前に内容を見直す必要があります。

  • APIキー・トークン・パスワードらしき文字列が直書きされていないか
  • フォームの送信先(action)が、意図した宛先になっているか
  • 外部スクリプトや外部CSSに、不必要に依存していないか
  • PHPやサーバー設定ファイルなど、静的公開に不要なファイルが混ざっていないか
  • そもそも、検索エンジンに出してよい内容か

よくあるNG例と安全な直し方

AI生成HTMLを安全に共有では、「検索に出さない」と「見られないようにする」を混同しないことが重要です。noindexやrobots.txtは検索エンジンへの指示であり、アクセス制限そのものではありません。

安全に共有するには、誰に見られると困るかを先に決め、URL共有だけで足りるのか、認証や期限が必要なのかを選びます。共有相手と機密度が決まったら、URLのみ・パスワード・メール認証・会社ドメイン認証のどれで渡すかを選びます。

  • NG: 機密情報入りHTMLを認証なしURLで共有し、noindexだけで安心する
  • OK: パスワード・メール認証・会社ドメイン認証で閲覧者を絞る
  • NG: テスト用APIキーや社内URLをHTML内に残したまま渡す
  • OK: 公開前に外部送信先、秘密情報、フォーム送信先を確認する

AIに修正を頼むときの具体的な指示

危ない箇所を見つけたら、自分で全部直そうとせず、AIに「外部送信をなくす」「秘密情報を削除する」「相対パスで完結させる」といった条件を明示して再生成させると速く戻せます。

ただし、再生成後も同じチェックをもう一度行います。AIは一度削った外部スクリプトやダミーの送信先を、別の形で入れ直すことがあるためです。

  • フォーム送信は不要なので削除して、入力欄は見た目だけにする
  • APIキーやトークンをHTMLに含めない
  • 画像・CSS・JSはZIP内の相対パスだけで読み込む
  • 外部スクリプトを使う場合は、必要なものだけに絞る

noindexとアクセス制御は別物

「検索に出なければ大丈夫」と考えるのは危険です。noindexは検索結果に表示させないための設定であって、アクセスを制限する仕組みではありません。

URLを知っている人は、noindexが付いていても中身を見られます。本当に見られたくないページは、パスワードやメール認証で閲覧者そのものを制限する必要があります。

「検索除外」と「アクセス制御」は目的が違う、と切り分けて考えるとミスを防げます。

公開前チェックを「人力」に頼らない

とはいえ、共有のたびにHTMLを開いてソースを読み込むのは現実的ではありません。急いでいるときほどチェックは飛ばされ、事故はそういうときに起こります。

そこで有効なのが、アップロードの時点で機械的に危険な兆候を検出する仕組みです。APIキーらしき文字列、外部フォームへの送信、外部スクリプトへの依存などを自動で洗い出し、人間は警告を確認するだけにします。

ギガサイト便のアップロード時チェック

ギガサイト便は、アップロードされたHTMLやZIPを公開する前に内容をスキャンします。危険な兆候があれば警告し、内容を理解したうえで公開するか判断できます。

  1. HTML / ZIPをアップロードすると、自動でスキャンが走る
  2. APIキー・外部送信・不要ファイルなどの兆候を検出して警告を表示する
  3. 内容を理解したうえで「このまま公開する」を選べる
  4. 問題があればファイルを直して、再アップロードする

AIに再生成させる前に残す確認メモ

AI生成HTMLに不安な点が見つかったら、いきなり全文を作り直すより、何を直すべきかを短くメモしてから再生成を依頼すると安定します。外部送信フォーム、外部スクリプト、APIキーらしき文字列、画像パス、認証が必要なリンクなど、問題の種類を分けて伝えるのがコツです。

「安全にして」だけでは、AIが見た目を変えるだけで本質的なリスクを残すことがあります。削除してよい要素、残したい見た目、外部通信を避けたい範囲を明示すると、レビューしやすいHTMLに近づきます。

  • 外部フォームや送信先URLを残す必要があるかを確認する
  • APIキー・トークン・メールアドレスなどの秘密情報候補を列挙する
  • 外部スクリプトを使わず静的HTMLだけで成立するか確認する
  • 修正後も共有前に人間が再チェックする前提で依頼する

よくある質問

AIが作ったHTMLにAPIキーが入っていました。どうすればいいですか?

まず、そのキーを発行元のサービスで無効化(ローテーション)してください。HTMLからキーを削除しただけでは、すでに共有・公開された履歴からキーが漏れている可能性が残ります。公開前のスキャンで検出できれば、無効化と差し替えを先に行えます。

外部スクリプトを読み込むHTMLは公開してはいけませんか?

一概に禁止ではありませんが、読み込み先が信頼できるか、本当に必要かを確認してください。AIが付け足した不要なライブラリ読み込みは、削除してもページが問題なく動くことが多いです。

社内だけに見せるなら、安全対策は不要ですか?

社内共有でも、URLが転送されたり、退職者の端末に残ったりするリスクはあります。最低限のスキャンと、必要に応じた認証・期限設定をしておくと安心です。

noindexを設定すれば認証は不要ですか?

不要ではありません。noindexは検索結果への表示を抑えるための指定で、URLを知っている人の閲覧を止める仕組みではありません。閲覧者を制限したい場合は認証が必要です。

AIに「安全にして」と頼むだけで共有してよいですか?

それだけでは不十分です。外部送信、外部スクリプト、APIキー、個人情報、認証が必要な画像パスなど、取り除きたい対象を具体的に指定し、再生成後に人間がもう一度確認してから共有してください。

関連記事

セキュリティ

APIキー直書きを防ぐAIプロンプトと公開前スキャン

AI生成HTMLへのAPIキー直書きをプロンプト設計で防ぎ、公開前スキャンで二重検出したい開発者・制作担当者向け。具体的なプロンプト文言とgrepコマンドをセットで紹介します。

4分で読める
「セキュリティ」の記事をもっと見る →