ngrokの使い方 - デプロイが間に合わなかった時の最終手段

攻略法

ngrokの使い方 - デプロイが間に合わなかった時の最終手段

はじめに

プレイヤーの皆さんには開発したアプリケーションをインターネット上にデプロイして提出することを求めています。しかし、中には技術的な理由や時間の制約で、デプロイが難しいと感じる方もいらっしゃるかもしれません。そこで、最終手段として、ngrokを使用してアプリケーションに接続できるURLを提出する方法を推奨しています。

ngrokを使うことで、あなたのパソコン上で動かしているアプリケーションを簡単にインターネットに公開し、他の人に見せることができます。この方法なら、デプロイの知識がなくても、開発したものを他の人と共有することが可能です。本記事では、ngrokの使い方を初心者向けにわかりやすく説明しますので、ぜひ参考にしてください。

ngrokの概要

ngrokは、あなたのコンピュータで作っているウェブサイトやアプリをインターネット上で見られるようにするツールです。これを使うと、自分のパソコンで動かしているウェブサイトやアプリを他の人に見せたり、テストしてもらったりできます。特に、他の場所にいる人に簡単にアクセスしてもらいたいときに、とても便利です。

主な機能

  1. 安全な接続: ngrokは、あなたのパソコン上で動いているウェブサイトに、安全な(HTTPSという方法で暗号化された)接続を提供します。これにより、インターネット上から安全にアクセスできます。
  2. 簡単な管理: ngrokには、ウェブブラウザやコマンドラインという方法を使って、接続の管理やモニタリングができる機能があります。
  3. アクセスの制限: ngrokでは、特定のユーザーだけがアクセスできるように、パスワードを設定したり、アクセスを許可するIPアドレスを指定したりすることができます。
  4. わかりやすいURL: ngrokの有料プランを使うと、カスタマイズしたURLを作ることができ、他の人にとってわかりやすいリンクを提供できます。
  5. 自動再接続: あなたのパソコン上で動いているウェブサイトが一度止まっても、ngrokは自動的に再接続して、同じURLを使い続けることができます。

ngrokの利用シーン

  1. 外部サービスのテスト: 他のサービスがあなたのウェブサイトにデータを送る場合、ngrokを使うと、その動作を簡単にテストすることができます。
  2. 遠隔デバッグ: チームメンバーやクライアントが、あなたのウェブサイトにアクセスして問題を再現したり、修正したりするのに使えます。
  3. デモンストレーション: 開発中のウェブサイトやアプリを一時的に公開して、他の人からフィードバックをもらうことができます。

ngrokの使い方

1. インストール

ngrokをインストールするには、公式サイトからダウンロードします。以下は、一般的なインストール手順です。

Windowsの場合

  1. ngrokの公式サイトにアクセスし、アカウントを作成します。
    a. 2段階認証が求められます。
    b. App Store Google Authentification 他の認証系アプリでも構いません。
    c. このアプリケーションをダウンロードしてください。
  2. ダウンロードファイルの場合
    a. ダウンロードページからngrokのバイナリをダウンロードします。
    b. ダウンロードしたファイルを解凍し、適切なディレクトリに配置します。
  3. Chocolatey
    a. choco install ngrok このコマンドを実行します
    chocoinstallngrok.png

Macの場合

  1. ngrokの公式サイトにアクセスし、アカウントを作成します。
  2. brew install ngrok/ngrok/ngrok をターミナルで実行します

brewinstallngrok:ngrok:ngrok.png

2. セットアップ

  1. ngrokのダッシュボードにログインし、authtokenを取得します。

  2. 取得したauthtokenをngrokに設定します。以下のコマンドを実行します。

    ngrok config add-authtoken <your_authtoken>
    

connect.png
macconnect.png

3. 接続の開始

ローカルで動作しているウェブサーバーをインターネットに公開するには、次のコマンドを実行します。

ngrok http 3000

このコマンドは、あなたのパソコンのポート3000で動いているウェブサーバーをインターネットに公開します。ngrokは、自動的にランダムな公開URLを作ってくれます。
ngrokconfigadd-authtoken.png
公開url.png

4. 公開URLの利用

ngrokが作成したURLを使うと、外部からあなたのローカルサーバーにアクセスできます。このURLをチームメンバーやクライアントに共有すれば、彼らもあなたのウェブサイトを見ることができます。また、ngrokのコマンドラインツールやウェブインターフェースを使って、接続の状態やアクセスログを確認することができます。

まとめ

ngrokは、あなたのパソコンで作ったウェブサイトをインターネット上で公開するための便利なツールです。Webhookのテスト、リモートデバッグ、デモンストレーションなど、さまざまなシーンで役立ちます。インストールや設定も簡単なので、すぐに使い始めることができます。ngrokを使って、開発中のウェブサイトを他の人に見せたり、テストしたりしてみてください。

参考文献

ngrok の無料版でドメイン・サブドメインを固定できる仕組みを試す! - Qiita
ngrokをMacに入れて使ってみる - Qiita
ngrokの使い方(windows版) - Qiita

Masuda Yosuke

最終更新 4 months ago