ngrokの開発環境をDockerで構築する

用途

ngrok、非常に便利です。
ただ、新しい開発機を買った時など環境構築が若干面倒なのでdockerで動かせるようにしました。
あまりないとは思いますが、ngrokを使った開発環境をシェアしたい時などにも使えると思います。

用意するもの

• dockerをインストールしておく

• ngrokのアカウント
  • authtokenを取得しておくこと

Dockerfile

ローカルで動かすFirebase Local EmulatorのCloudFunctionsをhttpsで外部公開したかったので、その目的に則した構成になっています。

FROM ubuntu:21.04

RUN apt-get update -y

# Install Java
RUN apt-get install -y curl openjdk-11-jre-headless

# Install Node JS
RUN curl -sL https://deb.nodesource.com/setup_14.x -o nodesource_setup.sh \
    && bash nodesource_setup.sh \
    && apt-get install nodejs

# Install ngrok
RUN apt-get install -y unzip wget
RUN wget https://bin.equinox.io/c/4VmDzA7iaHb/ngrok-stable-linux-amd64.zip
RUN unzip ngrok-stable-linux-amd64.zip\
    && mv ./ngrok /usr/bin/ngrok
RUN ngrok authtoken YOUR_NGROK_AUTHTOKEN # 自分のトークンに書き換えてください

# Install npm
RUN npm i -g npm

# Install firebase
RUN npm install -g firebase-tools

# Clean
RUN apt-get clean \
 && rm -rf /var/lib/apt/lists/*

package.json

startスクリプトの内容は適宜書き換えてください。
ここでは以下を行なっています。

• functionsディレクトリを監視＆ビルド
• 5001番ポートをngrokでドメイン指定して公開
• firebase emulatorsを起動 (functionsサーバーが5001番ポートで立ち上がる)

ngrokのドメイン指定は課金が必要ですが、無課金・指定なしでも利用できます。
（その場合、立ち上げるごとにランダムな文字列がドメインとして与えられます）

{
  "name": "YOUR_APP_NAME",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "cd functions && yarn build -- --watch | ngrok http -region=jp -hostname=YOUR_DOMAIN.jp.ngrok.io 5001 | firebase emulators:start --only functions",
  },
  "dependencies": {
  },
  "devDependencies": {
  }
}

起動コマンド

npm start

YOUR_DOMAIN.jp.ngrok.io　にリクエストを飛ばせば、localhostと同じように機能します。

ドメイン未指定の場合、上記のスクリプトだと割り当てられたドメインが分からないと思うので、スタートスクリプトの内容を以下に変更してください、
"cd functions && yarn build -- --watch | firebase emulators:start --only functions | ngrok http -region=jp -hostname=YOUR_DOMAIN.jp.ngrok.io 5001"