Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Cloudflare Tunnelで開発環境をインターネットに公開する
Search
muno92
PRO
January 28, 2026
Programming
130
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Cloudflare Tunnelで開発環境をインターネットに公開する
muno92
PRO
January 28, 2026
More Decks by muno92
See All by muno92
PHPでバイナリをパースして理解するASN.1
muno92
PRO
0
600
forteeの改修から振り返るPHPerKaigi 2026
muno92
PRO
3
450
2年のAppleウォレットパス開発の振り返り
muno92
PRO
0
300
PsySHから紐解くREPLの仕組み
muno92
PRO
1
900
RayでPHPのデバッグをちょっと快適にする
muno92
PRO
0
750
Appleウォレット / Googleウォレットに チケットを保存する方法
muno92
PRO
2
4.9k
歴史を重ねたシステムの開発に趣味で関わり始めて
muno92
PRO
1
620
PHPでGoogle Walletにチケットを追加する
muno92
PRO
0
910
カンファレンススタッフはいいぞ
muno92
PRO
1
430
Other Decks in Programming
See All in Programming
まだ間に合う!今年の夏こそSchemeのマクロ展開器を完全理解!
omasanori
0
570
Japan Community Day at Kubecon + CloudNativeCon Japan 2026: Learning Container Privilege Control by Building My Own Low-Level Container Runtime
ternbusty
1
170
業務時間外もAIに働いてもらう話
colorful12
2
8.7k
React本体のコードリーディング
high_g_engineer
1
160
Loosening the Reins: Go Generics Get More Flexible
kuro_kurorrr
0
350
言葉の格闘技のススメ~紙とペンと言葉から始める、キャリアの描き方~
progresscicada
2
190
Pythonの実行はどこまで賢くなったのか? CPythonとPyPyから見る最適化のしくみ
curekoshimizu
4
2.3k
ハーネス設計入門 〜プロンプト、コンテキストの次〜
kinopeee
36
22k
Hello, Hiroshima Geospatial Data! — Exploring DoboX with Python
ra0kley
0
110
AI Engineeringは、AIプロダクトだけのものか? 〜AIがソフトウェアを作る時代の新しい当たり前〜 / No AI in your product. AI Engineering in your development.
rkaga
5
550
MySQLとPostgreSQLって何が違うの?
akagami
0
150
ALB ログから Trace を気合で繋げる技術
fohte
7
770
Featured
See All Featured
Mozcon NYC 2025: Stop Losing SEO Traffic
samtorres
1
510
A better future with KSS
kneath
240
18k
Have SEOs Ruined the Internet? - User Awareness of SEO in 2025
akashhashmi
0
450
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
430
Git: the NoSQL Database
bkeepers
PRO
432
67k
Why Your Marketing Sucks and What You Can Do About It - Sophie Logan
marketingsoph
0
390
Learning to Love Humans: Emotional Interface Design
aarron
275
41k
Digital Ethics as a Driver of Design Innovation
axbom
PRO
1
390
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
580
Self-Hosted WebAssembly Runtime for Runtime-Neutral Checkpoint/Restore in Edge–Cloud Continuum
chikuwait
0
750
Deep Space Network (abreviated)
tonyrice
0
270
Music & Morning Musume
bryan
47
7.3k
Transcript
Cloudflare Tunnel で開発環境を インターネットに公開する 2026/1/24 第183 回 PHP 勉強会@東京 @muno_92
1
自己紹介 X ( 旧Twitter): @muno_92 PHPer 趣味: カンファレンススタッフ PHPerKaigi 2026
( コア) PHP カンファレンス小田原2026 ( コア) 2
( 宣伝) PHPerKaigi 2026 日程: 2026 年3 月20 日( 金祝)
〜22 日( 日) 会場: 中野セントラルパークカンファレンス & ニコニコ生放送 チケット販売中! PHPer Book Revue 募集中! 推しの本の紹介LT 、待ってます! https://phperkaigi.jp/2026/ 3
( 宣伝) PHP カンファレンス小田原2026 日程: 2026 年4 月11 日( 土)
会場: おだわら市民交流センター「UMECO 」 前夜祭 & 本編チケット販売中! キーノート ( オンラインセッション) Sebastian Bergmann さん! PHPUnit 作者 https://phpcon-odawara.jp/2026 4
こんなことありませんか? 開発中のソースをインターネット上で動かしたい OAuth を使った機能の開発でリダイレクト先としてhttps のアドレス が必要 連携先の外部サービスやモバイル端末からアクセスできるようにし たい 5
https 化だけなら色々方法はある 自己証明書を使う OrbStack のContainer domain names を使う https://docs.orbstack.dev/docker/domains#container-domain- names
6
https 化だけでは足りない場合がある OAuth で指定するredirect_url をインターネット上に公開しないと いけないサービス Google Workspace API など
Webhook など外部サービスからのリクエストを受け付けたい場合 ↓ インターネット上で開発中のソースを動かしたい 7
インターネット上に開発環境を公開するには インターネット上に公開した検証環境を用意してデプロイする デプロイが手間 8
インターネット上に開発環境を公開するには インターネット上に公開した検証環境を用意してデプロイする デプロイが手間 ngrok を使う 無料アカウントだと URL がランダム 固定URL は1
つしか使えない その固定URL も長くて覚えにくい・入力しにくい 9
そこでCloutflare Tunnel 10
Cloudflare Tunnel https://developers.cloudflare.com/cloudflare- one/networks/connectors/cloudflare-tunnel/ ローカル端末上で動かしているアプリケーションを 任意のサブドメイン.自分のドメイン で公開可能 使用可能なドメイン: ネームサーバーにCloudflare を使っているド
メイン 無料アカウントでもほぼ制限なしに使用可能 ※アクセス制御を掛けたりする場合は50 ユーザーまで 11
仕組み 端末上にcloudflared をデーモンとしてインストール つまり、コマンドを叩いた時だけ接続されるのではなく常時接続 Cloudflare のプロキシ経由で通信 12
使い方① トンネルを作成 Zero Trust > Networks / Manage Tunnels からトンネルを作成
1 端末1 トンネル 13
使い方② コネクタ(cloudflared) を接続 画面上に表示されたトークン付のコマンドを実行しセットアップ ※トークンは漏れないように注意!! 14
使い方③ ルーティングを設定 複数のアプリケーションを公開したい場合 トンネルに対してルーティングを追加する 15
これだけで設定完了 16
ちょっと試す方法も 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
まとめ Cloudflare Tunnel で開発環境をインターネットに公開できる 公開用のドメインはCloudflare で管理する必要がある サブドメインは自由に設定可能 Cloudflare でドメインを管理していなくてもQuick Tunnels
で試せる 18
ご清聴ありがとうございました 19
補足) HTTP 以外の用途も SSH RDP など https://developers.cloudflare.com/cloudflare- one/networks/connectors/cloudflare-tunnel/use-cases/ 20
補足) 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