メインコンテンツへスキップ

Render.comにて静的ホスティングしているサイトにCloudflareでリダイレクトをかける

Author: Yutaro Iwamoto

はじめに

Webサイトを運営していると、URLの変更やドメインの移行などでリダイレクト設定が必要になることがあります。特に異なるドメイン間でのリダイレクトは、SEO対策やユーザーエクスペリエンスの観点から重要です。

Render.comは優れた静的サイトホスティングサービスを提供していますが、同一ドメイン内でのリダイレクト機能しか提供していません。異なるドメイン間でのリダイレクトを実現するには、CloudflareのようなDNSおよびCDNサービスを活用する必要があります。

この記事では、Render.comでホスティングしている静的サイトに対して、Cloudflareを使用して異なるドメイン間のリダイレクトを設定する方法を解説します。

Render.comのリダイレクト機能の制限

Render.comでは、静的サイトに対して以下のようなリダイレクト設定が可能です:

  • 同一ドメイン内でのパスリダイレクト(例:/old-page → /new-page)
  • ワイルドカードを使用したリダイレクト(例:/docs/:any → /:any)

しかし、異なるドメイン間のリダイレクト(例:example.com → new-example.com)は、Render.comの標準機能では実現できません。これは、Render.comのリダイレクト機能が「ドメインルート」に対してのみ適用可能であり、ドメイン全体を別のドメインにリダイレクトする機能がないためです。

Render.comのダッシュボードでリダイレクトルールを設定する際には、以下のような警告メッセージが表示されます:

You can't apply redirect/rewrite rules to your domain root. Each Source requires at least one URL path component (such as /blog, or even /).

Cloudflareを使用した異なるドメイン間のリダイレクト設定

Cloudflareを使用することで、Render.comの制限を回避し、異なるドメイン間のリダイレクトを実現できます。以下に、その手順を説明します。

前提条件

  • Render.comでホスティングされた静的サイト
  • Cloudflareアカウント
  • リダイレクト元とリダイレクト先のドメイン

手順1:Cloudflareにドメインを追加する

  1. Cloudflareにログインし、「Add a Site」をクリックします。
  2. リダイレクト元のドメイン(例:old-domain.com)を入力し、「Add Site」をクリックします。
  3. プランを選択します(無料プランでもリダイレクト機能は利用可能です)。
  4. Cloudflareが提供するネームサーバーを、ドメインレジストラの設定に追加します。
  5. ドメインのDNS設定が反映されるまで待ちます(通常は24時間以内)。

手順2:Render.comのサイトをCloudflareに接続する

  1. Cloudflareのダッシュボードで、「DNS」タブを選択します。

  2. 「Add Record」をクリックし、以下の設定を行います:

    • Type: CNAME
    • Name: www(またはサブドメイン)
    • Target: あなたのRender.comのサイトURL(例:your-site.onrender.com)
    • Proxy status: Proxied(オレンジの雲アイコン)
  3. ルートドメイン(apex domain)を設定する場合は、以下の設定を行います:

    • Type: CNAME
    • Name: @
    • Target: あなたのRender.comのサイトURL
    • Proxy status: Proxied

手順3:リダイレクトルールの設定

  1. Cloudflareのダッシュボードで、「Rules」→「Redirect Rules」を選択します。
  2. 「Create Redirect Rule」をクリックします。
  3. ルールに名前を付けます(例:「Domain Redirect」)。
  4. 「When incoming requests match...」セクションで、以下の設定を行います:
    • 「Wildcard pattern」を選択
    • Request URL: http://*old-domain.com/*(リダイレクト元ドメイン)
  5. 「Then...」セクションで、以下の設定を行います:
    • Target URL: https://new-domain.com/$2(リダイレクト先ドメイン)
    • Status code: 301(恒久的リダイレクト)
  6. 「Save」をクリックして設定を保存します。

手順4:SSL/TLS設定の確認

  1. Cloudflareのダッシュボードで、「SSL/TLS」→「Overview」を選択します。
  2. 暗号化モードを「Full」に設定します。これにより、Cloudflareとあなたのサイト間の通信も暗号化されます。

リダイレクトの動作確認

設定が完了したら、以下の方法でリダイレクトが正しく機能しているか確認します:

  1. ブラウザでリダイレクト元のURLにアクセスします(例:http://old-domain.com)。
  2. 自動的にリダイレクト先のURL(例:https://new-domain.com)に転送されることを確認します。
  3. ブラウザの開発者ツールを使用して、HTTPステータスコードが301(恒久的リダイレクト)であることを確認します。

まとめ

Render.comは優れた静的サイトホスティングサービスですが、異なるドメイン間のリダイレクト機能には制限があります。Cloudflareを活用することで、この制限を回避し、SEOに配慮した適切なリダイレクト設定を実現できます。

Cloudflareの無料プランでも十分なリダイレクト機能が提供されているため、コスト効率よく実装可能です。また、Cloudflareを導入することで、CDN機能やDDoS保護など、サイトのパフォーマンスとセキュリティも向上させることができます。

ドメイン移行やサイトリニューアルの際には、適切なリダイレクト設定を行い、ユーザーエクスペリエンスとSEO価値を維持することが重要です。