概要
- ngrokをMacに入れてローカル開発環境を外からアクセスできるようにする
方法
-
下記にアクセスする。
-
「Mac OS」のタブにHomeBrewのインストールコマンドが記載されていたのでコピーする。
-
ターミナルでコピーしたインストールコマンドを実行する。
$ brew install ngrok/ngrok/ngrok -
インストール後下記コマンドを実行して正常にインストールされている事を確認する。
$ ngrok -h -
下記のように出力されれば問題なくインストールが完了して
$ ngrokコマンドが使えるようになっている。$ ngrok -h NAME: ngrok - tunnel local ports to public URLs and inspect traffic DESCRIPTION: ngrok exposes local networked services behinds NATs and firewalls to the public internet over a secure tunnel. Share local websites, build/test webhook consumers and self-host personal services. Detailed help for each command is available with 'ngrok help <command>'. Open http://localhost:4040 for ngrok's web interface to inspect traffic. EXAMPLES: ngrok http 80 # secure public URL for port 80 web server ngrok http -subdomain=baz 8080 # port 8080 available at baz.ngrok.io ngrok http foo.dev:80 # tunnel to host:port instead of localhost ngrok http https://localhost # expose a local https server ngrok tcp 22 # tunnel arbitrary TCP traffic to port 22 ngrok tls -hostname=foo.com 443 # TLS traffic for foo.com to port 443 ngrok start foo bar baz # start tunnels from the configuration file VERSION: 2.3.40 AUTHOR: inconshreveable - <alan@ngrok.com> COMMANDS: authtoken save authtoken to configuration file credits prints author and licensing information http start an HTTP tunnel start start tunnels by name from the configuration file tcp start a TCP tunnel tls start a TLS tunnel update update ngrok to the latest version version print the version string help Shows a list of commands or help for one command -
下記にアクセスする。
-
画面右上の「Sing up」をクリックする。
-
任意の情報を入力してサインアップを行う。（筆者はGithubのアカウントで認証を行った。）
-
ログインした画面に表示されている「2. Connect your account」の中に記載されているコマンドをコピーして実行する。
-
エラーが出ず下記のように出ればOK（認証の設定ファイルの場所は皆さんとは異なります。）
Authtoken saved to configuration file: /Users/okawashun/.ngrok2/ngrok.yml -
自分の環境では8000を一時的にパブリック・アクセスできるようにしたいので下記コマンドを実行した。
$ ngrok http 8000 -
下記のように表示され、一時的なURLが出力された。
ngrok by @inconshreveable (Ctrl+C to quit) Session Status online Session Expires 1 hour, 59 minutes Version 2.3.40 Region United States (us) Web Interface http://127.0.0.1:4040 Forwarding http://86ef-119-83-24-55.ngrok.io -> http://localhost:8000 Forwarding https://86ef-119-83-24-55.ngrok.io -> http://localhost:8000 Connections ttl opn rt1 rt5 p50 p90 0 0 0.00 0.00 0.00 0.00 -
自分の場合、既にDockerでlaravelのアプリケーションを動作させ、ローカル開発環境の8000をdockerのnginxコンテナの80ポートにフォワーディングさせていたので上記の
https://86ef-119-83-24-55.ngrok.ioにアクセスしたところ下記のようにlaravelのtop画面が表示された。（URLが若干違うのはngrokを再起動したため）