ServBay

日本語

English
简体中文
繁體中文
Español
العربية
Português
Русский
Deutsch
Français
Tiếng Việt
Türkçe
Italiano

日本語

English
简体中文
繁體中文
Español
العربية
Português
Русский
Deutsch
Français
Tiếng Việt
Türkçe
Italiano

Appearance

ServBayでCloudflare Tunnelを使いローカルサービスを安全に公開する方法 ​

Cloudflare Tunnel（旧称：Argo Tunnel）はCloudflareが提供するゼロトラストネットワークサービスです。これを使えば、グローバルポート開放や複雑なファイアウォール設定をすることなく、ローカルで稼働するWebサービスやSSH、その他のアプリを安全にインターネットへ公開できます。本ガイドでは、強力なローカルWeb開発環境ServBay上で、cloudflared クライアントツールを利用してセキュアトンネルを構築し、ローカルServBayサービスへインターネットからアクセスできるようにする手順を詳しく解説します。

主なメリット：

  • セキュリティ強化： CloudflareのグローバルネットワークによるDDoS防御やWAF（Webアプリケーションファイアウォール）など、充実したセキュリティ機能を活用可能。
  • ネットワーク設定の簡素化： ポートフォワーディングやNAT、ファイアウォールルールの設定が不要に。
  • ゼロトラストモデル： トンネル接続はすべて外向き通信で攻撃対象範囲を低減。
  • Cloudflareサービスとの統合： キャッシュ・最適化・分析など、Cloudflare独自の追加機能を利用可能。

概要 ​

ServBayは、開発者向けのオールインワンで管理しやすいローカル開発環境を提供します。PHP, Node.js, Python, Go, Java, Ruby, Rustなど複数言語、MySQL, PostgreSQL, MongoDB, Redisなど主要データベース、Caddy, Nginx, Apache等のWebサーバーをサポート。通常ServBayで開発したサイト・アプリはローカルのみアクセス可能ですが、Cloudflare Tunnelを組み合わせることで、開発中のプロジェクトを簡単にチームメンバーと共有したり、特定シーンで外部ユーザーに一時・長期的に公開しつつ、Cloudflareのセキュリティやパフォーマンスも享受できます。

技術的な仕組み ​

Cloudflare Tunnelの基本原理は、ローカルネットワーク（ServBayが稼働するPC）上でcloudflaredクライアントを動作させ、QUICプロトコルベースの暗号化通信をCloudflareの最寄りエッジノードと確立する、というものです。この接続は「外向き通信」に限定されるため、ルーターやファイアウォールの受信設定変更が不要です。トンネルに紐付いたドメイン名で外部からアクセスすると、そのリクエストはまずCloudflareエッジへ到達し、既存のセキュアトンネル経由でローカルのcloudflaredクライアントへ転送→さらにServBay上のサービス（例：https://servbay.localやhttp://localhost:8000など）に中継されます。応答も同じ経路で返されます。

事前準備 ​

設定に入る前に、下記条件を必ず満たしているかご確認ください。

  1. ServBayが正常稼働していること： ServBay環境がセットアップ済みで、公開したいローカルサイトまたはサービスが動作中であること。例：ServBay標準のservbay.localドメインのサイトがブラウザで表示できる状態。
  2. Cloudflareアカウントを所持していること。
  3. Cloudflare管理下のドメイン： 所有ドメインをCloudflareアカウントに登録し、DNS管理をCloudflareで行っている。
  4. cloudflared クライアントのインストール： ServBay稼働中のmacOSにcloudflaredコマンドラインツールがインストールされていること。

1. cloudflaredクライアントのインストール ​

macOSの場合、Homebrewによるインストールが推奨です。Homebrewが未導入の場合は公式ガイドを参照し事前にセットアップしてください。

Homebrewでのインストール（推奨）:

bash
brew update
brew install cloudflared

手動ダウンロード&設置（macOS ARM用）:

bash
# macOS ARM（Apple Silicon）向けバイナリをダウンロードして展開
curl -L https://github.com/cloudflare/cloudflared/releases/latest/download/cloudflared-darwin-arm64.tgz | tar xz
# バイナリをPATHの通ったディレクトリに移動
sudo mv cloudflared /usr/local/bin/

インストール確認: インストール完了後、下記コマンドでcloudflaredが正しくインストールされバージョンが表示されるかを確認します。

bash
cloudflared --version
# 出力例：cloudflared version 2024.5.0 (built 2024-05-01)

バージョン情報が確認できればOKです（数字は異なっていても問題ありません）。

2. Cloudflareアカウントへのログイン ​

下記コマンドでCloudflareアカウント認証を行います。

bash
cloudflared tunnel login

実行すると自動でブラウザが開き、Cloudflareの認証ページが表示されます。ご自身のドメインに紐付くアカウントを選択しcloudflaredへのアクセス権を許可してください。認証成功後、ブラウザに完了メッセージが表示され、ターミナルにも成功ログとともにデフォルト設定フォルダ（通常~/.cloudflared/）へcert.pemファイルが生成されます。

トンネルの設定実践 ​

では、実際に新規トンネルを作成し、ServBayで稼働中のローカルサービスへ流量を中継させる手順を見ていきます。

基本設定フロー ​

  1. トンネルの新規作成

    下記コマンドで新しいトンネルを作成します。分かりやすい名前（例：servbay-demo-tunnel）がおすすめです。

    bash
    cloudflared tunnel create servbay-demo-tunnel

    実行成功後、UUID形式のトンネルIDとcredentials-fileのパスが出力されます。このトンネルID（例：a7b8c9d0-e1f2-3a4b-5c6d-7e8f9a0b1c2d）を控えておいてください。~/.cloudflared/ディレクトリにはJSON形式の認証ファイル（例：a7b8c9d0-e1f2-3a4b-5c6d-7e8f9a0b1c2d.json）が生成されます。このファイルはトンネル起動時の認証に必要となるため、厳重に保管しましょう。

  2. DNSレコードの設定

    特定のドメインのリクエストをCloudflareトンネルへ転送させるため、CloudflareのDNSにCNAMEレコードを追加します。下記コマンドで自動登録が可能です。

    bash
    cloudflared tunnel route dns servbay-demo-tunnel servbay-demo.yourdomain.com

    servbay-demo-tunnelは作成したトンネル名、servbay-demo.yourdomain.comはローカルサービス向けに使いたいサブドメイン名に置換してください（yourdomain.comはCloudflare管理下のドメインを指定）。

    コマンド実行後、servbay-demo.yourdomain.comにCNAMEレコードが自動追加され、<トンネルID>.cfargotunnel.comを向く形となります。

  3. 設定ファイルの作成

    cloudflaredはYAML形式の設定ファイルでトンネルの挙動を管理します（どのローカルサービスをどのドメインで外部公開するか等）。デフォルト配置先は~/.cloudflared/config.ymlです。未作成の場合は新規作成してください。

    ~/.cloudflared/config.ymlのサンプル内容：

    yaml
    # tunnel: トンネルのUUID。作成時取得した実IDに差し替え
tunnel: a7b8c9d0-e1f2-3a4b-5c6d-7e8f9a0b1c2d
# credentials-file: トンネルの認証ファイルパス。通常は~/.cloudflared/配下にUUID名で存在
credentials-file: /Users/yourusername/.cloudflared/a7b8c9d0-e1f2-3a4b-5c6d-7e8f9a0b1c2d.json # ユーザー名・実際のパスに合わせて変更

ingress:
  # トンネル経由リクエストのルール設定
  - hostname: servbay-demo.yourdomain.com # 外部アクセス用ドメイン。前述DNSレコードと一致させる
    service: https://servbay.local # ServBayデフォルトサイトのHTTPSアドレス。標準でSSL付きservbay.localが提供されています。
    originRequest:
      # noTLSVerify: true # ローカルが自己署名証明書（例：ServBay User CA生成）利用時のみ検証スキップを有効化
      # 有効な証明書（例：ServBayのACME機能でLet's Encryptから取得）を利用する場合は不要
      # 通常ローカル開発時はServBay User CA証明書+noTLSVerify: true組み合わせ推奨
  - service: http_status:404 # 全hostname不一致の場合404を返すデフォルトフォールバック設定

    重要ポイント：

    • tunnel・credentials-fileは必ずトンネル作成時の実UUIDとファイルパスに差し替えてください。
    • hostnameはステップ2で登録したサブドメインをそのまま指定。
    • service: https://servbay.localはServBay標準SSLアドレス。開発用自己署名SSL（ServBay User CA）が自動付与されます。もしNode.jsアプリをhttp://localhost:3000など他ポートで動かしていれば、この値を該当アドレスへ書き換えてください。
    • originRequest.noTLSVerify: trueは自己署名証明書接続のための証明書検証スキップ設定。無効な証明書でcloudflaredが接続失敗する場合のみ有効化推奨。ACME機能などでシステムが信頼する正規証明書が適用されている場合は不要です。

トンネルサービスの起動 ​

設定が完了したら、下記コマンドでcloudflaredトンネルサービスを起動します。

bash
cloudflared tunnel run servbay-demo-tunnel

servbay-demo-tunnelは作成したトンネル名に変更してください。

cloudflaredがCloudflareネットワークとのトンネルを自動確立し、接続状況やログがターミナルに表示されます。このコマンドが実行中である限りトンネルは維持されます。バックグラウンド常時運用する場合は、OSのサービス機能（macOSならlaunchctl等）を使う方法が実運用向きですが、ここでは割愛します。

サービス動作確認 ​

トンネルが無事起動したら、外部ネットワークからローカルServBayサービスへのアクセスを下記の手順で検証します。

  1. 指定ドメインへのアクセス： ブラウザでスペップ2で設定した例：https://servbay-demo.yourdomain.comへアクセス。

  2. 確認すべきポイント：

    • サイトの内容が、ローカルアクセス時（例：https://servbay.local）と同じで問題なく表示されること。
    • ブラウザのアドレスバーにはCloudflareによる正規SSL証明書が表示されている（この証明書はCloudflare発行。ローカルServBayの証明書はcloudflared通信専用）。
    • ブラウザ開発者ツールでHTTPレスポンスヘッダー（例：CF-RAY等）にCloudflare関連の項目が含まれていること（＝経路がCloudflareを通過済み）。

応用設定Tips ​

複数サービスへのルーティング ​

config.ymlのingressセクションで複数ルールを設定すれば、hostnameごとに異なるServBay内サービス（サイトやAPI等）へルーティングできます。

yaml
ingress:
  - hostname: api.yourdomain.com
    service: http://localhost:8080 # 例：APIサービスがローカル8080番で動作
  - hostname: app.yourdomain.com
    service: https://servbay.local # メインWebサイト
  - service: http_status:404

トラフィック監視・ログ確認 ​

cloudflaredにはトンネル動作や監視に使える各種コマンドがあります。

  • リアルタイム指標表示：
    bash
    cloudflared tunnel info servbay-demo-tunnel
  • 詳細ログ出力：cloudflared tunnel runは標準で詳細なログをターミナル表示。必要に応じてログレベルやファイル出力も設定できます。

Cloudflare Access連携 ​

更なるセキュリティ強化のため、Cloudflare Zero TrustプラットフォームのCloudflare Accessと組み合わせれば、トンネル越しサービスにID認証や詳細なアクセス制御を追加できます。設定はCloudflare管理画面から行います。従来型VPNよりも柔軟なアクセス管理が可能です。

トラブルシューティング ​

設定または運用中の代表的なトラブルとその対処策をまとめます。

症状解決策
ドメインアクセスで502 Bad GatewayローカルServBayサービスが正しく稼働しブラウザでアクセス可能か再確認（例：https://servbay.localや他ローカルアドレス）。
config.ymlのserviceアドレスとポート設定を再点検。
ローカルサービスがHTTPSかつnoTLSVerify: true未設定の場合、証明書が有効か・スキップ設定有無を確認。
DNSエラーでドメイン未到達Cloudflare DNS側でCNAMEレコードが<トンネルID>.cfargotunnel.comに正しく向いているか確認。digやnslookupコマンドでDNSを検証。
証明書エラーCloudflare発行証明書エラー：config.ymlのhostnameと実アクセスドメインの一致を確認。
cloudflared→ローカルサービス間のTLSエラーは、service値を確認し、必要に応じoriginRequest.noTLSVerify: trueを有効化。
cloudflared tunnel run実行時エラー~/.cloudflared/config.ymlの存在・YAML記法ミス・整合性チェック。
tunnel・credentials-file値（UUIDとファイルパス）が正しいか。
cloudflaredコマンド実行ユーザーにファイルアクセス権があるか確認。
アクセス遅延・不安定ローカルネット接続の安定性を確認。Cloudflare TunnelはQUICプロトコル利用のため、ネット環境のQUIC対応状況も確認推奨。Cloudflare側地域設定や公式サポートへの問い合わせも検討。

サービス統合の利点まとめ ​

ServBay×Cloudflare Tunnelを使うことで、開発者は以下のような恩恵を受けられます。

  • ローカル成果物を安全にシェア： クライアントやチームへ、開発中のWebサイト・アプリを即時デモ公開。
  • 外部サービスとの連携テスト： 公開環境経由で外部CallbackやWebhook動作をローカルで簡単に検証。
  • エンタープライズ級のセキュリティ： CloudflareのDDoS対策・WAF等によって、ローカルサービスでも強固に防御。
  • ネットワーク設定の極度な簡略化： 面倒なポート開放やファイアウォール管理から完全開放。
  • Cloudflareグローバルネットワーク活用： Anycastによる高速化・信頼性も同時に得られる。

強固で多機能なローカル開発環境ServBay×Cloudflare Tunnelなら、安全かつ快適な開発・共有フローを簡単に構築可能です。

結論 ​

本記事では、ServBay環境におけるcloudflaredの導入・設定からCloudflare Tunnelの新規作成・稼働まで、ローカルWebサービスを安全にインターネットへ公開するための全手順を詳しく解説しました。本ガイドを参考にすれば、ServBayのマルチスタック環境とCloudflare Tunnelのセキュアな連携を最大限活用し、開発やチームワークの生産性向上に大きく貢献できます。なお、Cloudflare TunnelはZero Trustプラットフォームの一部ですので、さらなる高度なアクセス制御やセキュリティを目指す場合はCloudflare Access等の機能もぜひご活用ください。