ToolNote
💡 Tips

XServer VPS × Cloudflare Tunnelで固定IP不要・ポート開放なしで個人開発アプリを公開する手順【2025】

なぜXServer VPS + Cloudflare Tunnelなのか

個人開発のアプリを外部公開しようとすると、こんな壁にぶつかります。

  • 自宅サーバー → ISPが固定IPを有料提供、ルーターのポート開放が必要、停電リスク
  • VPS単体 → ファイアウォール設定ミスで攻撃を受けるリスク、DDos対策が手薄

Cloudflare Tunnel（旧 Argo Tunnel） を使えば、VPS側でインバウンドポートを一切開けずに、Cloudflareのエッジ経由でHTTPS公開できます。VPSからCloudflareへのアウトバウンド接続だけで完結するため、攻撃対象となるポートが存在しない、という構成です。

XServer VPSは国内屈指のコストパフォーマンスと東京リージョンのレイテンシの低さから、この構成のホスティング先として非常に相性が良いです。

全体アーキテクチャ

[ユーザーのブラウザ]
      ↓ HTTPS (443)
[Cloudflare Edge]
      ↓ Tunnel（アウトバウンドのみ）
[XServer VPS: cloudflared デーモン]
      ↓ localhost
[アプリプロセス (Node.js / Python / Docker など)]

ポイントは VPS 側の 22番ポート（SSH）以外は完全にクローズ したままで運用できること。Cloudflare が TLS 終端・DDoS 緩和・WAF を担ってくれます。

事前準備チェックリスト

項目備考
XServer VPS の契約最小プラン（1vCPU / 512MB）でも動作確認済み
Cloudflare アカウント無料プランで Tunnel 機能が使用可能
独自ドメインCloudflare に移管 or ネームサーバー変更が必要
OSUbuntu 22.04 LTS を前提に解説

Step 1: XServer VPS を契約してUbuntuをセットアップする

🔗 おすすめサービス 国内シェアNo.1のエックスサーバーが提供するVPSサーバー『XServer VPS』

XServer VPSのコントロールパネルから Ubuntu 22.04 LTS を選択してインストールします。初期設定として以下を行います。

# パッケージ更新
sudo apt update && sudo apt upgrade -y

# ファイアウォール設定（SSH のみ許可）
sudo ufw allow 22/tcp
sudo ufw enable
sudo ufw status

Status: active と表示され、22/tcp のみ ALLOW になっていればOKです。80/443 は開けなくて構いません。これがこの構成の最大のメリットです。

Step 2: アプリを起動しておく

例として Node.js アプリ（ポート 3000）を使います。

# Node.js 20 をインストール
curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash -
sudo apt install -y nodejs

# サンプルアプリ
mkdir ~/myapp && cd ~/myapp
cat > index.js << 'EOF'
const http = require('http');
http.createServer((req, res) => {
  res.writeHead(200);
  res.end('Hello from XServer VPS + Cloudflare Tunnel!\n');
}).listen(3000, '127.0.0.1');
console.log('Listening on localhost:3000');
EOF

node index.js &

127.0.0.1:3000 でリッスンしている点がポイントです。外部からは直接アクセスできません。

Step 3: cloudflared をインストールする

# cloudflared の最新版をインストール（2025年4月時点）
curl -L https://github.com/cloudflare/cloudflared/releases/latest/download/cloudflared-linux-amd64.deb \
  -o cloudflared.deb
sudo dpkg -i cloudflared.deb
cloudflared --version

注意: バージョンは頻繁に更新されます。インストール前に GitHub Releases で最新版を確認してください。

Step 4: Cloudflare にログインしてトンネルを作成する

# ブラウザで認証（コマンド実行後に表示されるURLを開く）
cloudflared tunnel login

認証が完了したら ~/.cloudflared/cert.pem が生成されます。

# トンネルを作成（名前は任意）
cloudflared tunnel create myapp-tunnel

# トンネルIDを確認
cloudflared tunnel list

Step 5: 設定ファイルを書く

mkdir -p ~/.cloudflared
cat > ~/.cloudflared/config.yml << 'EOF'
tunnel: <YOUR_TUNNEL_ID>          # Step 4 で確認したID
credentials-file: /root/.cloudflared/<YOUR_TUNNEL_ID>.json

ingress:
  - hostname: app.example.com     # Cloudflare 管理下のドメイン
    service: http://localhost:3000
  - service: http_status:404
EOF

Step 6: Cloudflare DNS に CNAME レコードを追加する

cloudflared tunnel route dns myapp-tunnel app.example.com

これだけで Cloudflare のダッシュボードに app.example.com → <tunnel-id>.cfargotunnel.com の CNAME が自動追加されます。手動でDNSを触る必要はありません。

Step 7: systemd サービスとして常駐させる

手動起動では VPS 再起動時に止まってしまいます。systemd に登録して自動起動を設定します。

sudo cloudflared service install
sudo systemctl enable cloudflared
sudo systemctl start cloudflared
sudo systemctl status cloudflared

Active: active (running) になればセットアップ完了です。

Step 8: 動作確認

ブラウザで https://app.example.com にアクセスします。

Hello from XServer VPS + Cloudflare Tunnel!

と表示されれば成功です。証明書は Cloudflare が自動発行するため、Let’s Encrypt の手動更新も不要です。

セキュリティをさらに強化するオプション

Cloudflare Access で認証を追加する

Cloudflare Zero Trust の Access を使えば、Google / GitHub 認証を挟んで特定ユーザーだけにアクセスを許可できます。社内ツールや開発中のアプリに最適です（無料枠：50ユーザーまで）。

IP ジオブロッキング

Cloudflare ダッシュボードの「セキュリティ → WAF」から、日本以外のIPを弾くルールを数クリックで設定できます。

コスト試算（月額目安）

項目費用
XServer VPS 最小プラン約 490円〜
Cloudflare Tunnel無料
独自ドメイン（.com）約 150円〜
合計約 640円〜

自宅サーバーの電気代や固定IP費用と比較すると、かなり低コストで安定した本番環境を持てます。

📚 おすすめ書籍

Linuxサーバー構築・運用入門

VPSをさらに使いこなしたい方に

Amazonで見る →

まとめ

  • XServer VPS + Cloudflare Tunnel の組み合わせで、固定IP不要・ポート開放なしの安全な公開構成が実現できる
  • VPS側は SSH(22) のみ開放、残りは UFW でブロックするだけでよい
  • cloudflared を systemd に登録すれば再起動後も自動復帰
  • Cloudflare Access を追加すれば認証付きの限定公開も無料で可能
  • 月額 640円〜という低コストで個人開発の本番環境を持てる

「自宅サーバーは管理が大変、でもクラウドは高い」という悩みを解決する、現時点でベストに近い個人開発向け公開構成です。ぜひ試してみてください。

#Cloudflare #XServer VPS #Cloudflare Tunnel #個人開発 #VPS