Cloudflare Tunnel 構築（前編）

<img width="80%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/d0ec9a94-3f1a-467a-8edb-35309836ce88.png" />

いよいよ自宅サーバー（Dify Server）の公開に着手します。
公開にあたり、Cloudflare 社が提供する Zero Trust サービスを利用することにしました。

利用するのは次の二機能です。

* **「Tunnel（トンネル）」機能**
ローカルネットワーク内のサーバー と インターネット との間を「論理的な専用線」で接続する機能です。
ルーター/ゲートウェイ のファイアウォールに「穴」を開けることなく、安全にインターネットとの経路を開設することができます。
　
* **「リバースプロキシ」機能**
クライアントからのリクエストをオリジンサーバー（公開するサーバー）へ転送し、その応答データをクライアントに返却する機能です。

## Cloudflare について
Cloudflare とは、CDN (Content Delivery Network) や WAF (Web Application Firewall) 等、大規模な コネクティビティクラウド サービスを提供する会社のことです。
大企業のみならず、個人や小企業まで 幅広くユーザーに支持されており、2024年時点で CDN 市場の約８割のシェアを得ていた模様です。

[Cloudflare 日本語サイト](https://www.cloudflare.com/ja-jp/)

**主な提供機能**
　・CDN (Content Delivery Network)
　・WAF (Web Application Firewall)
　・DNS (Domain Name System)
　・レジストラ
　・リバースプロキシ
　・DDoS攻撃対策

また、いわゆる**無料枠**が存在し、基本的な機能であれば誰でも簡単に試すことができます。
無料枠で体現できる機能は幅広く、本記事で紹介する程度のものは「完全に無料で」運用することも可能です。

:::note warn
簡単に導入することはできますが、「安全に利用」するには それなりの知識と経験が必要です。
本記事程度でも、「DNS」「トンネルネットワーク」「リバースプロキシ」に関する一定の知識は必要なので、それを踏まえた上で取り組むことをお勧めします。
:::

## 事前準備
本記事は、最低限の契約・登録が完了していることを前提としています。

### ① 独自ドメインの契約
Xserver で独自ドメイン（.comドメイン）を契約しておきます。
多数のサイトで解説されているので、本記事では契約方法の説明を割愛します。

:::note info
2025年4月14日 時点で、.comドメイン の「新規契約料」は なんと **1円** でした。
Cloudflare でもドメイン契約は可能ですが、Xserver で契約することにしました。
:::

### ② Cloudflare アカウント登録
Cloudflare のアカウントを事前に登録しておきます。
料金プランは「ドメイン接続開始」の際に選択するので、登録時は未選択でも大丈夫です。
また、Zero Trust サービス（「Free」プラン）も先に登録しておきます。

[Cloudflare 価格設定](https://www.cloudflare.com/ja-jp/plans/)

### ③ インターネット側 IPアドレスの確認
Cloudflare DNSサーバー へ登録する IPv4/IPv6 アドレスを確認しておきます。
この値は DNSレコード を新規登録する際に使用します。

:::note info
インターネット側のユーザーは、この値を参照できません。
ドメイン名検索で表示されるのも cloudflare CDN エッジサーバーの IPアドレスで、プロバイダから割り当てられる IPv4/IPv6 アドレス が、第三者へ公開されるわけではありません。
:::

今回は下記サイトの「便利機能」を利用して IPv4/IPv6 の両アドレスを確認します。
[みんなのネット回線速度](https://minsoku.net/)
 　
「便利機能」メニューを開き、「IPアドレスを確認する」をクリックしてください。

<img width="35%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/b79a922d-2b4e-44ef-ad5c-9b4a908f6d37.png" />

IPc4/IPv6 アドレス値が表示されます。
DNSレコードを新規追加する際に使用するまで、これらの値を保存しておいてください。

<img width="80%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/1b9fbb0f-022a-42cf-af16-a129be87abab.png" />


## ドメインへの接続（Cloudflare DNS）
Xserverで契約したドメインへ接続し、 Cloudflare DNSサーバー 上で DNS レコードを管理します。

### ① ドメイン名の登録
Cloudflare へログインした後、ホーム画面中央の「ドメイン」タブをクリックします。

<img width="70%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/891c602e-2553-4dae-b2d6-1c583c3aa2fe.png" />

Xserver で契約した新規ドメイン名を「既存のドメインを入力」欄へ入力します。
「DNSレコードのクイックスキャン」が選択された状態で「続行」ボタンをクリックします。

<img width="90%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/26562b1e-b1a7-454b-8a0e-dcfc0a9030b3.png" />
 
料金プランの選択画面が表示されたら「Free」枠内をクリックします。
青枠線が表示されたら「続行」ボタンをクリックします。

<img width="90%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/808b2613-20a1-4bb1-9748-de28cf74f5d0.png" />

新規作成したばかりのドメイン名なので、レコード一覧には「DNSレコードがありません」と表示されます。

<img width="90%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/6bbdd43f-a6e8-4f03-b2c3-66c694a5e78f.png" />

### ② DNSレコードの追加
ドメインを指すDNSレコード（A、AAAA）を追加します。
「レコードの追加」ボタンをクリックしてから下表（Aレコード）の内容を入力し、「保存」ボタンをクリックします。

|名称|設定値|
|:-|:-|
|タイプ|A|
|名前|@|
|IPv4アドレス|事前に確認した インターネット側 **IPv4** アドレス|

<img width="80%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/123a7747-f98a-41a5-bcf0-d1da931f14a0.png" />

続けて、下表（AAAAレコード）を同じように保存します。

|名称|設定値|
|:-|:-|
|タイプ|AAAA|
|名前|@|
|IPv4アドレス|事前に確認した インターネット側 **IPv6** アドレス|

<img width="80%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/3a7523c3-e385-416c-9190-881786675d4d.png" />

この時点で レコード一覧 には２レコードが表示されています。
このまま「アクティベーションに進む」ボタンをクリックします。

<img width="80%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/38b78abe-5ef4-4a3c-a215-e287c5566a23.png" />

### ③ Xserver ネームサーバー情報の変更
レジストラ（Xserver）でネームサーバー名を更新するように、と表示されます。
二つのネームサーバー名（「aliza.ns.cloudflare.com」と「mitch.ns.cloudflare.com」）を Xserver 管理画面から登録します。

登録が完了するまで、下の画面はそのままにしておきます。

<img width="80%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/e4da0a9a-c8fa-490f-89a9-36291f730292.png" />

Xserver の管理コンソールへログインし、「XServer Domain」サービスを選んでから「ネームサーバー設定」画面を開きます。

<img width="50%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/a8e6a9ca-bb0e-4a44-ae7b-e511e7e4a6ee.png" />

「その他のサービスで利用する」を選択してから、二つのネームサーバー名を入力します。

<img width="70%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/39342184-d394-45b7-bdbf-4c9be28db4ac.png" />

「確認画面へ進む」ボタンをクリックすると下の画面が表示されます。
そのまま「設定を変更する」ボタンをクリックします。

<img width="90%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/645f20c9-bfc0-4aa6-a691-ba250bdceee4.png" />

先ほどの cloudflare の画面へ戻り、画面下の「続行」ボタンをクリックします。

<img width="80%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/3c38cdd0-0bfe-46ab-b16c-bb2c68c0291f.png" />

以下ように表示されたら、「ネームサーバを今すぐ確認」ボタンをクリックします。

<img width="90%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/bed613f7-7451-4df3-9597-b66429e72921.png" />

"数時間お待ちください" と表示されますが、問題が無ければそこまで時間はかかりません。
今回は ５～１０分ほど放置しました。

<img width="90%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/d8c661d8-a9a8-4ad5-a904-aa4f8a0d8503.png" />

左上の「概要」メニューをクリックします。

<img width="35%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/7bc67558-0d22-4e12-b666-b237aa4e5fb7.png" />

下図のように表示されたら、ネームサーバー情報の設定変更は完了しています。
以後、Cloudflare で DNSサーバー を運用できるようになりました。

<img width="80%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90456/fa49dcad-22a3-4d2b-8581-9d1d913f0237.png" />

## 後編では
これで DNS サーバーの準備は整いました。
Cloudflare Tunnel 構築（後編）では、「cloudflared」というプログラムを導入して Dify Server をインターネットへ公開します。