TOC-Project 2018 FAQ

tags: NetDB

如果要寄信詢問Code問題，建議除了錯誤訊息之外也把 Code 附上。

另外郵件內文如果包含 '502' 之類的文字會進到垃圾信，這點要注意一下。

Index

• Q1. macOS 安裝 pygraphviz 有 Error 發生？
• Q2. 如何在 Heroku 使用 pygraphviz
• Q3. 用 anaconda 執行 app.py 出現 TypeError
• Q4. Page Webhook 驗證並儲存後， ngrok 跟 終端機都沒顯示收到訊息
• Q5. Webhook 驗證成功，但 Messenger 發訊息時 ngrok 沒反應
• Q6. 用朋友的帳號對臉書發訊息沒反應
• Q7. 一定要用 pygraphviz 畫 FSM 的圖？
• Q8. ubuntu 上 pip3 install pygraphviz 有 error
• Q9. 收到非文字訊息(貼圖or圖片)會產生 Error

Q1. macOS 安裝 pygraphviz 有 Error 發生？

以下介紹是用 homebrew 安裝 graphviz，如果你是用 anaconda 也是相同步驟，只是指令會有不同。

1. 你的環境需要先有 python3, pip3, homebrew

2. 使用 homebrew 安裝 graphviz
   brew install graphviz

3. 先找到 graphviz 的路徑，可以用 brew info graphviz 查看

4. 使用 pip3 安裝 pygraphviz，並指定 graphviz 的路徑

$ pip3 install 
--install-option="--include-path=/usr/local/Cellar/graphviz/2.40.1/include/graphviz" 
--install-option="--library-path=/usr/local/Cellar/graphviz/2.40.1/lib/graphviz"
pygraphviz

5. 測試，如果在 python 中 import pygraphviz 沒問題的話，就代表裝成功了！

reference:

• https://blog.csdn.net/qq_36847641/article/details/78224910
• https://github.com/pygraphviz/pygraphviz/issues/100

Q2. 如何在 Heroku 使用 pygraphviz

注意： 部署到 Heroku 是加分項目

安裝 pygraphviz 需要一些相依套件，這些套件在 heroku 上需要另外安裝。

1. 設定 使用兩種 heroku buildpack

$ heroku buildpacks:set heroku/python
$ heroku buildpacks:add --index 1 heroku-community/apt

設定成功終端機應該會列出下列資訊

2. 新增 Aptfile 於應用程式根目錄 (跟 Procfile 相同路徑)
   裡面放這三行( pygraphviz 需要用到這三個 package)，如果你有用到其他需要 apt-get 的 package 也是寫在這裡。

graphviz
libgraphviz-dev
pkg-config

3. 再重新 deploy 即可

注意，如果你是用介誠助教的 code 來改，那請參考Toc deploy 2018 這份簡報p25
(1) 再多加 Procfile 這個檔案，裡面放你的code 執行方式

web: python app.py

web: python app.py 即可，不需要用web: python3 app.py

(2) 還有 PORT 的地方 deploy 時記得改成讀環境變數，不能寫死，因為 heroku 不會用 port 5000 跑你的程式。 host 也記得改成 0.0.0.0

如果後續你想繼續在自己電腦跑這程式，記得自己也要設定本機的環境變數

$ export PORT=5000

Ref: How To Read and Set Environmental and Shell Variables

(3 Optional) VERIFY_TOKEN 跟 ACCESS_TOKEN 這兩個如果你不是直接寫死在code裡，而是也改成讀環境變數的話，那請自己設定 Heroku 上這些變數要設多少

$ heroku config:set VERIFY_TOKEN=你設定的 verify token
$ heroku config:set ACCESS_TOKEN=你的粉專 access token

• 這裏 PORT 就不用設定了，不然意義跟寫死一樣

References:

• Using Multiple Buildpacks for an App
• heroku-buildpack-apt
• Heroku Buildpack: Python
• Configuration and Config Vars

Q3. 用 anaconda 執行 app.py 出現 TypeError

如果你的環境是 anaconda，而在執行 app.py 時，出現跟上圖一樣的 Error，這是 bottle 這個套件的 Bug，

run(host="localhost", port=5000, debug=True, reloader=True)

將 reloader 這個參數拿掉，改成

run(host="localhost", port=5000, debug=True)

就可以成功執行。

Q4. Page Webhook 驗證並儲存後， ngrok 跟 終端機都沒顯示收到訊息

點擊驗證並儲存後，成功驗證，但 ngrok 沒收到請求

A: 這是臉書的Bug，請務必先 "移除訂閱"

如果你沒有移除訂閱那就算token(驗證權杖)沒輸入，他也會像驗證通過一樣回到設定頁面。

再重新綁定 (選 page 的 webhook，不是User的)。

驗證成功終端機應該會收到這樣的訊息。

警告：如果你有重開 ngrok，重新驗證 page webhook 成功後，如果在 messenger發送訊息 ngrok 也沒反應，請務必"先取消再重新訂閱粉專" (見Q5說明)。

Q5. Webhook 驗證成功，但 Messenger 發訊息時 ngrok 沒反應

A: 原則上這時候 不需要重開 ngrok，也不需要重設粉絲專頁存取權杖(ACCESS_TOKEN)(如果你之前有取得過就繼續沿用) 也不需要創建新的應用程式甚至粉專 只要先取消再重新訂閱粉專即可。

如果你之前碰到這問題時已經開了很多應用程式，也都曾綁定該粉專，建議把那些應用程式全部砍掉。

說明

當你剛移除webhook訂閱，再重新驗證並儲存時，你所看到的頁面應該長這樣，顯示未訂閱任何粉絲專頁。

但這似乎是臉書的 Bug，他其實是有訂閱先前粉專的(如果你的BOT沒問題你會發現這時BOT仍可正常收發訊息)。

這時請先編輯事件再儲存，原則上如果只要收發文字功能勾選 messages 即可

如果你之前有訂閱過粉專，你會發現這時他自動沿用舊的粉專。

這時請點選"選擇粉絲專頁:"，重新選取該粉專，再"取消訂閱"

這時再重新訂閱一次該粉專，理論上這時BOT就可正常運作了。 如果仍不行可再來信。

Q6. 用朋友的帳號對臉書發訊息沒反應

原則上在 chatbot 審核完成進入上線模式前，能使用該 bot 的只有管理員, 開發人員與測試用戶。

審核方式

Q7. 一定要用 pygraphviz 畫 FSM 的圖？

不用，只要你的 FSM 圖是用程式畫出來即可，用什麼工具都可以。 原則上畫出來之後把圖儲存起來放到 README 上即可，畫圖的程式也不一定要保留。

Q8. ubuntu 上 pip3 install pygraphviz 有 error (12/14 23:08 更新)

pygraphviz 需要一些相依套件，可以先把以下套件裝完，

sudo apt-get install graphviz libgraphviz-dev pkg-config

# 如果你用 OS 課給的 ubuntu，請再多跑下面這一行
# 後面 python3.6-dev 是看你的 python 版本，也可能要改成 python3.5-dev

sudo apt-get install python3.6-dev

這樣再 pip3 install pygraphviz 應該就可以了

如果這樣還是有問題請來信或約時間討論

或者可以換個環境
(1) 不要用OS課給的ubuntu，用別的
(2) 在 windows 上裝 python 來跑。
(3) 參考 moodle 公告來申請AWS教育版，再開一台EC2 Instance(虛擬機)

–
注意 一般用 pip install 會裝在 python2 的環境下，pip3 install 才會在 python3 環境下

或者你也可以用 pipenv 管理環境

Q9. 收到非文字訊息(貼圖or圖片)會產生 Error

如果是用 TOC-Project-2019 這份的範例程式碼來改，因為助教這邊沒有例外處理非文字訊息的狀況，所以收到貼圖或圖片等訊息，會有 KeyError 產生，如下圖：

如果要處理掉非文字訊息，你可以參考同一份 Repo 中的 fsm.py，助教有更新程式碼了，新增以下這行條件即可。

if event.get("message") and event['message'].get("text"):

說明

這是收到「讚」會得到的 request，可以看到 message 這個 field 下並沒有 text 這個 key，也因此直接存取 body['entry'][0]['messaging'][0]['message']['text']
會發生 KeyError

{
  "object": "page",
  "entry": [
    {
      "id": "456171064909069",
      "time": 1545198854126,
      "messaging": [
        {
          "sender": {
            "id": "1827331834032458"
          },
          "recipient": {
            "id": "456171064909069"
          },
          "timestamp": 1545198853620,
          "message": {    // 沒有 text 這個 key
            "mid": "NIpssuRqIrz2NiMGATrlvzwkjsrSlWNecpJ96uMsSAEwtqujXKU24KEioWRkSCocKkIWPOmyCtl-d7BRoRG1KQ",
            "seq": 1264303,
            "sticker_id": 369239263222822,
            "attachments": [
              {
                "type": "image",
                "payload": {
                  "url": "https: //scontent.xx.fbcdn.net/v/t39.1997-6/39178562_1505197616293642_5411344281094848512_n.png?_nc_cat=1&_nc_ad=z-m&_nc_cid=0&_nc_ht=scontent.xx&oh=056f708ae682055bb08ca753b9ceaf45&oe=5C8FD375",
                  "sticker_id": 369239263222822
}}]}}]}]}