使用 ngrok 讓本機上的網站讓全世界看到

這個 title 會不會下得太過火？！

回到主要目的，您一定有過這樣的經驗：想測試個功能，卻要大費周章地將程式部署到測試機、發揮創意做的小東西都沒有對外公開的 host 環境可以測試，即使是使用雲端，也是需要經過一些申請跟部署，加上費用也是考量的因素之一，而常常花在這些零碎工作的時間可能都比真正開發的時間要長。

現在我們可以使用 ngrok 這個服務來解決問題：我們可以將自己電腦上的網站透過 ngrok 的對應，讓其他人可以透過 ngrok 提供的網址來瀏覽原本只存在本機上的網站。

看完說明有沒有覺得是個好東西，就讓我們馬上開始吧

設定方式

如何開始
直接至下載點下載對應 os 的版本並解壓縮
如果連網需要透過 proxy 才需要進行下列步驟
- 先執行下列指令會自動建立 configuration 檔案
```
   ngrok authtoken {token}
```
- authtoken 需經由註冊取得
  - sign up for an account
```
![3AUTHTOKEN](https://cloud.githubusercontent.com/assets/3851540/22231645/b6284c4a-e21f-11e6-836d-1694f0276349.png)
```
- 設定 proxy
  - 開啟 configuration 檔案
    Windows 預設 configuration 路徑：C:\Users\{username}\.ngrok2\ngrok.yml
  - 加入 proxy 設定
```
   http_proxy: "http://user:password@proxyserver:port"
```
如果連網需要透過 proxy 才需要進行上述步驟
啟動 ngrok
ngrok http port
e.g. ngrok http 80 表示使用 http 80 port
- 預設同時啟用 http 及 https
取得可連線的 url
- 使用 ngrok
- 使用 Web Interface
  - 服務開啟後，預設會建立 Web Interface 來提供相關資訊
  - 預設是 http://127.0.0.1:4040/
即時偵測網站資源被呼叫狀況
會列出網站相關資料被存取的紀錄，及使用的 http verb
- 使用 ngrok
- 使用 Web Interface
檢視 request 及 response 細節
- 可以確認收到的 header 與 body 是否正確
重新執行 request
加上網址存取密碼
ngrok http -auth="username:password" 80
- 設定帳號 及密碼，加強資安控管
其他一堆設定……
請上 ngrok 文件更深入瞭解