Cloudflare Tunnelで開発環境をインターネットに公開する

Transcript

1. Cloudflare Tunnel で開発環境を インターネットに公開する 2026/1/24 第183 回 PHP 勉強会＠東京 @muno_92 1
2. 自己紹介 X ( 旧Twitter): @muno_92 PHPer 趣味: カンファレンススタッフ PHPerKaigi 2026 ( コア) PHP カンファレンス小田原2026 ( コア) 2
3. ( 宣伝) PHPerKaigi 2026 日程: 2026 年3 月20 日( 金祝) 〜22 日( 日) 会場: 中野セントラルパークカンファレンス & ニコニコ生放送 チケット販売中！ PHPer Book Revue 募集中！ 推しの本の紹介LT 、待ってます！ https://phperkaigi.jp/2026/ 3
4. ( 宣伝) PHP カンファレンス小田原2026 日程: 2026 年4 月11 日( 土) 会場: おだわら市民交流センター「UMECO 」 前夜祭 & 本編チケット販売中！ キーノート ( オンラインセッション) Sebastian Bergmann さん！ PHPUnit 作者 https://phpcon-odawara.jp/2026 4
5. こんなことありませんか？ 開発中のソースをインターネット上で動かしたい OAuth を使った機能の開発でリダイレクト先としてhttps のアドレス が必要 連携先の外部サービスやモバイル端末からアクセスできるようにし たい 5
6. https 化だけなら色々方法はある 自己証明書を使う OrbStack のContainer domain names を使う https://docs.orbstack.dev/docker/domains#container-domain- names 6
7. https 化だけでは足りない場合がある OAuth で指定するredirect_url をインターネット上に公開しないと いけないサービス Google Workspace API など Webhook など外部サービスからのリクエストを受け付けたい場合 ↓ インターネット上で開発中のソースを動かしたい 7
8. インターネット上に開発環境を公開するには インターネット上に公開した検証環境を用意してデプロイする デプロイが手間 8
9. インターネット上に開発環境を公開するには インターネット上に公開した検証環境を用意してデプロイする デプロイが手間 ngrok を使う 無料アカウントだと URL がランダム 固定URL は1 つしか使えない その固定URL も長くて覚えにくい・入力しにくい 9
10. そこでCloutflare Tunnel 10
11. Cloudflare Tunnel https://developers.cloudflare.com/cloudflare- one/networks/connectors/cloudflare-tunnel/ ローカル端末上で動かしているアプリケーションを 任意のサブドメイン.自分のドメイン で公開可能 使用可能なドメイン: ネームサーバーにCloudflare を使っているド メイン 無料アカウントでもほぼ制限なしに使用可能 ※アクセス制御を掛けたりする場合は50 ユーザーまで 11
12. 仕組み 端末上にcloudflared をデーモンとしてインストール つまり、コマンドを叩いた時だけ接続されるのではなく常時接続 Cloudflare のプロキシ経由で通信 12
13. 使い方① トンネルを作成 Zero Trust > Networks / Manage Tunnels からトンネルを作成 1 端末1 トンネル 13
14. 使い方② コネクタ(cloudflared) を接続 画面上に表示されたトークン付のコマンドを実行しセットアップ ※トークンは漏れないように注意！！ 14
15. 使い方③ ルーティングを設定 複数のアプリケーションを公開したい場合 トンネルに対してルーティングを追加する 15
16. これだけで設定完了 16
17. ちょっと試す方法も Quick Tunnels 1 コマンドで ランダムなサブドメイン.trycloudflare.com に公開できる 例) cloudflared tunnel --url http://localhost:8080 https://developers.cloudflare.com/cloudflare- one/networks/connectors/cloudflare-tunnel/do-more-with- tunnels/trycloudflare/ 17
18. まとめ Cloudflare Tunnel で開発環境をインターネットに公開できる 公開用のドメインはCloudflare で管理する必要がある サブドメインは自由に設定可能 Cloudflare でドメインを管理していなくてもQuick Tunnels で試せる 18
19. ご清聴ありがとうございました 19
20. 補足) HTTP 以外の用途も SSH RDP など https://developers.cloudflare.com/cloudflare- one/networks/connectors/cloudflare-tunnel/use-cases/ 20
21. 補足) cloudflared の実装 cloudflared からoutbound な通信でプロキシサーバーに接続してい る outbound な通信ならfirewall に弾かれにくい outbound な通信の中で双方向通信 QUIC やHTTP/2 を使用 https://blog.cloudflare.com/getting-cloudflare-tunnels-to- connect-to-the-cloudflare-network-with-quic/ 21