ngrokとは
- ローカルPC上で稼働しているネットワーク（TCP）サービスを外部公開できるサービス
- 開発環境から外部APIと接続して外部APIからレスポンスを受け取りたい場合に使用する
導入手順
1. ユーザ登録
下記ngrok公式サイトからユーザ登録する。
https://dashboard.ngrok.com/signup
2. ngrokコマンドをインストール
2-1. 下記rgrok公式サイトのダウンロードページからファイルを取得する。
https://ngrok.com/download
2-2. ファイルをダウンロード後、任意の場所で解凍する。
2-3. ツールのインストールが完了後、アカウント登録後に表示される「Welcome to ngrok!」のページに表示されている「Connect your account」に記載されているngrokのコマンドを実行する。
→ ~/.ngrok2/ngrok.ymlが生成されたことを確認（認証トークン情報が登録されている）
3. Webサイトを公開する
3-1. 下記コマンドを実行し、ローカルにnginxをインストールする。
brew install nginx
3-2. 下記コマンドを実行し、ローカルPC上Webサイトhttp://localhost:8080が表示できることを確認する。
→「Welcome to nginx!」と表示されることを確認
nginx
3-3. 下記コマンドを実行し、外部公開用のURLを払い出しする。（8080部分については開発環境で使用しているポート番号を記載する）
ngrok http 8080
→下記のような内容が表示されることを確認
ngrok by @inconshreveable (Ctrl+C to quit)
Session Status online
Account XXXXXXXX (Plan: Free)
Version 2.2.8
Region United States (us)
Web Interface http://127.0.0.1:4040
Forwarding http://XXXXXXXX.ngrok.io -> localhost:8080
Forwarding https://XXXXXXXX.ngrok.io -> localhost:8080
→ 「Forwarding」に表示されているURLにアクセスし、ページが正常に表示されることを確認
エラー対処法
Blocked hostエラーが表示される場合
-
config/environments/development.rbに下記を記載し、ホワイトリスト全体をクリアする。
Rails.application.configure do
config.hosts.clear
end
参考
ngrokが便利すぎる - Qiita
Rails6の本番環境でBlocked hostエラーが発生したときの対処法 - Qiita