ひとことで言うと
- 公開したファイルは、サイトを開ける人なら誰でも読めます。パスコードを設定しても、置いてよいものは変わりません。キー、パスワード、お客様のデータは入れないでください。
- サーバーがなくても、リスクがないわけではありません。貼り付けたキー、外部のスクリプト、innerHTML で挿入したテキストに注意しましょう。
- キーが漏れたら、まず無効にしましょう。ファイルを削除するだけでは足りません。
公開されるもの
覚えておくべきルールは、これだけです。ウェブサイトを公開すると、その中のすべてのファイルを、アドレスを知っている人なら誰でもダウンロードできます。どのページからもリンクされていないファイルも含まれます。コードを「ミニファイ」や「難読化」しても、読みにくくなるだけで、秘密にはなりません。
| ファイルの種類 | 公開される？ | 例 |
|---|---|---|
| HTML、CSS、JavaScript | あり | script.js に入力した API キー |
| 画像、PDF、ダウンロード用ファイル | あり | どのページからもリンクされていない料金表の PDF |
| 設定ファイル | あり | トークンが入った config.json |
.env ファイル | はい（アップロードした場合） | プロジェクトの隣に置いたキー |
ソースマップ（.map） | はい（アップロードした場合） | 元のコードを読める形で復元したもの |
.git フォルダー | はい（アップロードした場合） | 「削除した」キーが残っている古い履歴 |
| 公開していないファイル | 不可 | メモ、下書き、プロジェクトのそのほかの部分 |
秘密鍵が潜んでいる場所
AI ツールは、動くものを作るのが得意です。いちばん手っ取り早い方法として、キーをコードにそのまま貼り付けることがあります。次の点を確認しましょう：
- JavaScript 内のキー。ページから AI サービスを直接呼び出すチャットボットのウィジェットで、キーがコードに書かれているもの。誰でもそのキーをコピーして、サイト運営者の請求額を膨らませることができます。
.envファイル。プロジェクトでは、キーを.envというファイルに保管します。本来は自分のパソコンに置いておくものですが、プロジェクトフォルダー全体を公開するとアップロードされてしまいます。- 設定ファイルとビルドファイル。設定ファイル、ソースマップ、残ったテストファイルには、共有するつもりのないキーやパスが入っていることがあります。
.gitフォルダー。この隠しフォルダーには、ずっと前に「削除した」キーを含め、プロジェクトの履歴がすべて入っています。
公開キーは問題ない
ウェブページに置かれるよう設計されたキーもあります。Stripe の公開可能キー（pk_...）、ドメインを制限したマップのキー、アクセス解析の ID などです。ブラウザで安全に使えるキーかどうかは、サービスのドキュメントに書かれています。「シークレット」や「サーバー側のみ」と書かれているキーや、sk_ で始まるキーは、サイトに絶対に入れてはいけません。
機能に秘密が必要な場合
秘密のキーがないと動かない機能は、ふつうのウェブサイトだけでは安全に実現できません。選択肢は次のとおりです：
- その用途に特化したサービスを使う：お問い合わせにはフォームサービス、予約には予約ツール、決済にはホスト型のチェックアウト。秘密はサービス側が保持してくれます。
- 対応しているサービス上の小さなサーバー関数の裏に秘密を置き、ページからはそれを呼び出す。
- その機能は今はあきらめる。わかりやすいメールリンクの方が、漏えいしたキーよりずっとましです。
AI に直接聞いてみましょう：「このサイトに秘密のキーは含まれていますか？ 含まれている場合、ブラウザに秘密を置かずにこれを実現するにはどうすればいいですか？」 聞けば、たいてい問題を見つけてくれます。
外部から読み込むスクリプト
AI が作ったページの多くは、フォントローダー、アイコンパック、アクセス解析、チャットウィジェットなど、ほかのウェブサイトのスクリプトを読み込みます。それぞれがあなたのページ上で、すべての権限を持って動きます。訪問者の入力を読み取り、表示を変えることもできます。その外部サイトが攻撃されれば、あなたのページも攻撃されます。
- 数を減らす。「このページに、外部のスクリプトはひとつひとつ本当に必要？」と聞いてみましょう。
- バージョンを固定する。「latest」ではなく
library@1.2.3を使い、ファイルが知らないうちに変わらないようにしましょう。 - ライブラリが公開している場合は、整合性チェックを付けましょう。改ざんされたファイルを、ブラウザが読み込まなくなります。次のような形です：
<script src="https://cdn.example.com/lib@1.2.3/lib.min.js" integrity="sha384-..." crossorigin="anonymous"></script>
- ウィジェットを確認する。アクセス解析、チャット、予約のウィジェットは、クッキーやトラッキングも追加することがよくあります。それぞれが何をするかを把握し、プライバシーのページに書きましょう。
テキストを安全にページへ表示する
アドレスバーやフォームの入力欄、訪問者から取ったテキストを innerHTML でページに挿入するコードがあると、攻撃者がほかの人のブラウザで動くコードを紛れ込ませることができます。これはクロスサイトスクリプティング（XSS）と呼ばれます。安全な習慣は、コードとして実行されない textContent でプレーンテキストを挿入することです。
Find every use of innerHTML, document.write and eval in my site. For each one, say where the text comes from. If it can come from the URL, a form or a visitor, change it to use textContent instead. Tell me what you changed.
ページ上のチャットボット
AI と会話するチャットボックスには、AI サービスを呼び出すためのキーが必要です。そのキーはサーバーに置くもので、ページには絶対に置きません。ほかに 2 つ知っておくことがあります。
- プロンプトインジェクション。訪問者が、ボットにあなたの指示を無視させようとする命令を入力することがあります。これを完全に防ぐことはできません。
- だから被害を小さくする。ボットには秘密も操作も与えないでください。公開されているテキストから質問に答えるだけなら、だまされても被害はほとんどありません。
フォームと個人情報
- 必要なものだけを集める。名前とメールアドレスで足りることがよくあります。項目が増えるたびに、守るものも増えます。
- 送り先を明示する。プライバシーのページに、メッセージを誰が受け取り、なぜ受け取るのかを書きましょう。
- 独自の保存先を作らない。ふつうのページには、メッセージを安全に保存できません。フォームサービスか、ホストに組み込まれたものを使いましょう。
Page Lemon では、AI に「私のサイトに問い合わせフォームを追加して」と頼むだけです。メッセージはあなたにメールで届き、アカウントにも保管されるので、別のフォームサービスは要りません。フォームは有料プランに含まれます。問い合わせフォームをご覧ください。
ライセンスと正確さ
- ライセンスを確認する。外部のライブラリ、フォント、アイコン、画像には利用条件があります。クレジット表記が必要なものや、商用利用を禁じるものもあります。使っているものと出どころを、AI に一覧にしてもらいましょう。
- 事実を確認する。AI は、価格、レビュー、主張をでっち上げることがあります。公開したのはあなたです。
- AI が書いた成果物の所有者は国によって異なり、まだ整理が進んでいる途中です。これは法的助言ではありません。重要な場合は、専門家に相談してください。
AI に貼り付けてはいけないもの
サイトは公開されますが、チャットは公開を前提としていません。次のものは貼り付けないでください：
- 顧客リスト、注文、メッセージ（AI サービスがそのデータをどう扱うかを把握している場合を除く）。
- パスワード、API キー、ログインコード（AI がサイトに書き込んでしまうことがあるため）。
- チラシに印刷したくないことすべて。
制作中は、仮の名前と「example@example.com」を使いましょう。本物の情報は、自分で差し替えます。
リンクを共有する前の 5 分チェック
チェックを付けていきましょう。または、調べる部分を下のプロンプトで AI に任せることもできます。
6 項目中 0 項目完了
List every external script, key-like string, innerHTML use, form action and personal detail in my site, with the file and line for each. Don't change anything.
問題がなくなったら、ウェブサイト公開前チェックリストを確認しましょう。
キーが公開されてしまったら
Page Lemon の手助け
AI が作ったサイトは、こうしたことを考えたことのない人が公開することも多いため、いくつか安全策を用意しています：
.envファイル、.git、node_modules、ソースマップ、プライベートキーのファイルはスキップされ、配信されることはありません。- アップロードされたファイルは、よく知られた種類の秘密鍵や秘密のキーがないか確認されます。見つかった場合は、そのアップロードの内容は何も公開されず、どのファイルの何行目を直すべきかが知らされます。
これらのチェックで見つかるのは、よくある間違いであり、すべての秘密ではありません。何を公開するか自分で選ぶことが、秘密を守ることにつながります。詳しくは、セキュリティと信頼とサイトを公開するをご覧ください。