在開發環境使用ngrok測試LINE bot(webhook)

在開發LINE bot途中遇到一個問題：如何在開發環境(本機)上取得、測試LINE message？

LINE bot的運作流程是這樣的：
1. 使用者傳送訊息到LINE bot帳號
2. LINE bot收到訊息後會將訊息post給Webhook URL
3. Webhook URL就是我們所寫的web service，負責實際處理收到的訊息

問題發生在2到3之間：
1. 首先是Webhook URL必須是公開的網址才能讓LINE bot呼叫，而開發環境(本機)上一般都是私有網址如http://localhost/api/
2. 其次是LINE bot要求Webhook URL必須有SSL，也就是必須是https

正規的做法就跟設定營運環境(production)一樣，買個public domain、弄個固定ip、申請ssl cert、安裝設定ssl cert & 網路環境...balabala

可以不用這麼麻煩

  

使用ngrok可以幫我們搞定這一切
ngrok使用時會產生一個公開網址(http://xxxxxxxx.ngrok.io)，之後使用反向代理技術(reverse proxy)將由公開網址來的流量轉發(forwarding)到本機的私有網址上


讓我們一步一步來
首先運行開發環境上的web service，取得私有網址以及埠號

 

這是一個.net core的web service，從圖中可以看到監聽http://localhost:5000

之後在CMD中使用以下指令來啟動ngrok

ngrok http -host-header "localhost:5000" 5000                                     

其中"localhost:5000"即是web service監聽的私有網址以及埠號

如圖顯示，ngrok產生了一個公開網址https://d22eda92.ngrok.io，並且將流量轉發到localhost:5000

現在將公開網址指定給LINE bot的Webhook URL

指定好之後按下旁邊的VERITY按鈕，LINE bot會發送測試訊息到該URL。可以看到在網址下方有個綠色Success顯示該網址能正確服務LINE bot

回到ngrok的視窗可以發現下方多了HTTP Requests的紀錄

這是剛才按下VERIFY按紐時LINE bot傳送的request，顯示ngrok有確實接收到request

接下來切換到web service視窗

同樣會發現web service多了一些處理的log，顯示ngrok有把request轉發到web service的私有網址上


以上，使用ngrok可以幫我們節省許多開發流程。不必再開發環境上申請與建置公開網址、也不用測試功能前還需要先release到有公開網址的環境去才能測試


Q & A
1. 保留公開網址：
ngrok每一次執行時都會產生一個新的公開網址，這意味著每次都需要更新Webhook URL。解決方案是...付費，付費用戶可以指定且保留公開網址。

2. 架設ngrok server：
公開網址上的所有流量都會先經過ngrok server後才到達我們運行的ngrok client端。如果有安全性上的考量，可以參考這篇架設自己的ngrok server


Reference:
How to use ngrok with Windows and Visual Studio to test webhooks
Self hosted ngrok server in Docker