動的サイトとは｜ネットミリしら

動的サイトとは

動的サイトは、要求や利用者、データの状態に応じてサーバーまたはブラウザで内容を生成するWebサイトです。

同じURLでも、ログイン中のアカウント、時刻、検索条件、在庫、権限などで内容が変わります。生成場所はWebサーバー側に限らず、配信後のブラウザー側にもあります。

「動的＝PHP」「静的＝HTML」というファイル拡張子だけの区分ではありません。どの時点で、どのデータを基に表示を組み立てるかで判断します。

Server-側応答を作ってから返す

URL、フォーム、Cookie、セッション、データベースを基にHTMLやJSONを生成する。秘密や認可判断をサーバー内に保てる。

Client-側受信後にブラウザーで組み立てる

JavaScriptがAPIからデータを取得し、DOMを更新する。画面遷移を小さくしやすいが初期表示と失敗時を設計する。

Hybrid初期表示と操作後を分担する

最初はサーバー生成HTMLを返し、その後はJavaScriptが差分を更新する。検索性と操作性を両立しやすい。

HTTP方式とURL、問い合わせ、ヘッダー、Cookie、本文を受け取り、経路制御で処理先を決めます。セッションやトークンから利用者を認証し、リソースを操作してよいか認可してからデータベースや外部APIへ問い合わせます。

結果をテンプレートへ渡してHTMLを作る場合も、JSONとしてブラウザーへ返す場合もあります。処理途中で障害が起きたときは、適切なHTTP状態と、秘密を漏らさないエラー表示を返します。

買い物かご、ログイン状態、編集中データなどのstate（ステート、状態）は、Cookie、サーバーセッション、データベース、ブラウザー保存領域などへ置けます。複数サーバーへ増やすとき、特定サーバーのメモリーだけに状態を置くと別サーバーへ移った要求から見えません。

正本をどこに置くか、いつ失効させるか、複数タブや端末でどう同期するかを決めます。クライアントの値は改変できる前提で、価格や権限を再検証します。

動的に生成した応答でも、同じ条件で再利用できる部分はWebキャッシュへ保存できます。全利用者共通の商品一覧と、個人の氏名・注文履歴では扱いが異なります。

キャッシュ鍵へ言語、端末向け表現、認証状態など必要な変数を含めます。個人データを共有キャッシュへ入れる誤設定は重大です。更新時の無効化も生成処理と一緒に設計します。

応答時間には、経路制御、認証、アプリケーションコード、データベース問い合わせ、外部API、テンプレート生成、ネットワーク転送が含まれます。平均だけでなく遅い側のパーセンタイルを見て、どこで待ったかをトレースします。

同じ問い合わせの繰返し、N+1問い合わせ、広すぎる検索、外部APIのタイムアウト、接続プール不足を調べます。待ち行列や非同期ジョブへ移せる処理と、応答前に完了すべき処理を分けます。

クライアント側生成へ寄せると、スクリプト取得失敗、古いブラウザー、通信断、低速端末で空画面になる場合があります。最初の見出しや主要本文をHTMLへ含め、loading、空データ、エラー、再試行の状態を用意します。

ボタンやフォームはキーボードで操作できる要素を使い、更新を支援技術へ通知します。検索エンジンや共有リンクが必要なページは、初期HTMLとURLごとの内容を確保します。

フォーム、URL、Cookie、API応答はすべて入力です。型、長さ、範囲、形式をサーバーで検査し、SQLは準備済み文を使います。HTMLへ出す値はHTML、URLへ出す値はURLというように文脈に合わせてエスケープし、XSSを防ぎます。

認証済みでも全操作を許可せず、対象リソースごとに認可します。状態変更にはCSRF対策、レート制限、監査ログを組み合わせます。

データベースや外部APIが止まった場合、待ち続けずタイムアウトで区切ります。安全に再実行できる操作だけ再試行し、同じ注文が二重作成されないよう冪等性鍵などを使います。

動的サイトの設計は「画面を生成する技術選び」だけではなく、状態の正本、認可、キャッシュ境界、失敗時の一貫性を決めることです。