まとめ
- Cloudflare Pagesでは、
_redirects、_headersファイルに特別な挙動が割り当てられている -
_redirectsでは、リダイレクトルールを設定できる -
_headersでは、ヘッダールールを設定できる- クローラ向けのnoindexなどを設定可能
背景
当団（Orchestra Canvas Tokyo）では、Cloudflare Pagesを用いてホームページやブログを公開しています。
かつてはレンタルサーバー（ColorfulBox）を使用していました。
その際、.htaccessファイルを用いて以下のように設定していました。
- URLが変更されたページのリダイレクト
- 開発環境がクローラにインデックスされないよう、
X-Robots-Tag: noindexを付与
Cloudflare Pagesでは.htaccessを利用できません。
その代わり、リダイレクトやヘッダーをテキストファイルで管理できます。
_redirectsファイル
一般的な301（Moved Permanently）、302（Found）リダイレクトを設定できます。
ワイルドカード（splat）やプレースホルダーを利用し、柔軟なルールを作成可能です。
設定例
# 古いパス、新しいパス、ステータスコード
/old-source /new-source 301
# ワイルドカード（splat）を1つだけ使用可能
# `:splat`で参照できる
/old-contents/* /new-contents/:splat
# プレースホルダーを複数使用可能
/old-posts/:date/:slug /new-posts/:date-:slug
ステータスコードは省略可能で、デフォルトは302です。
基本的に301、302、303、307、308のみが利用可能です。
プレースホルダーの詳細
正規表現:[A-Za-z]\w*に一致する命名が有効です。
英字で始まり、英数字およびアンダースコアを含む形式です。
# 有効な例
:hoge
:hoge2
:hoge_fuga
:hoge_
# 無効な例
:_hoge
:2nd_hoge
:hoge-fuga
プロキシ
実は、ステータスコードとして200（OK）を指定することで、リダイレクトなしに別のURLのコンテンツを提供できます。
……この機能、レンタルサーバーをいじっていた頃からたびたび出会いますが、とてつもないロマンを感じるんですよね……
ロマン、感じませんか？
……感じませんよね……
閑話休題。
この機能を利用する場合、SEOへの影響を避けるためにcanonical URLの設定が推奨されています[1]。
_headersファイル
_redirectsと同じ形式で、ヘッダーを設定できます。
設定例（開発環境のインデックス禁止）
https://:project.pages.dev/*
X-Robots-Tag: noindex
各ファイルの配置
各ファイルはプロジェクト（のビルド成果物）のルートフォルダに配置する必要があります。
例えば、当団が使用しているSvelteKitの場合、staticフォルダに配置することで、想定通りの動作を得られます。
おわりに
Cloudflare Pagesは新しいサービスらしく、シンプルで分かりやすい設定が魅力です。
加えて、公式ドキュメントが非常に充実しており……ありがたい限りですね！
今後もドキュメント巡回がはかどりそうです🤤
次回演奏会のご案内
Orchestra Canvas Tokyoは、都内を中心に活動するアマチュアオーケストラです。
日々の癒しに、新たなひらめきのきっかけに——
オーケストラの演奏会はいかがでしょうか？
初めての方も大歓迎！
ご来場をお待ちしています。
Orchestra Canvas Tokyo
第14回定期演奏会2025年7月12日(土)
練馬区立練馬文化センター 大ホール
シューマン / 交響曲第2番 ほか
詳細はチケット販売ページにて
Discussion