ドメインとDNS設定ガイド：独自ドメインをCloudflare Workersに接続する
English · 繁中 · Español · 日本語 · Português (BR)
著者： Danko Peng（@dankopeng）
更新： 2026年3月
読了時間： 約8分
ドメインとは何か？
アプリをデプロイすると、最初はyour-app.workers.devのようなURLが割り当てられる。これでも動くが、本番サービスとして使うにはyourapp.comのような独自ドメインが必要だ。
ドメインはインターネット上の住所だ。vibefast.app、google.com、github.com——これらがドメインだ。
ドメインはドメインレジストラ（取得サービス）で購入する。主なレジストラ：
- Cloudflare Registrar（最も統合がシンプル）
- Namecheap
- Google Domains
Cloudflare Workersを使うなら、ドメインもCloudflare Registrarで取得するのが最もシンプルだ。 設定の手順が大幅に省ける。
DNSとは何か？
ドメインを取得しただけでは、ユーザーがそのドメインにアクセスしたときにどこに接続するかをインターネットは知らない。それを教える仕組みが DNS（Domain Name System） だ。
DNSはドメイン名をIPアドレスやサーバーに対応させる電話帳のようなものだ。
主なDNSレコードの種類：
| レコードタイプ | 用途 |
|---|---|
A | ドメインをIPアドレスに紐付ける |
CNAME | ドメインを別のドメインに転送する |
MX | メール受信先を指定する |
TXT | ドメイン所有権の確認などに使う |
Cloudflare WorkersにはIPアドレスがないため、CNAMEを使う。
ドメインをCloudflare Workersに接続する手順
ステップ1：ドメインをCloudflareに追加する
ドメインをCloudflare Registrar以外で取得した場合（NamecheapやGoogle Domainsなど）、まずDNS管理をCloudflareに移管する必要がある。
- Cloudflare Dashboard にログイン
- 「サイトを追加」をクリック
- ドメイン名を入力
- プランを選択（個人プロジェクトならFreeで十分）
- CloudflareがDNSレコードを自動スキャンする
- Cloudflareのネームサーバーをコピーしてドメインレジストラのダッシュボードで設定
ネームサーバーの変更は通常24時間以内に反映されるが、早ければ数分で完了する。
Cloudflare Registrarで取得したドメインは最初からCloudflareのDNSが使われるので、この手順は不要だ。
ステップ2：WorkerにカスタムドメインのRoutesを設定する
wrangler.toml（バックエンドWorker）またはwrangler.json（フロントエンドWorker）にルートを追加する：
# wrangler.toml（バックエンドAPIの場合）
name = "my-api"
[[routes]]
pattern = "api.yourapp.com/*"
zone_name = "yourapp.com"// wrangler.json（フロントエンドの場合）
{
"name": "my-frontend",
"routes": [
{
"pattern": "yourapp.com/*",
"zone_name": "yourapp.com"
},
{
"pattern": "www.yourapp.com/*",
"zone_name": "yourapp.com"
}
]
}ステップ3：デプロイして確認
npm run deployデプロイ後、ブラウザでyourapp.comにアクセスして確認する。
ステップ4：Cloudflare DashboardでカスタムドメインをWorkerに紐付ける（推奨方法）
wrangler設定ではなく、Cloudflare Dashboardから設定する方が視覚的にわかりやすい：
- Cloudflare Dashboard → Workers & Pages
- 対象のWorkerをクリック
- 「Settings」→「Triggers」→「Custom Domains」
- 「Add Custom Domain」をクリック
- 使いたいドメイン（例：
yourapp.com）を入力 - 「Add Custom Domain」を確認
Cloudflareが自動的にDNSレコードを作成してSSL証明書を発行する。
HTTPS（SSL）は自動
Cloudflareを使う最大のメリットの一つは、HTTPSが自動で設定されることだ。
Let's Encryptなどで証明書を手動で取得・更新する必要はない。Cloudflareがすべて処理してくれる。ドメインを接続した瞬間からhttps://yourapp.comでアクセスできる。
wwwなしとwwwありのリダイレクト
yourapp.comとwww.yourapp.comは技術的には別のドメインだ。通常はどちらでアクセスしてもメインのURLに統一したい。
Cloudflare Dashboardの「Bulk Redirects」や「Page Rules」を使って、www.yourapp.comをyourapp.comにリダイレクトできる：
AIに設定方法を聞こう：
Cloudflareで www.yourapp.com にアクセスしたとき、
yourapp.com にリダイレクトするにはどう設定しますか？よくある問題とその解決方法
「DNS_PROBE_FINISHED_NXDOMAIN」エラー
→ DNSの変更がまだ反映されていない。ネームサーバーの変更後は最大24時間待つ。
「ERR_SSL_PROTOCOL_ERROR」エラー
→ CloudflareのSSLモードの設定を確認する。Cloudflare Dashboard → SSL/TLS → 「Full (strict)」に設定する。
Workerが反応しない（502エラー）
→ wrangler.tomlまたはwrangler.jsonのルートパターンが正しいか確認する。npm run deployで再デプロイを試みる。
カスタムドメインでのみ動かない（workers.devは動く）
→ Cloudflare DashboardのTriggersタブでカスタムドメインが正しく設定されているか確認する。
vibefast.appでの設定例
vibefast.appはフロントエンドとバックエンドの2つのWorkerを使う。独自ドメインを設定する典型的な構成：
yourapp.com → フロントエンドWorker（Remix）
api.yourapp.com → バックエンドWorker（API）または、バックエンドをフロントエンドの内部で処理する場合：
yourapp.com → フロントエンドWorker（Service Bindingでバックエンドを呼ぶ）Service Bindingを使う場合、バックエンドWorkerには公開URLが不要だ——フロントエンドWorkerから内部的に呼ばれるだけだ。
Danko Peng
X · YouTube · Threads
完全なCloudflareフルスタックテンプレートを今すぐ使い始めたい方へ：
👉 vibefast.app — アーリーバード $99、2026年8月1日より $199 に値上がり。