ngrokとは？ngrokを使って、簡単にhttps化して外部公開(Deploy)する方法
こんにちは、Webエンジニアのまさぴょんです！
今回は、ngrokとは、何か？ ngrokを使って、簡単にhttps化して外部公開(Deploy)する方法について、ご紹介します🐱
ngrok(エングロック)とは？
ngrok（エングロック）とは、開発者がローカルの開発サーバー（localhost）をインターネットに公開することを可能にするトンネリング/リバース・プロキシツールです。
本来、自分にしか閲覧することのできないlocalhost(ローカル・サーバー)を外部公開できることが、ngrok(エングロック)の魅力・用途です🌟
アプリのプロトタイプを一時的に外部公開して、誰かに見せたい時などに、ngrokは重宝します🙌
ngrokの導入と使い方
ngrokについて、理解したところで、実際にngrokを使ってみましょう！
1. ngrokのアカウントを作成する
まずは、ngrokのアカウントを作成します🌟
2. ngrokのinstallと認証を実施する
ngrokのアカウントを作成したら、ダッシュボードのget-startedから、使用しているOSなどを選択してください。
私の場合は、Macなので、次のように、installコマンドが表示されています。
ngorkをinstallする (Mac)
表示されているngrokのinstallコマンドを実行します。
brew install ngrok/ngrok/ngrok
ngrokコマンドのヘルプ
ngrokのinstallが成功したか、確認するために、helpを表示させてみましょう。
ngrok -h
ngrokのauthtokenを登録する
ngrokコマンドのinstallが成功したら、get-startedに記載のある次のようなコマンドを実行します。
これで、ngrokの認証トークンがngrok.ymlに追加されます。
ngrok config add-authtoken <authtoken>
アプリをhttpsで、外部公開(Deploy)する
それでは、実際にアプリをhttpsで外部公開(Deploy)してみましょう。
例えば、localhost:3012でアプリを動かしているとします。
その場合は、次のようにngrok http 3012でPortを指定するだけで、アプリをhttpsで、外部公開(Deploy)することができます。
ngrok http 3012
実際に上記のコマンドを実行すると、次のような画面になります👀✨
注目してもらいたいのは、次の行で、ランダムに生成されたhttps化されたURLから、指定したlocalhost:3012に繋がるように設定されている点です。
これだけで、無事にアプリをhttpsで、外部公開(Deploy)することができました🙌
Forwarding https://472f-60-148-104-115.ngrok-free.app -> http://localhost:3012
まとめ・感想
ngrokのおかげで、https化して、外部公開することが楽になりました🙌
ngrokをぜひ、活用してみてください💪🥺🔥
Xやっております！よかったらフォローしてください🐱
参考・引用
Discussion