今天要介紹一款我開發web後端上常用的工具，那就是ngrok，這款工具就跟標題一樣的功能，快速讓外網連接本機的利器！外網的意思就是我們會擁有一個公開的網址，可以讓其他人直接連上該網址上的內容，也就是說，當我們在開發專案的時候，常常都是在Local端進行開發。尤其當我們這個專案又是屬於前後端各自分工的性質的話，如果後端開發好Api，想要給前端接Api的話，怎麼辦呢？難道要將我們的Api架在一台主機上，在開port出去，讓外網可以連接進來？手續太麻煩了，對於新手而言還不知道該怎麼下手呢。當然現在也有所謂架設雲端伺服器的方式，來放置我們的Api，理論上是比自己架在主機上更加地容易，在這邊我推薦快速架設的雲端平台---Heroku，之後會發一篇教學文章來教如何將自己的Api架在上面。
但不管怎麼說，如果當下要快速測試，使用ngrok是最快的！
介紹ngrok
ngrok的原理就是可以把外界的請求轉發到你本機指定的 Port，也就是由 ngrok 產生一串公開的網址來讓外網存取你本機上的Port。它的優點是快速而且還提供了https的服務讓你使用上更安全，甚至還可以設置密碼保護。
下載ngrok
官方下載網址：https://ngrok.com/download
進去官方下載網址，選擇符合電腦的OS進行下載即可。在這邊用Windows來做示範。
基本上點選windows下載後，會是一個壓縮檔：
裡面就只有一個exe檔案而已，並沒有其他雜七雜八的，非常簡潔。
接著將ngrok.exe放置在你想要放置的硬碟位置即可~
執行ngrok
可以直接點擊ngrok.exe，它會出現一個terminal的畫面，並且上面會有工具的介紹，例如要怎麼使用該工具，有哪些terminal指令你可以怎麼下。
基本上只要將terminal路徑移到ngrok.exe下，或者你嫌麻煩的話，可以該路徑設為環境變數就可。
輸入以下指令即可啟動ngrok：
ngrok http <port>其中只有Port是你需要更改的，也就是說比如我的web專案啟動之後是在Local端是吃8080 Port的，就把以上指令的Port改成8080即可。
啟動之後，畫面呈現如下：
主要要注意的就是Forwarding，我們可以看到分別有http、https以及各自對應的Local端的網址。可以清楚的知道當外部使用者使用ngrok自動產生的公開網址，就能自動轉發到我們本地端的網址。
這樣就完成了！當我們要測試api，首先啟動我們本地端的web專案，再來開啟ngrok，將ngrok產生的網址給前端使用就可以了。
例如：
local端api網址：http://localhost:8080/v1/api
ngrok產生的網址：https://f7b332ff.ngrok.io
前端如何接我們的api呢？只需在串接成：https://f7b332ff.ngrok.io/v1/api。前端就能正確跟後端串接在一起了。
ngrok缺點
當然嘛，ngrok有提供免費版跟商業版，像我們這樣簡單使用是免費版的，會有一定的流量限制，像是一分鐘內只能連接60次的樣子。但對於快速測試已經很夠用了。有時候只是要測試前端給的參數有沒有符合後端所要的，當下要快速測試，就很方便。
總結
以上就是ngrok的簡單教學，簡單來說，是我開發後端不可或缺的工具。但ngrok其實還有其他較進階的功能，如果之後有空在發文章說明囉～
歡迎來我的個人部落格觀看： https://kennychen-blog.herokuapp.com/
