実用的なlocalhost共有ガイド
CloudflareとGhostlyShareでlocalhostを公開する
クライアントがプレビューを必要とする時、WebhookプロバイダーがコールバックURLを必要とする時、または開発サーバーをスマホで開きたい時、ローカルで動くものに公開URLが必要です。本ガイドはまずターミナル中心のCloudflare手順を示し、その後繰り返し共有に適したGhostlyShareの流れを紹介します。
迅速な判断
共有量に合ったツールを使う
すべてのローカルプレビューをホスティングと同じ扱いにするのは誤りです。トンネルは一時的アクセスに最適。GhostlyShareは定期的な共有に最適。本格運用はユーザーがURLに依存する場合に適します。
cloudflared.exeを使う
Cloudflareのトンネルクライアントを一度インストールし、コマンドを一回実行、仮URLをコピーしてCtrl+Cで停止します。
GhostlyShareを使う
デスクトップアプリがローカルサービスを検出し、共有開始、準備完了表示、URLコピー、アクセス停止をターミナル出力を探さずに行えます。
アプリのデプロイ
URLに稼働時間、監視、バックアップ、安定リリース、サポート管理が必要なら、ノートPCトンネルは信頼性の境界として不適切です。
方法1
Cloudflare EXE：最速でシンプルなコマンドライン操作
Cloudflareのトンネルクライアントはcloudflaredです。Windowsではwingetでインストールするか、EXEを手動でダウンロードできます。短期間の開発プレビューには、ルーターのポート開放やDNS設定不要のクイックトンネルが便利です。
ローカルアプリを起動
まずブラウザでローカルURLを開いてください。アプリがローカルで動作しなければ、公開トンネルで解決できません。
npm run devWindowsにcloudflaredをインストール
Use winget when it is available. If you download the EXE manually, place it in a folder such as C:\Cloudflared\bin and call it cloudflared.exe.
winget install --id Cloudflare.cloudflared公開URLの作成
Use the exact local HTTP URL and port. In PowerShell from the EXE folder, use .\cloudflared.exe if the executable is not on PATH.
cloudflared.exe tunnel --url http://localhost:5173共有前にテスト
生成されたtrycloudflare.comのURLをプライベートウィンドウや別端末で開き、ログイン、資産、リダイレクト、API呼び出しを確認してから共有してください。
https://example-random-name.trycloudflare.com意図的にトンネルを停止
デモやWebhookテストが終わったらターミナルプロセスを停止してください。マシンがスリープや切断するとクイックトンネルは動作しなくなります。
Ctrl+C安定したプレビューネーム
ランダムURLかカスタムCloudflareホスト名？
テスト後にリンクが消えてもよい場合はランダムURLが最適です。プレビューを安定的に見せたい場合は、例えばdemo.example.comのようなカスタムドメインが適しています。Cloudflareでドメイン管理済みの場合に有効です。
| 必要なもの | 利用する | 適している理由 |
|---|---|---|
| 5分間のデモまたはWebhookコールバック | ランダムURL | アカウントやDNS設定は不要で、テスト後にリンクを簡単に破棄できます。 |
| ブランドイメージを保つクライアントレビュー | カスタムドメイン | 管理するホスト名は認識しやすいですが、Cloudflareゾーン、トークン権限、DNS、トンネルルーティングが必要です。 |
| 不用意に開くべきでないプレビュー | パスワード保護付きリンク | 公開前にパスワードを設定し、アクセスが必要な少人数にURLとパスワードを別々に共有してください。 |
その他の選択肢
localhostを公開する他の方法
すべての状況に一つのツールが必要なわけではありません。使い捨てリンク、デスクトップワークフロー、ブランドプレビュー、プライベートネットワークツール、意図的に強化されたセルフホスト環境かで最適な選択が変わります。
| ツール | 典型的なコマンドや操作 | 最適な用途 | 注意点 |
|---|---|---|---|
| Cloudflareクイックトンネル | cloudflared tunnel --url http://localhost:5173
|
ルーター設定不要の高速使い捨て公開HTTPS URL | 開発・テスト専用。ランダムURL。ターミナルのライフサイクルに依存。 |
| GhostlyShare | デスクトップアプリで「公開開始」を選択
|
繰り返しのローカルプレビュー、Webhookテスト、パスワード保護デモ、任意のCloudflareカスタムドメイン。 | 本番ホスティングではありません。リンクが機能する間、ローカルアプリとマシンは稼働し続ける必要があります。 |
| ngrok | ngrok http 5173
|
ngrok、予約ドメイン、トラフィック検査、プロバイダー固有のルーティング機能を使っているチーム向け。 | アカウントやプランの詳細が重要で、使い捨てのクイックトンネルよりプロバイダー設定が多いです。 |
| Tailscale Funnel | tailscale funnel 3000
|
すでにTailscaleを使っていて、tailnetデバイスの公開HTTPSエンドポイントが欲しい人向け。 | tailnet用にTailscale設定とFunnel有効化が必要です。 |
| localtunnel | npx localtunnel --port 3000
|
簡単なテスト向けのNodeベースのlocalhost共有。 | 簡単なプレビューに便利ですが、機密性の高い用途には慎重に使ってください。 |
| ルーターのポート開放 | ルーター、DNS、TLS、リバースプロキシの設定
|
インフラを意図的に運用する場合の恒久的なセルフホスティング。 | 攻撃対象が増え、パッチ適用、ファイアウォール設定、ログ管理、TLS対応があなたの責任になります。 |
Webhookテスト
Webhookで時間を節約するポイント
WebhookプロバイダーはあなたのPCのhttp://localhostを呼べません。公開トンネルURLを呼びます。そのURLは外部連携として扱い、署名は有効のまま、正確なコールバックパスを使い、リダイレクトやCORSを確認してください。
完全なコールバックパスを使う
受信側が/api/webhooks/stripeを監視している場合、ドメインだけでなく同じパスを含む公開URLを貼り付けてください。
署名検証は有効のままにする
公開トンネルは実際のWebhook署名のテストを容易にしますが、署名検証を無効にする理由にはなりません。
ベースURLと転送ヘッダーを監視
公開URLがlocalhostにリダイレクトする場合は、公開ベースURL、転送ヘッダー、信頼プロキシ、フレームワークのホスト設定を調整してください。
クリーンなブラウザセッションでテスト
プライベートウィンドウや別端末を使い、キャッシュされたlocalhost状態がクッキー、CORS、リダイレクト、混在コンテンツの問題を隠さないようにしてください。
トラブルシューティング
よくあるトンネル問題を先に解決
トンネルは開始するがページが空白
ローカルURLを直接開き、資産、API URL、WebSocket URL、環境変数がまだlocalhostを指していないか確認してください。
公開URLがlocalhostにリダイレクトする
多くのフレームワークはリクエストホストからリダイレクトを作成します。転送ヘッダー、信頼プロキシ、公開オリジン、強制開発リダイレクトを修正してください。
リンクは動作前に表示される
Cloudflareのルーティング、DNS、GhostlyShareのローカルプロキシ、元のアプリが同期するまで少し時間がかかることがあります。数秒待って更新し、再度テストしてください。
HTTPSのlocalhost証明書がエラーを引き起こす
短時間のプレビューにはローカルHTTPエンドポイントをトンネルします。長期利用は推測せずにオリジンTLSを意図的に設定してください。
ホットリロードやWebSocketの失敗
WebSocket対応ツールを使い、アプリがハードコードされたlocalhostではなく公開ホストからwsまたはwss URLを生成していることを確認してください。
安全性
公開URLを送る前に
公開プレビューURLは公開アクセスのままです。パスワード保護で誤アクセスは減らせますが、危険なローカルサービスを安全にするわけではありません。最小限のURLを共有し、テストデータを使い、レビューやWebhookテスト後はリンクを停止しましょう。
テストデータを使う
実際の顧客情報、データベース管理画面、内部ダッシュボード、シードシークレット、企業の機密データは公開しないでください。
アプリの認証は有効のままにする
通常ログインが必要な機能は、公開プレビュー中もログインが必要です。
プライベートプレビューにはパスワード保護を使う
少人数のレビューグループには、公開前にGhostlyShareのパスワードを設定し、リンクとは別に共有してください。
リンクを停止して更新
使用後は一時リンクを停止してください。URLやパスワードがチケットやチャットに漏れた場合は、再利用せず新しいプレビューを作成しましょう。
よくある質問
よくある質問
正確なWindowsコマンドは？
cloudflaredをインストール後、cloudflared.exe tunnel --url http://localhost:PORT を実行します。PORTはアプリのローカルポート（例：5173、3000、5080、8080）に置き換えてください。
GhostlyShareはcloudflaredのラッパーだけですか？
いいえ。GhostlyShareはCloudflareトンネルを使いますが、アプリ検出、ランダムまたはカスタム公開リンク、準備状態、アクセス停止、任意のパスワード保護を含むデスクトップワークフローを追加しています。
GhostlyShareは公開リンクにパスワード保護を付けられますか？
はい。公開前にパスワード保護を有効にしてください。訪問者はGhostlyShareが選択したローカルアプリに転送する前にパスワードを入力しますが、適切なアプリセキュリティの代わりにはなりません。
ルーターのポート開放は必要ですか？
本ガイドのトンネルワークフローでは不要です。cloudflared、GhostlyShare、ngrok、Tailscale Funnelなどはマシンからのアウトバウンド接続を開くため、通常はルーターのインバウンド開放は不要です。
ローカルトンネルでWebhookをテストできますか？
はい。ローカルのWebhook受信を起動し、トンネル経由で公開し、正しいコールバックパスを含む公開HTTPS URLをプロバイダーに貼り付け、テストイベントを送信してリクエストをローカルで確認します。
管理ツールやデータベースを公開すべきですか？
通常は公開しません。データベースコンソール、管理ダッシュボード、インフラパネル、デバッグエンドポイント、内部サービスは、意図的に強化されてインターネットからアクセス可能でない限り公開しないでください。
本番トラフィックにノートPCトンネルを使うべきですか？
いいえ。常時稼働し、更新を受け、監視され、障害復旧できるインフラ上の本格的なデプロイや管理トンネルを使ってください。