前言

這篇是專門寫利用 ngrok 架設本地伺服器的設定方法 (LINE bot local server)，
如果想要設定的是雲端伺服器，可以參考另外一篇 heroku 雲端伺服器服務的設定教學。
本地伺服器的好處就是方便 debug，缺點大概就是電腦要一直開著! (要開著才能提供服務啊!)
但雲端伺服器 debug 就比較麻煩一些 (還需要經過上傳)，不過好處也就是電腦就不用一直開著囉XD!

• 「line webhook URL 修改傳送門」：https://developers.line.biz/console/
  因為使用這個方法實在太常用到了，這邊也放一個，只要更新、重開 ngrok 都會用到。

ngrok 說明

ngrok 是一種將本地伺服器「映射到網際網路」上的方法(工具)，
你可以想像成我們本地的電腦本身就可以當一個伺服器，
例如：「http://127.0.0.1:5000」、「http://localhost:5000」，
但因為只有在「自己的電腦上看得到」，所以我們才需要一個工具，
將這個只有在「自己的電腦上看得到」的伺服器，映射到網際網路上。

這樣就可以方便我們快速開發囉! (因為實際上我們都是在「本地端操作」)

你可能會想問那 ngrok 的缺點是?

其實也很簡單，我們都說了我們的伺服器是只有在「自己的電腦上看得到」，
所以，「電腦只要關機了」就沒有服務了。
另外，免費版的 ngrok 只有「8 小時」，超過時間其實重連就可以繼續用…
但「映射網址」會被換掉，這點要注意，表示我們要去更換「line webhook URL」。

• 「line webhook URL 修改傳送門」：https://developers.line.biz/console/
  因為使用這個方法實在太常用到了，這邊也放一個，只要更新、重開 ngrok 都會用到。

step 1. 先去 ngrok 官方網站下載 ngrok 主程式

• ngrok 下載連結：https://ngrok.com/
  進去後點「Get started for free」

• 請選擇你的作業系統：

step 2. 請「務必」記下下面內容與金鑰

• 接下來，我們會用到下面第一行啟用 ngrok 的金鑰
• 而第二行是在本地啟動 ngrok 的指令，後面的 port 可以自行修改 (必須對應到你的程式碼)

step 3. 啟動 ngrok 方法

打開你的終端機，將 step 2 那兩行複製貼上

注意：你必須先移動到你的 ngrok 所在路徑，
另外 ngork 請解壓縮出來… (我之前就傻傻以為下載不用解壓縮XD)

./ngrok authtoken <你的金鑰>
./ngrok http 8080

如果 Windows 碰到上面指令不能用，請試著前面去掉「./」應該就可以了!
(親身經驗，另外還有路徑要對)

step 4. ngrok 畫面 (此處以 Windows 示範，其他作業系統大同小異)

• 我們「反白的地方」就是我們的映射網址，請「務必複製下來」 (複製第二行 https 開頭那個)

題外話：terminal 複製小技巧

• Linux terminal 複製：「command + shift + C」
• Mac terminal 複製：「command + C」
• Windows terminal 複製可以用下圖的方式，如下圖
  先「選取複製範圍」->「點上方視窗右鍵」-> 「編輯」-> 「複製」

step 5. 使用 step 4 複製的 ngrok 映射網址，修改 line webhook url 路徑

拿我們剛剛在 step 4 複製的 ngrok 映射網址，去修改 line webhook URL 路徑，
並在之後加入「/callback」，如下圖。

• line webhook URL 修改傳送門，之後更新都會用到：https://developers.line.biz/console/

★重要：因為免費版的 ngrok 最大只能連線 8hr，
重新連接的時候，http 映射位置會更新，記得去更新我們的 webhook

step 6. 驗證 ngrok 服務是否串接成功，按下 「Verify」

這邊我們按下「Verify」來驗證我們是否串接成功，記得下面的「Use Webhook」要打開。

這邊如果有跳以下 Error 先沒關係，主要是因為我們只有「啟動 ngrok」而「未啟動程式服務」

step 7. 按下 「Verify」之後，回到 ngrok 畫面

回去看我們的 ngrok 視窗，如果有出現新的 Post /callback 就成功了! (出現 502 Bad Gateway 也沒關係)

出現 502 Bad Gateway 是因為還沒有打開 localhost 的伺服器，也就是還「未啟動程式服務」。

到這邊我們就這設定完 ngrok 的本地伺服器囉 (LINE bot local server)

接下來，有了「伺服器」跟「機器人服務前端」，
我們就要來完成最重要的「機器人後端的服務」了! (可以想像成「機器人運作的邏輯」)

Reference

https://www.learncodewithmike.com/2020/06/python-line-bot.html

⭐Python 基礎用法 相關文章整理⭐：
1.	【Python】python list 清除, 移除內容元素 remove, pop, del, clear相關用法整理 sample code (內含範例程式碼)
2.	【Python】寫模組 module、package 總整理 Importing files from different folder
3.	【Python】python assert (斷言) 用法 sample code (內含範例程式碼)
4.	【Python】python 一行 if else 語法 (one line if else) sample code (內含範例程式碼)
5.	【Python】lambda 與 def function 使用方法與比較整理(內含範例程式碼)
6.	【Python】python map 使用方法 與 其他寫法比較整理 (內含範例程式碼) sample code
7.	【Python】python zip 使用方法 與 其他寫法比較整理 (內含範例程式碼) sample code
⭐Python 字串處理 相關文章整理⭐：
1.	【Python】python print 變數的值 & 變數名稱 方法總整理
2.	【Python】python string format str.format 總整理
⭐Python 檔案處理 相關文章整理⭐：
1.	【Python】python 開關檔範例 與 程式模板 with open / file open sample code
2.	【Python】取出檔案名稱 (含副檔名、不含副檔名) os path basename split 取出 檔名 路徑 不要副檔名 sample code
3.	【Python】在 python 中利用 os.chmod 更改檔案的權限 chmod 777
4.	【Python】利用 shutil 來複製檔案 shutil copy file
5.	【Python】python 建立資料夾範例 mkdir os.makedirs() sample code
6.	【Python】python 移除資料夾範例 rmdir shutil.rmtree() sample code
7.	【Python】確認檔案是否存在 os.path.isfile / 確認資料夾是否存在 os.path.isdir sample code is folder / file exist
⭐Python 系統偵測 相關文章整理⭐：
1.	【Python】python pyinotify sample code 偵測指定路徑底下的文件變化 (內有範例程式碼)
2.	【Python】python 利用 argparse 使程式執行時可帶參數 (內附範例程式碼) sample code
⭐Python 平行運算 相關文章整理⭐：
1.	【Python】threading – 建立多執行緒來執行程式 (內含範例程式碼) sample code
2.	【Python】multiprocessing – 01 | 用多核心來執行程式 (內含範例程式碼) sample code
3.	【Python】multiprocessing – 02 | pool, map, apply_async – 用多核心來執行程式並取得結果 (內含範例程式碼) sample code
4.	【Python】python thread multiprocess 比較總整理
5.	【Python】python pooling multiprocess – 用多核心來執行程式 sample code (內含範例程式碼)
⭐Python 測試程式 相關文章整理⭐：
1.	【Python】python 測試程式 – 利用 doctest 測試 python testcase 的優雅寫法，適用於 leetcode (doctest in function，搭配 function 的用法)
2.	【Leetcode】python – 利用 doctest 測試 leetcode python testcase 的優雅寫法 (doctest in class，搭配 class 的用法)
⭐Python Chatbot 相關文章整理⭐：
1.	【Chatbot】(全圖文說明) LINE Developers bot 機器人註冊與設定
2.	【Chatbot】(全圖文說明) ngrok 本地伺服器設定方法 – LINE bot local server
3.	【Chatbot】Dialogflow API 串接 python 的方法 (內含範例程式碼)
4.	【Chatbot】[講義分享] 手把手實作line機器人 (linebot API 運用)
⭐Python Google Colab (Colaboratory) 相關文章整理⭐：
1.	【Colab】Python colab 上傳檔案的方法 (內含範例程式碼) upload files
2.	【Colab】Python colab 連接 google 雲端硬碟取用資料 (內含範例程式碼) mount google drive
⭐Python 其他筆記 相關文章整理⭐：
1.	【Python】anaconda 更新 (upgrade) python 3.8 版本筆記
2.	【Sublime】Sublime 將縮排 “tab” 改成 4格空白 的方法 (圖文說明) sublime indent 4 spaces
3.	【Sublime】Python 縮排小技巧 (很爛但實用) 快速將 tab 改成「4格空白」的方法
⭐【喜歡我的文章嗎? 歡迎幫我按讚~ 讓基金會請創作者喝一杯咖啡! 】 如果喜歡我的文章，請幫我在下方【按五下Like】 (Google, Facebook 免註冊)，會由 「LikeCoin」 贊助作者鼓勵繼續創作，讀者們「只需幫忙按讚，完全不用出錢」哦!