CDNの仕組み｜動画や画像が近くから届くまで

漫画：二台目へは、控えから 全4ページ

マコトとピコは、二つの模型端末から同じ傘の画像を求める。最初の端末Aには、元から取得した画像を返してエッジに控えを置く。次の端末Bではマコトが控えを確かめ、元へ戻らない返し方を選んで道を引き直す。

先に本文の解説を読む ↓

画像を押すと拡大できます。＋／−で大きさを変え、拡大中はドラッグして読めます。

1 / 4二台で、同じ画像を見たい

マコトとピコがラボの床に二つの端末模型を置く。AとBはどちらも同じ傘の画像を求める。エッジの控えはまだ空。

1ページ目のセリフ

• 端末模型の札「A」「B」
• マコト「同じ画像を、二台へ届けよう。」

2 / 4初回は、元から受け取る

模型のオリジンからエッジを通り、端末Aへ傘の画像が返る。保存できる例としてエッジにも控えを置く。

2ページ目のセリフ

• 模型の流れ「オリジン」→「エッジ」→「端末A」

3 / 4次のお願いは、控えから

端末Bからエッジへ次のお願いが来る。使える傘の控えがあるので、エッジからBへ返す模型例を追う。背景に元の模型は残るが、ここで使う矢印はエッジとBの間だけ。

3ページ目のセリフ

• 模型の役割「エッジ」・「端末B」
• 行き「お願い」、戻り「返事」

4 / 4同じ控えを、使えるときに

AとBの模型端末に同じ傘の絵が見える。マコトはエッジの控えを確かめ、次の要求で使った短い返り道を示す。

4ページ目のセリフ

• 端末の札「A」「B」
• マコト「次は、控えから返せるね。」

横にスワイプして次のページへ。画像を押すと拡大できます。

端末A・Bと傘の絵は、同じ公開画像を条件の合う要求へ再利用する模型例です。A・BはIPアドレスや実際の利用者を示していません。すべての応答がキャッシュできるわけではなく、再利用の条件や有効性の確認が必要です。実際には取得中に返す場合や複数階層のキャッシュもあり、全取得が終わるまで必ず待つ、常に同じ拠点へ届く、必ず速いとは示していません。

本文の解説へ ↓

閉じる ×

← 前

−

100%

＋元の大きさ

次 →

拡大中はマウスや指でドラッグできます。100%では左右スワイプ・左右キーでページ送り。

画像が近くから届くまでの流れ

Webページの画像を例にすると、流れは次のようになります。

1. ブラウザが画像URLをリクエストする
2. DNSやCDNの制御により、近いエッジサーバーへ向かう
3. エッジサーバーがキャッシュを確認する
4. 控えがあれば、そのままブラウザへ返す
5. 控えがなければ、オリジンサーバーへ取りに行く
6. 取得したデータを返し、必要に応じてエッジ側に保存する

この流れで「近い場所から返す」と「同じデータを再利用する」が両方働きます。どちらか一つではなく、ネットワーク距離とキャッシュの組み合わせとして見ると理解しやすくなります。

オリジンとエッジを二本の矢印で描く

紙の中央にオリジンサーバー、手前にエッジサーバーを描き、「最初は元へ取りに行く／次から近くの控えを返す」と矢印を二本足してみてください。役割名を短く確認したいときは、CDNとは へ戻れます。

元のサーバーと近い配信拠点を描いたら、自分を近い拠点のそばに置いてください。距離を一つ短くできる理由が見えたら、配信の工夫をつかめています。

古いテレビの横で、CDNと書かれた本館と近くの分室を結ぶ貸出票が小さく光りました。マコトとユイとピコはラボの椅子を寄せ、サーバー図書館へ入る前に「まず何が知りたいのか」を確認します。

第57話「CDNはなぜ近くから届く？ 配信の分室を訪ねよう」では、本館と近い分室を行き来する貸出票から、この二つの役割を場面でたどれます。

先にCDNそのものの意味を確認したい場合は、CDNとは を横に置くと、エッジサーバーとオリジンの役割を分けやすくなります。

CDNの役割と仕組みの全体像

一度取得したデータは、設定された時間や条件に応じてエッジ側に保存されます。次に同じ画像や動画を求める利用者が来たとき、オリジンまで戻らずに返せる場合があります。

ユイ

画像を更新したのに古いままなら、オリジンと近い配信拠点のどちらを見るんですか？

マコト

まず元の画像、その次にCDNの控え、最後にブラウザの控えを分けよう。

ピコ

本館から分室へ貸出票を追えば、どの控えが残ったか見えるよ。

キャッシュヒットとキャッシュミス

CDNで重要なのが、キャッシュヒットとキャッシュミスです。

• キャッシュヒット: エッジサーバーに控えがあり、そこから返せる
• キャッシュミス: 控えがなく、オリジンへ取りに行く
• パージ: 古い控えを削除して取り直させる
• TTL: 控えをどれくらい有効にするかの時間

ラボのたとえでは、近くの配達拠点に箱があればすぐ渡せます。箱がなければ中央倉庫へ問い合わせます。実際にはHTTPヘッダーやCDN設定が関わり、どのデータをどれくらい置くかが決まります。

更新した画像が変わらない理由と注意点

CDNを使うと、更新したはずの画像が古いまま見えることがあります。これは、エッジサーバーやブラウザに古い控えが残っている場合があるためです。

確認するときは、次を分けます。

1. オリジンサーバーの画像は新しいか
2. CDNのキャッシュが残っていないか
3. ブラウザのキャッシュが残っていないか
4. ファイル名やURLを変える設計になっているか
5. キャッシュ削除の操作が反映されたか

この順番にすると、オリジンの問題、CDNの問題、ブラウザ側の問題を混ぜずに見られます。

CDNを説明するミニワーク

次の言葉を、配達のたとえで一言にしてみましょう。

• オリジンサーバー:
• エッジサーバー:
• キャッシュヒット:
• キャッシュミス:

答えの例は、中央倉庫、近くの配達拠点、拠点に控えがある、控えがなく中央へ取りに行く、です。最後に実際の言葉に戻して、サーバーとキャッシュの話だと説明します。

CDNの仕組みの確認クイズ

Q1. エッジサーバーに控えがある状態を何と呼びますか？

キャッシュヒットです。

Q2. CDNはオリジンサーバーを完全に不要にしますか？

不要にするとは限りません。元データや更新元としてオリジンが必要な構成が多くあります。

Q3. 古い画像が残るとき、どこを確認しますか？

オリジン、CDNキャッシュ、ブラウザキャッシュを分けて確認します。

ラボの地図を持ち帰る

ラボの明かりが少し落ちるころ、CDNの地図だけが机の上に残りました。マコトは「最初より怖くなくなった」と言い、ユイは大事な線を一本だけ引き直しました。