ngrokで開発環境をそのまま外向けに公開する

社内の開発環境などで作成したWebアプリケーションをとりあえずモックとして公開したい場合などがあると思います。

しかし、モックを公開するためのだけにサーバーを用意するのは時間がかかりますし、何より無駄なリソースです。

そこで今回は、ローカルの開発環境を一時的に外向き公開できるサービス ngrok をご紹介します。

はじめに

今回の環境は CentOS にて実装しております。
ご利用になる環境に応じて読み替えてください。

ngrokに登録する

最初にngrokのサービスへ登録しましょう。

サインアップ からユーザー登録できます。

そして、登録が完了したら Dashboard > Auth にある Your Tunnel Authtoken の内容を控えておきます。

ngrokをインストールする

そして ngrok公式サイト からダウンロードをしましょう。

ダウンロードが完了したら、展開しておきましょう。
(パスが通っていない場所に展開した場合、パスを通しておくと便利です)

アカウント接続する

下記コマンドを実行して ngrok.yml というファイルを生成しましょう。

これで基本的な設定はおしまいです。

試しに接続してみる

設定が完了したので接続を実行してみましょう。
下記のコマンドを入力して、接続状況が出れば成功です。

この Forwarding に記載されているURLが外からアクセスできるURLです。

試しに手持ちのスマホなどで、ローカルネットワーク以外から接続できるかチェックしてみましょう。

設定ファイルで簡単にBasic認証をつける

毎回コマンドを入力するのはとても面倒ですね。

しかも公開したい相手ごとに設定が違う場合、かなり面倒なことになってしまいます。

そんな時はファイルにまとめてしまいましょう。

あとはコマンド1つ入力で簡単にできます。

設定ファイルとコマンド内容でお気づきの方もいると思いますが tunnels の次の項目が設定名です。

この設定名ごとに設定をすることができますし、コマンド自体をShellスクリプトにしてしまえば、もっと楽に起動できます。

そのほか細かい設定については コチラ からご覧ください。

さいごに

ngrokの記事は結構出ていますが、設定ファイルでのアクセス方法はほとんど記載がありませんでしたので、改めて書いてみました。

これで少しでも開発に時間が割けるようになるといいですね。