快速讓外網連接本機的利器 - ngrok
又是一篇久違的文章，最近真是太忙了，又要上班又要忙私底下的專案，回到家都累死了。而且最近也在忙組電腦的事情，也沒確定好，之後等電腦組好送來，再來發一篇心得及開箱文！
今天要介紹一款我開發 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：
1 | 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其實還有其他較進階的功能，如果之後有空在發文章說明囉～
最後最後！請聽我一言！
如果你還沒有註冊 Like Coin，你可以在文章最下方看到 Like 的按鈕，點下去後即可申請帳號，透過申請帳號後可以幫我的文章按下 Like，而 Like 最多可以點五次，而你不用付出任何一塊錢，就能給我寫這篇文章的最大的回饋！