How to build a Bot for Facebook Messenger - Setup

想要做一個 Facebook Messenger 機器人,第一步要做什麼呢?

當然是先建一個來玩玩,我直接參考 Facebook 官方文件 的 Getting Started ,使用 Node JS ,在 10 分鐘內打造 Bot (這是它的 slogan ,而且很顯然花了我不只十分鐘否則就不需要寫這一篇了)。

古今中外的 chatbot 應該作法都類似,有一台 Server 模擬人,這個 Server 和各種 messenger 例如 Line, Facebook Messenger and Slack 之間約定好一個溝通的渠道,然後像個人一樣的回訊息!

┌-------┐  read  ┌---------┐
│ Human │<-------│Messenger│
│       │------->│         │
└-------┘ write  └---------┘

┌--------┐  read  ┌---------┐
│ Server │<-------│Messenger│
│ (bot)  │------->│         │
└--------┘ write  └---------┘

要開始啦!這篇主要是補完文件上沒有說明的各種部分。

建立 Facebook App 和粉絲頁

建立一個新的 Facebook App 後,在 Dashboard 上 Token Generation 的地方選擇想要 access 的粉絲頁,並複製產生的 page access token 。

建立 bot

首先去 Github 下載 Sample Code ,這是一個 Node JS project ,代表了我們最重要的 bot 角色。

既然這個 bot 需要和 messenger 溝通,那他當然必須架在 messenger 可以連到的地方。所以要成為 bot 的條件就是:

  • 有 public URL
  • 可以用 SSL 連線(驚!)

第一點很容易,有一台 AWS 的 EC2 就行,第二點是 Facebook 的 Webhook 規定,而且它還不接受自己簽署的憑證哭哭

於是我們找了一個免費簽發憑證的 CA:https://letsencrypt.org/ ,它 based on domain name 來發憑證,而且 Facebook 也承認它簽發的憑證。不過每張憑證只有 90 天效期,官方建議每 60 天自動 renew 。

簽發憑證

Letsencrypt 官方建議有 Shell Access 的機器使用 Certbot 來產生憑證,選好系統和想要安裝的 webserver 以後就照步驟來。選 webserver 的原因是它可以幫你直接設定,不過也只產生憑證、自己來改設定檔。
我使用 ubuntu 14.04 (trusty) 和 Apache 。

wget https://dl.eff.org/certbot-auto
chmod a+x certbot-auto
./certbot-auto

設定好一些基本資料以後,就可以開始產生憑證了:

./certbot-auto certonly --apache -d example.com -d www.example.com 

這裡的 certonly 代表只產生憑證、不代為設定; --apache 其實也可以不用下,會有選項可以選; -d 後面代表要簽署的 domain name ,可以多個,如果沒有下這個指令的話,在過程中也會自動抓出幾個來給你選,不過我想要綁的 domain name 都沒有出現,所以就自己下參數了。

簽署完的憑證會放在 /etc/letsencrypt/live/ 裡,我的 Apache virtual host 設定長這樣:

<VirtualHost _default_:443>
     SSLEngine On
     SSLCertificateFile /etc/letsencrypt/live/example.com/cert.pem
     SSLCertificateKeyFile /etc/letsencrypt/live/example.com/privkey.pem
     SSLCertificateChainFile /etc/letsencrypt/live/example.com/fullchain.pem
     ServerName example.com
     ProxyPreserveHost on
     ProxyPass / http://localhost:5000/
</VirtualHost>

我的設定方式是對外透過 Apache 再導去 Node 使用的 port 5000 ,所以把憑證安裝在 Apache 上。如果是直接使用 Node 對外或許可以直接在 Node 安裝憑證。

設定專案

機器準備好了!再來是專案。前面下載過 Sample Code ,下載完 Node project 以後要做的事情當然是:

npm install
npm start

然後華麗地出錯!

Missing config values

要先設定 config 唷^^ 打開 config/default.json :

{
    "appSecret": "", // Facebook App 的 App Secret
    "pageAccessToken": "", // 上面複製過的 page access token
    "validationToken": "please_verify_me", // 隨意輸入
    "serverURL": "https://example.com" // 自己的 domain name
}

這樣應該就可以好好啟動了

在 Facebook App 設定 Webhook

回到 Facebook App Dashboard ,選擇 Setup Webhooks

  • Callback URL: 填入 https://example.com/webhook
  • Verify Token: 填入上面自己隨意填寫的 please_verify_me ,用來向 Node server 驗證
  • 下面選擇 messagesmessaging_postbacks

驗證通過就完成了一個 echo 機器人,可以跟他聊天享受鬼打牆的快感。

--

看起來很容易但中間撞了好幾次牆,例如發現需要 SSL 以後先試著自己簽一張憑證但不被承認,和 letsencrypt 的決鬥也並非那麼順利,很多亂七八糟的問題,總之冷靜下來好好看錯誤訊息,一切都會好好的,錯誤訊息不會騙你,還會引導你不要多走那麼多冤枉路。

P.S. 記得要回來設定 renew certificate