このチュートリアルでは、既存の Cloudflare Workers Sites アプリケーションを Cloudflare Pages へ移行する方法を説明します。
前提として、Wrangler ↗ で作成した Cloudflare Workers Sites プロジェクトがある必要があります。
Cloudflare Pages は、サイト配信の各側面に組み込みのデフォルトを用意しています。Worker 内のカスタム動作（カスタムキャッシュロジックなど）は、Functions を使って Cloudflare Pages プロジェクトへ移植できます。ファイルベースのルーティングで扱いやすくなります。カスタムヘッダーとリダイレクトも Pages へ移行できます。
Worker がすでに複雑で、Pages のファイルベースルーティングへ分割するのが大変な場合もあります。そのようなときは、Pages プロジェクトの出力ディレクトリに _worker.js ファイルを置けます。
Cloudflare Pages へ移行すると、追加設定なしで プレビューデプロイ やブランチの自動デプロイが使えます。
Workers Sites プロジェクトは、次の要素で構成されます。
- 静的サイトツール で作ったアプリケーション、または静的な HTML、CSS、JavaScript ファイルの集まり。
- 静的サイトツールを使う場合、静的プロジェクトが HTML、CSS、JavaScript をビルドする出力ディレクトリ（Wrangler 設定ファイル では
bucket）。 - そのビルドディレクトリを配信する Worker アプリケーション。多くのプロジェクトでは
workers-siteディレクトリです。
Cloudflare Pages へ移すときは、Worker アプリケーションと、関連する Wrangler 設定ファイルやビルド成果物を削除します。代わりに、build コマンド（ある場合）と、プロジェクトディレクトリ内の Wrangler ファイルの bucket フィールド（ビルドディレクトリ）を控えておきます。
リダイレクトは、出力ディレクトリに _redirects ファイルを作成して Pages へ移行できます。高度なリダイレクトのサポートは現時点では限定的です。今後拡充されます。対応タイプの一覧は Redirects のドキュメント を参照してください。
_redirects ファイルに加えて、Cloudflare は Bulk Redirects も提供します。Pages の 2,100 件制限を超えるリダイレクトを扱えます。
カスタムヘッダーも、出力ディレクトリの _headers ファイルへ移せます。_headers で定義したカスタムヘッダーは、現時点では Functions のレスポンスには適用されません。Function のルートが URL パターンに一致する場合でも同様です。ヘッダーの扱い方は Headers を参照してください。
ビルドコマンド と ビルドディレクトリ を別の場所に控えたら、アプリケーションからそれ以外をすべて削除し、新しい版を git プロバイダーへプッシュします。Get started ガイド に従い、控えておいた ビルドコマンド と ビルドディレクトリ を使ってプロジェクトを Cloudflare Pages に追加します。
Pages プロジェクトにカスタムドメインを使う場合は、現在デプロイしている Workers アプリケーションと同じカスタムドメインを設定できます。カスタムドメインの追加 の手順に従ってください。
Workers サイトに独自のビルド設定がある場合は、Direct Upload でビルド済みアセットを Pages へ持っていけます。さらに、Wrangler CLI またはドラッグアンドドロップで、サイトのアセットを Cloudflare のグローバルネットワークへ配信できます。
これらの方法では、CLI またはダッシュボードから新しいプロジェクトを作成して名前を付けられます。デプロイが完了したら、カスタムドメインの追加 の手順で Pages プロジェクトにカスタムドメインを設定できます。
Pages アプリケーションをデプロイしたら、Worker を削除します。
-
Cloudflare ダッシュボードで Workers & Pages ページを開きます。
Workers & Pages を開く ↗ -
Worker を選びます。
-
Manage > Delete Worker を開きます。
Worker アプリケーションを削除すると、リクエストは Pages アプリケーションへ届きます。このガイドを完了すると、Workers Sites プロジェクトを Cloudflare Pages へ移行できています。