7
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

ngrokの使い方(windows版)

Posted at

【ngrokとは】

localhostで動いているシステムを、
公開サーバ上のようにアクセスできるツールです。

今回はローカル上のlaravel Socialite でlineログインをするために、
LINE Developpersの「コールバックURI指定」でlocalhostが使用出来ないために
解決策を探していたらこのツールの存在を知りました。

【環境】

・Windows11 pro
・laravel ^8.75
・laravel/socialite : ^5.0
・socialiteproviders/line : ^2.1

【前提条件】

・ngrokにアカウント登録済
・(Windows版)をダウンロードし ngrok.zipを任意のフォルダに解凍済
・localhostでlaravel起動済

【使い方】

にアクセス

Setup - ngrok — Mozilla Firefox 2022-08-22 13.34.5.png

ダウンロードしたngrokのフォルダを開き、ngrok.exe をダブルクリック
ngrok-v3-stable-windows-amd64 2022-08-22 15.18.47.png

ngrokのコマンドウィンドウが起動
C__Users_user_Documents_app_ngrok-v3-stable-window.png

https://dashboard.ngrok.com/get-started/setup
で下記をコピーして、ngrokのコマンドウィンドウにペースト

ngrok config add-authtoken xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

ポートの方も同様にコピーして
ローカルで起動しているポート番号に合わせてペースト

ngrok http 8080

すると下記のような画面になり
赤枠部分のURLをコピーしてブラウザに貼り付け

C__Users_user_Documents_app_ngrok-v3-stable-window.png

Visit Site ボタンを押下

ERR_NGROK_6024 - You are about to visit 6d75-122-1.png

無事localhostのlaravelの画面が表示されました

Laravel - Google Chrome 2022-08-22 15.32.18.png

【参考】

7
6
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?