Cloudflare Tunnelを使ってみる
ngrok的な感じで,ローカルのサーバをCloudflare Tunnel経由でグローバルなネットワークに接続することができる.
Cloudflareドキュメント:Cloudflare Tunnel
直接にサーバを借りたり,もしくはデプロイするという手間が減るので,開発段階でのチェックとか,一時的にだけ使いたいWebアプリなんかにとても便利だと思われる.
トンネルの作成方法
- コマンドラインから
- ランダムなドメイン(すぐ使うならこれが楽)
- 固定のドメイン
- ダッシュボードから(ドキュメントではこっちの方を推奨している)
コマンドラインから雑に使う
インストール
$ brew install cloudflared雑に適当なWebサービスを作る
- ここでは動作が確認できれば良いのでnode.js+Expressを使って簡単なWebサービスを作ってみます
$ cd /適当なディレクトリ
$ mkdir sample-web-service
$ cd sample-web-service
$ npm init
<<(なんか色々と設定項目を聞かれるけど全てエンターでOK)>>
$ npm install express
$ touch index.jsindex.jsを書き換えます
const express = require('express')
const app = express()
const port = 3000
app.get('/', (req, res) => {
res.send('Hello, node.js+Express')
})
app.listen(port, () => {
console.log(`Example app listening on port ${port}`)
})作ったアプリをローカルで起動する
$ node index.js
Example app listening on port 3000起動したら,別のタブを開いてCloudflare Tunnelを起動する
- 別のタブはCmd+Tで開けるのでショートカットを覚えておくと良い
$ cloudflared tunnel --url http://localhost:3000
2024-08-04T15:51:47Z INF Thank you for trying Cloudflare Tunnel. Doing so, without a Cloudflare account, is a quick way to experiment and try it out. However, be aware that these account-less Tunnels have no uptime guarantee. If you intend to use Tunnels in production you should use a pre-created named tunnel by following: https://developers.cloudflare.com/cloudflare-one/connections/connect-apps
2024-08-04T15:51:47Z INF Requesting new quick Tunnel on trycloudflare.com...
2024-08-04T15:51:50Z INF +--------------------------------------------------------------------------------------------+
2024-08-04T15:51:50Z INF | Your quick Tunnel has been created! Visit it at (it may take some time to be reachable): |
2024-08-04T15:51:50Z INF | https://syria-maximize-screens-discovered.trycloudflare.com |
2024-08-04T15:51:50Z INF +--------------------------------------------------------------------------------------------+
2024-08-04T15:51:50Z INF Version 2024.7.3
2024-08-04T15:51:50Z INF GOOS: darwin, GOVersion: go1.22.2-devel-cf, GoArch: arm64
2024-08-04T15:51:50Z INF Settings: map[cred-file:/root/.cloudflared/3af758fc-c79f-460c-afd5-cad58b335e10.json credentials-file:/root/.cloudflared/3af758fc-c79f-460c-afd5-cad58b335e10.json ha-connections:1 protocol:quic url:http://localhost:3000]
2024-08-04T15:51:50Z INF cloudflared will not automatically update if installed by a package manager.
2024-08-04T15:51:50Z INF Generated Connector ID: dc6351a9-ebe7-4166-9b69-19c588f0132e
2024-08-04T15:51:50Z INF Initial protocol quic
2024-08-04T15:51:50Z INF ICMP proxy will use 192.168.1.17 as source for IPv4
2024-08-04T15:51:50Z INF ICMP proxy will use fe80::c7:7c0:429a:612b in zone en0 as source for IPv6
2024-08-04T15:51:50Z INF Created ICMP proxy listening on 192.168.1.17:0
2024-08-04T15:51:50Z INF Created ICMP proxy listening on [fe80::c7:7c0:429a:612b%en0]:0
2024-08-04T15:51:50Z ERR update check failed error="no release found"
2024-08-04T15:51:50Z INF Starting metrics server on 127.0.0.1:54686/metrics
2024-08-04T15:51:51Z INF Registered tunnel connection connIndex=0 connection=2eb6892f-414c-4352-ae61-041463c7d96b event=0 ip=198.41.192.47 location=nrt01 protocol=quicローカルのどのポートにトンネルするかを指定している.
ここでは
https://syria-maximize-screens-discovered.trycloudflare.com
というアドレスが生成されているのがログをみるとわかる
起動する度にランダムに生成されるアドレスになる
アクセスしてみる
スマホからもアクセスしてみる
ローカルで起動してるはずのアプリにWifiやモバイルネットワークからアクセス可能になった
トンネルを起動しているターミナルをControl+Cで終了する
先ほどまで開けていたページをリロードするとエラーになる
動いてることの確認完
このアドレスは起動する度にランダムに生成されるので,固定して使いたい場合には不向き.一時的な利用,動作確認的な利用の場合に使うのが良い