Bot 教學

  • 1647
  • 0
  • bot
  • 2016-08-04

bot 教學

前言

今年4月中,Facebook在F8大會上宣布釋出聊天機器人API後,各式各樣的機器人開始出現,從交通運輸、匿名聊天到餐廳訂位等等各類的服務都有。Botlist這個網站整理出了各平台(Facebook、Skype等)上的機器人,大家可以在上面找到很有趣的應用。

CNN Facebook Bot 對話畫面

Facebook Messenger Api

本篇文章將以Facebook Mseesnger Api作為範例,實作一個BOT應用

1. 首先進入開發人員頁面,點下我的應用程式中的新增應用程式,並輸入顯示名稱、電子郵件、分類等資訊。

2. 點選左側的新增產品,選擇Messenger開始使用

3. 在權杖產生的欄位,選擇一個粉絲專頁並同意授權,記下「 粉絲專頁存取權杖 」。

  目前使用Messenger API必須先擁有一個粉絲專頁,您可以創建一個不公開的粉絲專頁來完成這個範例。

Azure Web 應用程式建立

在Messenger API中,我們必須要有一個支援SSL的伺服器,這個範例中我們將使用Azure web app,您可以申請試用或是其他方案

1. 在入口網站中,依序點選「新增」、「web + 行動」、「web 應用程式」。

2. 輸入應用程式名稱,選擇定用帳戶、資源群組及方案後按下建立,並等待部屬完成。

應用程式名稱為您的網域名稱,不可以和其他應用程式重複。

Webhook實作

這篇文章中我們使用 Node.js 來撰寫程式,您必須安裝好Visual StudioNode.js 工具

1. 開啟Visual Studio,點選「新增專案」。

2. 選擇 Node.js 中的 Blank Azure Node.js Web Application 並按下確定。

在「位置」選項中,請盡量避免中文路徑或是太長的名子。

3. 在右上方「方案總管」中,npm上案右鍵,選擇「Install New npm Packages」。

4. 搜尋 Express 並安裝,並依照同樣方法安裝 body-parserrequest,完成後您的方案總管應該像下方右圖所示。

 

5. 將 server.ts 檔案中的程式碼替換。

var http = require('http');
var express = require('express');
var request = require('request');
var bodyParser = require('body-parser');

var port = process.env.port || 1337
var app = express();
const token = "Your_token";
const page_token = "Your_page_token";

// 這裡用來處理Get要求,用來和Facebook驗證,當參數 hub.verify_token 正確,必須回傳 hub.challenge 完成驗證,用來防止 Facebook 送出非伺服器索取的要求
app.get('/webhook', function (req, res) {
    if (req.query['hub.mode'] === 'subscribe' &&
        req.query['hub.verify_token'] === token) {
        console.log("Validating webhook");
        res.status(200).send(req.query['hub.challenge']);
    } else {
        console.error("Failed validation. Make sure the validation tokens match.");
        res.sendStatus(403);
    }
});
// 使用bodyParser來處理JSON
app.use(bodyParser.json());

// 處理POST要求
app.post('/webhook', function (req, res) {
   	var data = req.body;
    if (data.object == 'page') {
        data.entry.forEach(function (pageEntry) {
            var pageID = pageEntry.id;
            var timeOfEvent = pageEntry.time;
            // 一次傳來的訊息可能不只有一個,使用For迴圈回傳每個訊息
            pageEntry.messaging.forEach(function (messagingEvent) {
                if (messagingEvent.message) {
                    
                    var senderID = messagingEvent.sender.id; //寄件者的id,只能作為回傳訊息使用
                    var message = messagingEvent.message; // 訊息內容
                    sendMessage("你好," + message.text, senderID);
                }
                else {
                    console.log("Webhook received unknown messagingEvent: ", messagingEvent);
                }
            });
        });
        // 回傳200,必須在20秒內回傳
        res.sendStatus(200);
    }
    else {
        res.sendStatus(403);
    }
});

http.createServer(app).listen(port);

function sendMessage(msg, id) {
    // 送給 Facebook 的要求,包含目標id和訊息,這裡使用純文字訊息做示範
    var messageData = {
        recipient: {
            id: id
        },
        message: {
            text: msg
        }
    };

    //發送要求,帶入 access_token 和 json
    request({
        uri: 'https://graph.facebook.com/v2.6/me/messages',
        qs: { access_token: page_token },
        method: 'POST',
        json: messageData
    });  
}
 
請將第9行中的 Your_token 替換成一組隨意的字串,這將用來和Facebook驗證。
請將第10行中的 Your_page_token 替換成您的「 粉絲專頁存取權杖
接收訊息的id和Facebook uid不一樣,只能在你的應用程式中用來傳送訊息。

6. 按下F5或上方的綠色箭頭開始執行,並在瀏覽器輸入 http://localhost:1337/webhook?hub.mode=subscribe&hub.verify_token=Your_token&hub.challenge=hello,請將Your_token換成您設定的字串,此時您應該可以看到畫面回應hello。

您可以將 Your_token 替換成不正確的字串,看看會有什麼回應。

7. 按下Shift + F5或上方紅色的方格停止執行,在您的專案上案右鍵,選擇「發行」,選擇「Microsoft Azure Web 應用程式」,登入您的帳戶,選擇您剛剛建立的應用程式,並點選「發行」。

您可以前往 http://botdot.azurewebsites.net/webhook?hub.mode=subscribe&hub.verify_token=Your_token&hub.challenge=hello,查看是否發行成功,請替換掉紅字的部分。

Webhook 設定

1. 至Facebook開發人員頁面選擇「新增產品」,Webhooks,開始使用。

2. 點選「新訂閱內容」,Page。在回呼網址 中輸入 https://botdot.azurewebsites.net/webhook (請將紅字部分替換成您的應用程式名稱),在驗證權杖中輸入您自訂的Token,訂閱欄位請勾選Messages。

回呼網址必須要為https開頭。

3. 測試機器人: 您可以使用您的個人帳戶傳送訊息給粉絲專頁,沒多久就可以看到回應訊息了!

若您的應用程式沒有辦法在20秒內回應200給Facebook,可能會收到像這樣子的開發人員警告。

後記

1. Facebook 提供了非常多的模板供開發人員使用,只要按照相對應的格式發出要求,就可以達到按鈕、圖片、附件、訂單資訊等等功能,甚至可以在程式處理需求時先發出「正在輸入(typing)」的要求!

2. Skype、Slack 等通訊軟體也有提供類似服務,Microsoft Bot Framework 提供了整合的服務,只要寫一次程式就可以應用在支援的服務上。

3. 可以搭配自然語言學習的服務,LUIS 來讓機器人能更人性化。