2025年版では、Cloudflare WorkersとPagesを使ってProxyウェブサイトのリバースプロキシを設定する方法を説明します

CloudflareはWorkersとPagesを使用してウェブサイトのリバースプロキシを展開します

使用クラウドフレア労働者とページプロキシウェブサイトのリバースプロキシは、アクセス速度の向上、制限の回避、送信元アドレスの隠蔽などに役立つ非常に実用的な方法です。以下は、これら2つを用いてリバースプロキシ機能を実現する方法を簡潔に説明したチュートリアルです。このプロセス全体は、サーバーを独自にホスティングする必要はなく、Cloudflareのエッジコンピューティング機能を利用して完了できます。

Cloudflare は単なる CDN サービスプロバイダーではなく、高性能、低レイテンシー、安全で信頼性の高いグローバルネットワークプラットフォームです。

Cloudflareは、グローバルエッジコンピューティングアーキテクチャにより、静的および動的コンテンツの配信を効率的に高速化するとともに、帯域幅利用を最適化するための精密なキャッシュ戦略を提供します。さらに、無制限のDDoS防御メカニズムを内蔵しており、さまざまなネットワーク攻撃に効果的に対抗し、ビジネスの安定性とセキュリティを確保します。

今日は、Cloudflare Workers と Cloudflare Pages を使用して効率的なリバースプロキシサービスを構築し、分散コンピューティングとエッジネットワークアクセラレーションにおける Cloudflare の利点を最大限に活用します。

ウェブサイトのリバースプロキシを設定する前の準備

Cloudflareアカウント

まだアカウントをお持ちでない場合は、クラウドフレアサインアップ！

Cloudflare アカウントの登録プロセスは比較的簡単で、Google アカウント、Apple アカウント、またはカスタムメールを使用して登録できます。

登録にはGoogleアカウントの利用がおすすめです。Googleアカウントは海外の人気サイトをほぼ網羅しており、ログインにも利用できます。まだGoogleアカウントをお持ちでない方は、ぜひご登録ください！

ドメインを有効化

ドメイン名をCloudflareに移管する必要があります。Cloudflareでドメイン名を有効化する方法がわからない場合は、こちらの手順をご覧ください。

Cloudflare を有効にするには、ネームサーバーを更新する必要があります。

Cloudflare のバックグラウンドで新しいドメイン名を追加し、ドメイン名を入力して、デフォルトで [クイックスキャン DNS レコード] を選択し、[続行] をクリックします。

無料プランを選択するとドメイン名が正常に追加されます。

次に、ドメイン名が登録されているウェブサイトにログインします。バックエンドに入ったら、DNSセキュリティ（DNSSEC）設定を見つけて無効にします。デフォルトで無効になっている場合は無視してください。後からCloudflare経由で再度有効にすることができます。

現在のネームサーバーを、Cloudflare によって割り当てられたネームサーバーに置き換えます。

注: 各ドメイン名には異なるネームサーバーが割り当てられます。重複するネームサーバーを削除し、「ネームサーバー1」と「ネームサーバー2」にCloudflareのネームサーバーを入力してください。

namesilo を例に挙げてみましょう。

バックグラウンドでドメイン名をクリックし、ドメイン名操作ページに入り、ネームサーバーを編集し、ネームサーバー内のコンテンツを削除します。

ネームサーバーを変更したら保存してください。地域によっては有効時間が遅くなる場合がありますので、今のところは有効時間を気にする必要はありません。

Cloudflareのバックグラウンドでは、ドメイン名のステータスが「アクティブ」の場合、そのネームサーバーが有効になっていることを意味します。ネームサーバーが有効になっていない、または誤って変更されている場合は、ネームサーバーが無効であると表示されます。

GitHubアカウント

まだアカウントをお持ちでない場合は、GitHubサインアップ！

GitHubでアカウントを作成するには、メールアドレスでのみ登録できます。Gmailでの登録をお勧めします。

確認コードをメールボックスで受け取ります。入力後、アカウントの登録が完了します。

WorkersとPagesを使用してWebサイトのリバースプロキシを展開する

次に、WorkersとPagesを使用してウェブサイトのリバースプロキシをデプロイします。ウェブサイトのリバースプロキシをデプロイする方法は2つあります。デプロイ手順を実際に見てみましょう。

予防

Workers メソッド: _worker.js をコピーし、Cloudflare に保存してデプロイします。
ページ方式: リポジトリをフォークし、GitHub を Cloudflare に接続してワンクリックでデプロイします。
Workers vs Pages：Workersは純粋な動的プロキシに適していますが、Pagesは静的コンテンツと動的機能を混在させるのに適しています。単純なリバースプロキシであれば、Workersの方がより直接的なアプローチとなります。
無料割り当て: Cloudflare の無料利用枠では、1 日あたり 100,000 件の Workers リクエストが提供され、Pages にも同様の制限があります。これは個人使用には十分ですが、大規模なトラフィックには有料プランが必要になる場合があります。
中国国内からのアクセス：workers.dev および pages.dev は中国本土ではアクセスが制限されている可能性があります。カスタムドメイン名のバインドをお勧めします。
セキュリティ: 利用規約に違反しないように、対象の Web サイトがプロキシアクセスを許可していることを確認します。

Cloudflare Workersを使用してリバースプロキシを実装する

Cloudflare Workers は、Cloudflare のグローバルエッジノードで実行されるサーバーレススクリプトであり、HTTP リクエストを簡単に処理して対象の Web サイトに転送できます。

ステップ1：Cloudflareにサインアップしてログインする

Cloudflare アカウントをまだお持ちでない場合は、公式 Web サイトで登録してログインしてください。

ステップ2: ワーカーを作成する

Cloudflare ダッシュボードで、左側の「Compute (Workers)」の下にある「Workers and Pages」をクリックし、「Quick Start」を選択します。

ワーカーに名前を付けます (デフォルトでは yourname.workers.dev のようなドメイン名が生成されます)。

名前を入力したら、「デプロイ」をクリックしてデプロイページに入ります。

[コードの編集] をクリックしてワーカーエディターに入り、デフォルトのコードを削除して、次の簡単なリバースプロキシスクリプトを貼り付けます。

ステップ3: リバースプロキシスクリプトを作成する

カスタムJavaスクリプトを作成します。リバースプロキシスクリプトの例を以下に示します。

addEventListener('fetch', event => { event.respondWith(handleRequest(event.request)); }); async function handleRequest(request) { const url = new URL(request.url); // リクエストの転送先となるターゲット Web サイト const targetHost = 'example.com'; // プロキシするドメイン名に置き換えます url.hostname = targetHost; // 新しいリクエストを作成します const newRequest = new Request(url, request); return await fetch(newRequest); }

このスクリプトは、ワーカーに送信されたすべてのリクエストを example.com に転送します。

ステップ4: デプロイメントを保存する

右上隅の青いボタン「デプロイ」をクリックすると、ワーカーがオンラインになります。 https://your-worker-name.yourname.workers.dev ぜひ訪れてみてください。

ステップ5: ドメイン名を設定する

workers.dev ドメイン名は国内ではアクセスできないため、新しいドメイン名を設定する必要があります。

[構成オプション] の [ドメインとルート] メニューで、[追加] をクリックします。

「カスタムドメイン」を選択し、ドメイン名を入力して保存します。これでドメイン名が正常に追加され、新しいドメイン名でアクセスできるようになります。

ここまでで、Cloudflare Workers を使ったリバースプロキシ機能が実現しました。とても簡単です。次に、Pages を使ってウェブサイトのリバースプロキシを展開します。

Cloudflare Pagesを使用してウェブサイトのリバースプロキシを展開する

Cloudflare Pagesは、Gitリポジトリの自動デプロイメント機能を組み合わせた静的ウェブサイトホスティングプラットフォームで、フロントエンドプロジェクトの迅速な立ち上げに適しています。最近、Functions機能（基本的にはWorkersの派生版）が追加され、エッジで動的なコードを実行できるようになりました。

Cloudflare Pages は主に静的 Web サイトのホストに使用されますが、Functions (Workers ベースの関数) と組み合わせることでリバースプロキシを実装することもできます。

Cloudflare Pages を使用してリバースプロキシの展開を始めましょう。

ステップ1: Pagesプロジェクトを作成する

Cloudflare ダッシュボードの「Workers and Pages」の下で、「Create」をクリックし、「Pages」を選択して、「Connect to Git」をクリックします。

GitHub または GitLab リポジトリを接続します (たとえば、index.html のみを含む単純な空の静的プロジェクトを作成できます)。

ステップ2: リポジトリに接続する

ここではGitHubを例に挙げます。まず、GitHubでプロジェクトを作成する必要があります。

Githubにリポジトリを作成し、コードを追加してログインしますギットハブ次に、下の図のように、「リポジトリの作成」をクリックして、「Cloudflare Pages」という名前のプライベートリポジトリを作成します。

新しいリポジトリを作成するときは、プライベートを選択する必要があることに注意してください。そうしないと、誰でもアクセスできるようになります。

次に、新しいファイルを作成します。「新しいファイルの作成」をクリックしてファイルを作成します。

次に、_worker.js という名前のファイルを作成し、次のコードをコピーして、5 行目の一重引用符を反転する Web サイトに変更し、変更を保存してコミットします。

リバースプロキシのjsコードではドメイン名にhttpsやhttpなどの文字を追加しないように注意する必要があります。

export default { async fetch(request, env) { let url = new URL(request.url); if (url.pathname.startsWith('/')) { url.hostname = 'Inverse address' let new_request = new Request(url, request); return fetch(new_request); } return env.ASSETS.fetch(request); }, };

Cloudflare Pages に戻ったら、GitHub を選択し、「GitHub に接続」ボタンをクリックします。

ページが Github にジャンプし、「インストールと認証」ボタンをクリックします。

接続するにはパスワードを入力してください。接続が成功したら、Cloudflare Pagesに戻ります。

リポジトリを選択したら、「セットアップの開始」をクリックします。

[ビルドとデプロイの設定] ページで、プロジェクト名を変更するか、デフォルトを使用して、[保存してデプロイ] をクリックできます。

多くの人は、最初にデプロイを開始するときに失敗します。

これは、Cloudflare Pages のビルドシステムバージョンが v2 にアップグレードされたためです。プロジェクトの設定でビルドシステムバージョンを v1 に変更し、再デプロイすると成功します。

デプロイが成功したら、カスタムドメインに別のドメイン名をバインドできます。

これで、Cloudflare Pages のリバースプロキシの設定が完了しました。簡単ですね。

WorkersとPagesを使用したリバースプロキシの導入の違いとメリットとデメリット

労働者シナリオの選択:

次のような強力なリバースプロキシ機能が必要です。

すべての種類の応答コンテンツ (HTML、XML、JSON など) を変更します。
複雑な置換ルールや動的ルーティングを処理します。
応答ヘッダーまたはキャッシュポリシーを正確に制御します。

パフォーマンス要件は高く、すべてのロジックをサーバー側で完了する必要があります。

エッジコンピューティングを伴うプロジェクト、またはグローバルな低遅延応答を必要とするプロジェクト。

ページシナリオの選択:

リバースプロキシの要件は、HTML のみをプロキシし、少量の置換を行うなど、シンプルです。

このプロジェクトは主に、単純なリバースプロキシまたはリダイレクトのみを備えた静的 Web サイトです。
追加コストは不要で、無料割り当てに頼るだけです。
開発チームはフロントエンド開発に精通しており、静的ファイルの展開を好みます。

複数のコンテンツ置換ルール（タイトル、URL、画像など）を適用します。比較した結果、以下の提案が示されます。

労働者：
利点: スクリプトを完璧に実装し、すべての置換をサーバー上で直接完了し、正規表現と複数のコンテンツタイプをサポートし、より優れたパフォーマンスとユーザーエクスペリエンスを提供できます。
推奨される理由: 要件に複雑な置換ルール (複数の正規表現の一致) と URL 書き換えが含まれる場合は、Workers がより適しています。
ページ:
制限事項: 置換はクライアント側の JS を通じてのみ実行でき、パフォーマンスは低く、HTML 以外のコンテンツや応答ヘッダーは処理できません。
適用性: 予算が限られていて、HTML のみをプロキシしたい場合はこれを使用できますが、エクスペリエンスは Workers ほど良くありません。

推奨ソリューション：Cloudflare Workers をご利用ください。リバースプロキシとコンテンツ置換のニーズを完全に満たし、優れたパフォーマンスと柔軟性を備えています。

5/5 - (1票)