Zenn
🌐

WSL2にngrokをインストールする

2023/11/30に公開
WSL 2
ngrok
tech

はじめに

この記事は、WSL2へngrokをインストールし、ngrokをWSLのターミナルから使用できるようになるまでの手順を個人的な備忘録としてまとめたものです。
WSLやUbuntu、ngrokその他のアップデートおよび仕様変更によって将来的にこの手順が使用できなくなる可能性があります。(記.2023/11/29)

前提条件

  • WSL2がインストール済である
  • WSL2のディストリビューションがUbuntuである

ngrokとは？

ざっくり言うと、ngrokはローカルホストを公開インターネットアクセス可能なURLに変換するためのツールです。
これを使用すると、開発者はローカルで動作しているウェブサーバーやアプリケーションを外部からアクセス可能な形で共有できます。コマンド一つで手軽にURLを生成できるので、個人開発やハッカソンなどで自身のローカルで動作しているアプリを他の人に触ってもらう場合に便利です。

ngrokをインストールする

  1. 以下のコマンドを実行し、ngrokファイルをダウンロード
wget https://bin.equinox.io/c/bNyj1mQVY4c/ngrok-v3-stable-linux-amd64.tgz
  1. 以下のコマンドを実行し、解凍
tar -xzvf ngrok-v3-stable-linux-amd64.tgz
  1. 以下のコマンドを実行し、/usr/bin/localフォルダに移動 (これでどこからでもngrokコマンドが使用できるようになります)
sudo mv ngrok /usr/local/bin
  1. 解凍前のファイルは不要なので、以下のコマンドを実行し削除
rm ngrok-v3-stable-linux-amd64.tgz
  1. 以下のコマンドを実行し、ngrokのバージョンを確認
ngrok --version

ngrok version 3.4.0のようにバージョンが表示されれば正しく導入できています。

ngrokのアカウント登録とトークン取得

  1. ngrok公式サイトからアカウント登録し、AuthTokenをコピー (GitHubアカウントですぐに登録可能)
  2. 以下のコマンドを実行し、ngrokにトークンを設定
ngrok config add-authtoken <コピーしたAuthToken>

これでトークンが設定できたので、ngrokを使用することができるようになります。以上でngrokの導入は完了です。お疲れ様でした。

ngrokを使ってみる

基本の使い方はngrok httpでポート番号を指定するだけです。localhostのポート8080番でアプリを動かしている場合は以下のようになります。

ngrok http 8080

コマンドを実行するとターミナルの画面がガラッと切り替わるので、その中のForwardingという行のhttps://xxxx-x-xx-xxx-xx.ngrok-free.appというURLがngrokから提供されるURLになります。このURLにアクセスすると (他の端末からでも) ngrok経由でlocalhostの指定したポートにアクセスできます。

Discussion