◉ANTIGRAVITY LABEN
記事一覧/アプリ開発
▣ アプリ開発/2026-09-29上級

Cloudflare をパージしても古い壁紙が届き続けた原因は、オリジン側で JPEG を握っていた XPageSpeed

同じ URL に上書きした壁紙画像が、Cloudflare をパージしても古いまま届き続けた運用の記録です。ローカル・オリジン・エッジの三者を突き合わせて層を名指しする検査、プレフィックスパージの使いどころ、Xserver の XPageSpeed を .htaccess で安全に切る書き方まで扱います。

Cloudflare3キャッシュXserver画像配信2個人開発101Antigravity376

✦ プレミアム記事

九月のなかば、浮世絵壁紙の新しい素材を配信ツリーへ重ねた翌朝のことです。実機でアプリを開き、新しい ID の一覧をなぞっていくと、絵は確かに増えておりました。ところが、同じ ID のまま差し替えたはずの数枚が、前の版のままで並んでおります。紙の縁を削り直し、クロップの位置を直した、あの手直しが一枚も届いておりませんでした。

上書きは済んでおりました。エージェントの報告も「上げました」で終わっておりました。それでも古いのです。私は Cloudflare のダッシュボードを開き、該当する URL をパージしました。ここまでは、いつもの手順です。

手が止まったのは、パージのあとも同じ絵が出続けたときでした。エッジを空にしたのに古い——その時点で、私は配信経路に自分が数えていなかった層があることを認めるしかなくなりました。

配信経路には、数えていなかった層がありました

個人開発で運用している壁紙アプリの画像は、Xserver 上のストレージ用ドメインをオリジンにして、Cloudflare のエッジを通してアプリへ届けております。画像は一度公開したら変わらない前提で、Cache-Control: public, max-age=31536000, immutable を返しています。一年、書き換えない約束です。

その約束を、私自身が破りました。同じ ID の画像を、同じ URL に上書きしたのです。ID を変えれば済む話ではありましたが、アプリ側のお気に入りや通知の参照が ID に紐づいているため、差し替えは同一 URL で行う方針にしております。

ここで私が頭に描いていた経路は「ローカルのファイル → オリジン → エッジ → アプリ」の三段でした。実際には、オリジンの中にもう一段ありました。Xserver の XPageSpeed が、静的な JPEG を最適化版に書き換え、元の URL のままその最適化版を返していたのです。この段は、Cloudflare からは見えません。

層誰が持っているか古くなる条件見分ける手がかり
ローカル手元のステージング上げ漏れ・merge 失敗ファイルが無い/サイズが違う
オリジンの最適化層Xserver の XPageSpeed上書き後も最適化版を返すetag: W/"PSA-…"・Last-Modified が消える
オリジンの素の応答Apache の静的配信本来は上書き直後に新しくなる?cb= 付きで取ると新しい
エッジCloudflareimmutable のままパージ前cf-cache-status: HIT と age

表にすると当たり前に見えますが、私はこの二行目を数えておりませんでした。

「上げました」を、三者の突き合わせに置き換えました

最初に見直したのは、確認の仕方そのものです。それまでの私は、アップロード後にブラウザで数枚を開いて目で確かめておりました。目で見る確認は、エッジが返した一枚を見ているだけで、オリジンが何を持っているかは分かりません。

そこで、同じ画像を三つの経路で取り、突き合わせる小さなスクリプトを置きました。要は、?cb=$RANDOM を付けてオリジンの真の姿を見ることです。素の URL と食い違えば、そのあいだのどこかが古い、と判定できます。

#!/usr/bin/env bash
# 同じ画像を「素の URL」と「cb 付き」で取り、ヘッダとサイズを並べる
# 使い方: ./probe.sh 1353   (壁紙 ID)
set -eu
ID="$1"
BASE="https://storage.example.com/ios/wallpaper_apps/ukiyo-e/6_5inch/wallpaper"
URL="${BASE}/wallpaper${ID}.jpg"
LOCAL="./_out_ukiyo-e/ios/6_5inch/wallpaper/wallpaper${ID}.jpg"
 
probe() {
  # -D で応答ヘッダを stderr 側に逃がし、本文はサイズだけ数える
  local u="$1"
  curl -sS -D /tmp/h.$$ -o /tmp/b.$$ "$u"
  local size; size=$(wc -c < /tmp/b.$$ | tr -d ' ')
  printf '%-8s size=%-8s cf=%-8s age=%-6s etag=%s lm=%s\n' \
    "$2" "$size" \
    "$(grep -i '^cf-cache-status:' /tmp/h.$$ | awk '{print $2}' | tr -d '\r')" \
    "$(grep -i '^age:' /tmp/h.$$ | awk '{print $2}' | tr -d '\r')" \
    "$(grep -i '^etag:' /tmp/h.$$ | cut -d' ' -f2- | tr -d '\r')" \
    "$(grep -i '^last-modified:' /tmp/h.$$ | cut -d' ' -f2- | tr -d '\r')"
  rm -f /tmp/h.$$ /tmp/b.$$
}
 
printf '%-8s size=%s\n' local "$(wc -c < "$LOCAL" | tr -d ' ')"
probe "$URL" edge
probe "${URL}?cb=$RANDOM" origin

このスクリプトが返す三行を並べると、事故の種類が読めます。ローカルとオリジン(cb 付き)のサイズが違えば上げ漏れです。オリジンは新しいのにエッジだけ古く cf=HIT と age が出ていれば、パージで直ります。そして、cb を付けてもサイズが古いまま、etag が W/"PSA- で始まっているなら、オリジン側の最適化層が握っております。九月の朝に私が見たのは、この三つ目でした。

エージェントの完了報告を信じない、という話は エージェントの定期実行で、失敗より先に「走らなかった」を疑うようになりました にも書き残しましたが、今回は少し向きが違います。報告は正しかったのです。上書きは本当に済んでいました。正しい報告のあとに、誰にも見えない層が古い版を返していただけでした。

✦

ここまでお読みいただきありがとうございます。

この記事の続きを読む

この先には、実装コードやベンチマーク結果など、実務でお役に立てる内容をご用意しています。このサイトは広告を掲載しておらず、サーバーや開発にかかる費用はメンバーの皆様のご支援で成り立っています。もしお役に立てていましたら、ご支援いただけますと大変ありがたいです。

この記事で得られること
✦上書き配信した画像が古いまま届くとき、ローカル・オリジン・エッジの三者を突き合わせて、どの層が握っているかを名指しできるようになります
✦Cloudflare のパージが効かない応答ヘッダの特徴が分かり、オリジン側の画像最適化を安全に切ってから再パージする順番を自分の環境で再現できるようになります
✦「すべてをパージ」でオリジンへ大量に戻してしまう前に、プレフィックスと URL 単位のどちらで消すかを件数から判断でき、翌朝に古い画像を見つけてやり直す時間を省けるようになります
Stripe による安全な決済 · いつでもキャンセル可能
✦

この記事を購入する

この先の内容をすべてお読みいただけます。一度のご購入で、いつでも何度でもアクセスできます。このサイトは広告を掲載しておらず、皆さまのご支援がサーバー費用などの運営を支えています。

または
メンバーシップなら全記事が読み放題 →
シェア

お読みいただきありがとうございます

Antigravity Lab は広告なしで運営しており、サーバー費用などの運営コストはメンバーシップのご支援で賄っています。実装コード・ベンチマーク・本番設計パターンなど、実務でお役立ていただける記事を毎日更新しています。もし読んでよかったと感じていただけましたら、ぜひご覧ください。

  • ✦コピー&ペーストで使える実装コード付き
  • ✦毎日新しい上級ガイドを追加
  • ✦¥580/月 または ¥2,480 の永久アクセス
メンバーシップを見る →

関連記事

⬡ 連携・プラグイン2026-06-09
壁紙アプリの画像配信を解像度バケット方式で組み直す — Antigravity エージェントに変換と検証を任せた運用設計
端末解像度が増えるたびに壁紙アプリの配信は重くなります。1枚の原画を全端末へ配る方式をやめ、解像度バケット+WebP/AVIF+エッジリダイレクトに組み直し、変換と検証を Antigravity エージェントに任せた運用設計を、実際のコードと閾値ごと残しました。
▣ アプリ開発2026-09-19
見積書 PDF の自動化を一度にまとめて頼み、4 つに割り直すまで
受託の見積書を毎回コピーして作っていた手作業を、Antigravity に頼んで小さな PDF 出力ツールへ移した記録です。最初に全部をまとめて頼んで作り直すことになった理由と、データ・計算・見た目・保存の 4 つに割って渡し直した順番を、動くコードと一緒に書き残します。
▣ アプリ開発2026-07-05
自己デバッグのエージェントに、本番の広告を叩かせない — AdMob 無効トラフィックを断つ三層の遮断
Antigravity 2.0 の実ブラウザ自己デバッグが本番の AdMob 広告を描画すると、無効なトラフィックとして計上されます。テスト広告の強制・ネットワーク遮断・preflight ゲートの三層で、広告に触れない検証環境を作る手順を、実測値とともにまとめました。
📚RECOMMENDED BOOKS
大規模言語モデル入門
山田育矢
LLM開発
生成AIプロンプトエンジニアリング入門
我妻幸長
プロンプト
Claude CodeによるAI駆動開発入門
平川知秀
AI駆動開発
※ アフィリエイトリンクを含みます