私の Jekyll サイトに CDN フロントエンドを与える -

📅 2025 年 11 月 14 日
|

⏱️ 約 5 分で読めます

.htaccess リダイレクトを維持しながら、Jekyll ベースのサイトを Bunny CDN の背後で動作させることができました。私がやった方法は次のとおりです…

最近 Jekyll に戻って以来、私はこのサイトを Ionos がホストする VPS で実行し、小さなデプロイスクリプトを使用してサイトを構築し、rsync を実行しています。

これはすべてうまくいきましたが、私は実際には、いくつかの画像とカスタムフォントをホストするだけではなく、Bunny CDN を使用したいと考えていました。静的サイトなので、すべてをストレージプラットフォームにダンプすることもできましたが、1 つのサイトに数トンのリダイレクトがあります。 .htaccess 長年にわたるさまざまなプラットフォームの移行によるファイル。

Bunny’s Edge Platform でもこれらを処理できたかもしれませんが、リダイレクトの数を考えれば、維持するのは大変だったでしょう。そこで私は、自分の Jekyll サイトの前に Bunny を簡単に置くことは決してできないだろうと考えて、仕事に取り掛かりました。

💡 その時、私はひらめきました。

を使用してバニープルゾーンを作成したらどうなるでしょうか kevquirk.com パブリックドメインとして使用し、VPS 上に別のドメインを設定し、そこでサイトをホストし、それをプルゾーンのオリジンとして使用しますか?

私の理論では、Bunny は依然として VPS からコンテンツをリクエストしているだろうということでした。 .htaccess リダイレクトはまだ機能する可能性があります。

…結局のところ、彼らはそうでした。

いくつかの小さなバグ

安全に実験できるように、ライブサイトを複製しました。セットアップは次のようになりました。

test.kevquirk.com – Bunny プルゾーンに設定されたドメイン
src.qrk.one – サイトが実際に存在する VPS 上のオリジンドメイン

最初にやらなければならなかったのは、 url 私のジキルのフィールド _config.yml から kevquirk.com に test.kevquirk.com、サイトを再構築して、にアップロードします src.qrk.one。

さて、あなたは次のように考えているかもしれません。 「ケブ、なぜ間違ったドメインでサイトを構築するのですか?」

しかし、私はそうではありません。テストドメインを使用してサイトを構築すると、すべてのリンクが次の場所を指します。 test.kevquirk.com/...。元のドメインで構築した場合、すべての内部リンクが間違った場所に誘導されてしまいます。これらは引き続き機能しますが、サイトは次から提供されます。 src.qrk.one、それは私が望んでいることではありません。

次にリダイレクトテストを行いました。訪れました /feed、ヒットするはずです .htaccess にリダイレクトします /feed.xml。リダイレクトは正常に機能しましたが、結果の URL は元のドメインから提供されていました。

だから見る代わりに test.kevquirk.com/feed.xml 見たよ src.qrk.one/feed.xml。

これは、Bunny が、私が入力したホスト名ではなく、独自のホスト名を使用してオリジンからファイルを要求したために発生しました。簡単に言うと:

訪れました test.kevquirk.com/feed。
バニーはキャッシュを確認しました。そこにはなかったので、ファイルの出所を尋ねられました。
しかし、Bunny は独自のホスト名 (src.qrk.one)、私が入力したものではありません。
Apache は、次からのリクエストを認識しました。 src.qrk.one/feed そして、 .htaccess にリダイレクトします /feed.xml。
次に、Apache は、指定されたホスト名を使用してリダイレクト URL を再構築しました。 src.qrk.one。

そこで、Apache は次のようにしました。

「ああ、欲しいのね /feed?もちろん。それは src.qrk.one/feed.xml。さあ、行きましょう…」

問題の解決

これは訪問者にとって何も問題にはなりませんが、私は望んでいませんでした src.qrk.one どこにでも現れる。見た目が汚かったです。

2 つの変更によりそれが修正されました。

有効にする ホストヘッダーの転送 私のバニープルゾーンで。
追加 test.kevquirk.com のドメインエイリアスとして src.qrk.one 私のVPS上で。

Forward Host Headers により、Bunny は訪問者が使用したホスト名を VPS に通知します。したがって、代わりに:

「私はこれを代表してお願いします」 src.qrk.one」

バニーはこう言います。

「私はこれを代表してお願いします」 test.kevquirk.com、ない src.qrk.one」

ドメインエイリアスにより、Apache がそのホスト名を受け入れ、正しく提供できるようになります。

魔法。 🪄🐇

もう 1 つ再確認する必要があるのは、すべてのページに適切な設定が設定されていることです。 canonical URL。元のドメインはパブリックにアクセスできるため、クローラーはどのドメインが本物であるかを知る必要があります。それは常に Bunny プルゾーンドメインである必要があります。

Jekyll ではこれは簡単です。以下を追加します head レイアウトのセクション:

 rel="canonical" href="{{ page.url | absolute_url }}">

最後のストレート

リダイレクト動作が整理されたので、最後のステップはデプロイスクリプトにパージステップを追加して、新しい投稿を公開したり何かを更新したりするたびに Bunny が最新バージョンをフェッチできるようにすることでした。

私が追加したスニペットは次のとおりです。

# --- Clear Bunny Cache ---
echo "🗑 Clearing Bunny Cache..."
PURGE_RESPONSE=$(curl -s -o /dev/null -w "%{http_code}" -X POST \
  -H "AccessKey: $BUNNY_ACCESS_KEY" \
  "https://api.bunny.net/pullzone/$PULL-ZONE-ID/purgeCache")

if ( "$PURGE_RESPONSE" -ne 200 ) && ( "$PURGE_RESPONSE" -ne 204 ); then
  echo "⚠️  Bunny purge failed (HTTP $PURGE_RESPONSE)"
  exit 1
fi

Bunny API キーとプルゾーン ID をスクリプトの先頭で変数として設定します。の if ステートメントは単に次のように述べています。 「応答が 200 または 204 でない場合は、何が問題だったかを Kev に伝えてください。」

それで終わりです。昨夜、スイッチを入れました。 Bunny CDN は現在、ライブサイトの前に座っています。また、Ionos では Plesk ライセンスに追加料金がかかるようになったため、VPS を Ionos から Hetzner に移動しました。新しいサーバーのコントロールパネルとしてヘスティアを使用しました。

バグを見つけた場合は、ぜひお知らせください。ただし、現在はすべてが順調に進んでいるはずです。（私がそこで何をしたかわかりますか？神様、私は面白いです！）

✉️メールで返信

Source link