STEP 3 — Security / 3-4
公開する前に、
ひと呼吸。
サイトを世界に公開するということは、世界中の誰もがアクセスできるようになる、ということです。だからこそ、公開ボタンを押す前に、「守るべきものが、ちゃんと守られているか」を点検しておきましょう。むずかしい専門知識は要りません。初心者がやりがちな“危ない抜け”を、公開前にひとつずつ潰す——それがこの章です。次の 公開(デプロイ)の前に、必ず通ってください。
この章のゴール
- 秘密の鍵(APIキー・パスワード)を、絶対に公開しない方法がわかる
- フォームや WordPress の基本的な守りを点検できる
- 公開前に確認するチェックリストを持っている
- Claude Code にセキュリティの点検を頼める
なぜ、公開“前”に点検するのか
セキュリティの抜けは、公開した瞬間から狙われます。インターネット上には、弱いサイトを自動で探し回るプログラムが常に動いていて、新しく公開されたサイトもすぐ見つけます。「小さなお店のサイトだから狙われない」は、残念ながら通用しません。狙う側は、相手が誰かなど気にせず、機械的に“穴”を探しているからです。
とはいえ、おびえる必要はありません。基本の抜けさえ塞いでおけば、被害の大半は防げます。この章で扱うのは、その「基本」です。完璧な要塞を作る話ではなく、玄関の鍵をかけ忘れない、という当たり前を確実にやる話です。
① いちばん大事 — 秘密の鍵を公開しない
初心者がやってしまう最大の事故が、APIキーやパスワードを、コードと一緒に GitHub に公開してしまうことです。フォームの章でも触れましたが、これは家の合鍵を玄関先に貼り出すようなもの。見つけた誰かに、データベースを荒らされたり、料金を使い込まれたりします。
守り方は決まっています。秘密の値はコードに直接書かず、.env というファイルに分け、その .env を GitHub に上げない。「上げない」を指示するのが .gitignore という設定ファイルです。
# 秘密の値が入ったファイルは GitHub に上げない
.env
.env.local
# 不要なものも除外
node_modules/
公開前に、「うっかり秘密が混ざっていないか」を必ず確認します。これは Claude に頼むのが確実で速いです。
このプロジェクトを公開する前に、APIキーやパスワードなどの秘密の値が、コードやGitHubに混ざっていないか点検してください。
・直接書かれてしまっている秘密があれば指摘して、.envに分ける形に直してください
・.gitignoreで.envがちゃんと除外されているか確認してください
独学だと、ここで止まる
一度上げてしまった鍵は「消しても危ない」
うっかり APIキーを GitHub に上げてしまったら、あとからファイルを消すだけでは不十分です。git は履歴を残すので、過去をたどれば見えてしまううえ、公開された時点で“流出した”と考えるべきだからです。正解は「その鍵を無効化して、新しい鍵を発行し直す(再発行)」こと。Supabase などの管理画面でキーを作り直せます。「鍵を上げてしまいました。安全に対処する手順を教えて」と、すぐ Claude に相談してください。
② フォームを置くなら、対策をセットで
お問い合わせフォームは便利ですが、放っておくと迷惑メールや攻撃の入り口になります。公開前に、最低限これだけは入れておきましょう。
- 入力チェック(バリデーション):メール欄にメール以外が入っていないか、空のまま送れないか、など。おかしな入力を弾きます。
- スパム対策:機械による大量送信を防ぐ仕組み(reCAPTCHA など)や、人間しか答えない簡単な質問を1つ入れる。
- 送信内容の安全な扱い:受け取った文字をそのまま画面に出すと攻撃に使われることがあります。安全に処理してもらいます。
このお問い合わせフォームを公開する前に、セキュリティ対策を入れてください。
・入力チェック(メール形式・必須項目・極端に長い入力を弾く)
・スパム(機械による大量送信)への基本的な対策
・受け取った内容を安全に扱う処理
初心者にもわかるように、何を入れたか説明してください。
③ WordPress を使うなら
WordPress は世界中で使われているぶん、狙われやすいのも事実です。公開前に、次の基本を点検しましょう。難しい設定は要りません。
- 管理者パスワードを強くする:「admin」「password123」のような推測されやすいものは即アウト。長く複雑なものに。
- 本体・テーマ・プラグインを最新に:古いまま放置されたものは、穴が知れ渡っていて狙われます。更新が基本の守り。
- 使っていないプラグイン・テーマは削除:止めているだけでなく、消す。あるだけでリスクです。
- ログイン画面の保護:ログイン試行の回数制限や、URLの変更などで、総当たり攻撃を防ぎます。
となりに座って一言
WordPress のセキュリティは、「強いパスワード」と「こまめな更新」の2つだけでも、被害の大半を防げます。凝った対策の前に、まずこの当たり前を。逆にここが甘いと、どんな高度な対策も意味がありません。鍵をかけずに防犯カメラだけ付けるようなものです。
④ 通信を暗号化する(HTTPS)
サイトのURLが https://(鍵マーク付き)で始まっているか確認しましょう。HTTPS は、お客さまとサイトの間の通信を暗号化し、入力した内容を盗み見られないようにする仕組みです。フォームで個人情報を扱うなら必須。
うれしいことに、前章で紹介した公開先(Vercel・Render・GitHub Pages)は、たいてい自動で HTTPS にしてくれます。独自ドメインを割り当てたときも、設定すれば無料で対応できます。鍵マークが出ているか、公開後にいちど確認してください。
⑤ 「公開用じゃないもの」を消す
開発中に作ったテスト用のデータ・仮のログイン情報・デバッグ用の表示を、そのまま本番に出してしまう事故もよくあります。公開前に片づけましょう。
- テスト用の管理者アカウントや仮パスワードを消す、または本番用に変える。
- エラーの詳細表示(デバッグモード)をオフにする。内部構造のヒントを攻撃者に与えないため。
- ダミーの文章・仮の画像が残っていないか、ざっと見直す。
⑥ 仕上げに、Claude へ総点検を頼む
最後に、これまでの観点をまとめて Claude に点検してもらいましょう。自分では気づけない抜けを拾ってくれます。
このサイトを一般公開する前に、セキュリティの観点で総点検してください。
・秘密の値(APIキー・パスワード)の漏れ
・フォームの入力チェックやスパム対策
・公開すべきでないテストデータやデバッグ表示が残っていないか
・その他、初心者が見落としがちな危険な点
見つかった問題を、危険度の高い順に、直し方とあわせて教えてください。
となりに座って一言
セキュリティは「一度やって終わり」ではなく、公開後も更新を続けることが守りになります。とはいえ、まずはこの章のチェックリストを公開前に通すこと。完璧を目指して動けなくなるより、基本を確実にのほうが、ずっと安全です。不安な点は、対面でいっしょに確認しましょう。
この章で出てきた言葉
- APIキー
- 外部サービスとつなぐための合鍵。漏れると悪用されるため、絶対に公開しません。
- .env / .gitignore
- 秘密の値をまとめるファイルが .env、それをGitHubに上げないよう除外指定するのが .gitignore。
- 再発行
- 漏れた鍵を無効にして、新しい鍵を作り直すこと。一度漏れた鍵は消すだけでは安全になりません。
- バリデーション
- フォームの入力チェック。おかしな入力や空欄を弾いて、安全と正確さを保ちます。
- HTTPS
- 通信を暗号化する仕組み。URLが https:// で始まり、鍵マークが出ます。個人情報を扱うなら必須。
- デバッグモード
- 開発中にエラーの詳細を表示する設定。本番ではオフに。内部情報を攻撃者に見せないため。
この章のまとめ
- 最優先は秘密の鍵を公開しない。.env と .gitignore で守り、漏れたら再発行
- フォームは入力チェック+スパム対策をセットで
- WordPress は強いパスワード+こまめな更新が守りの土台
- テストデータを消し、HTTPSを確認。仕上げに Claude へ総点検を頼む
Support
公開前の点検、
ご一緒に。
「これで本当に出して大丈夫か」——公開前のひと確認こそ、対面で一緒に見るのが安心です。受講中の方は、公開のその前に、ぜひ点検をご一緒に。
電話で相談 080-6946-4006