Express-Custom Facebook Chatbot

Posted on |
Response 1

Features

Facebook chat can custom response such as image, video, custom buttons. It can also add pay feature how ever still in demo.

I have a FB page about room rental. For my chatbot, I want it to introduct some basic room types and if customer asks a too complicated question, I’ll have a generic response.

User Story

  • [ ] User should see a getting started button
  • [ ] User see a welcome message
  • [ ] User see options have room types, price, features
  • [ ] User should see a generic phone number and message for complicated response

Code

  1. Change default message response

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    app.post('/webhook/', function(req, res) {
      ...
        if (event.postback && event.postback.payload === "getstarted") {
          sendText(sender, "歡迎來到高醫套房， 請問你想了解什麼？房型？價錢？特色")
          // welcome, what would you like to know? room types, price, features
        }
        if (event.message && event.message.text) {
          let text = event.message.text
          decideMessage(sender, text)
        }
      }
      res.sendStatus(200)
    })

  2. Direct mapping for specific keyword

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    function decideMessage(sender, text) {
      if (text.includes("房型")) { // Room Types
        sendText(sender, "我們這裡有一間5坪房間， 6間6坪房間， 2間7坪房間") // We have 15sq, 25 sq, 35sq room
      } else if ( text.includes("價錢")) { //Price
        sendText(sender, "長期約: 1年合約: 每月5500-6800$，2個月押金")
        // contract term is 1 year, monthly rent is 5500-6600, 2 months deposit
      } else if (text.includes("特色")) { // Feature
        sendText(sender, "獨立廁所，雙人床，桌子椅子，電視，冰箱，冷氣，烘洗衣機")
        //bathroom, queen size bed, tv, fridge, ac....
      } else {
        sendText(sender, "如果有更多問題, 請打給 0800-123-333。 會有專人幫你服務")
        // if you have further question, please call...
      }
    }

  3. Setup welcome message

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    app.get('/setup', function(req, res){
      setupGetStartedButton(res);
    })
    function setupGetStartedButton(res){
      var messageData = {
        "get_started":{
            "payload":"getstarted"
        }
      };
      // Start the request
      request({
          url: "https://graph.facebook.com/v2.6/me/messenger_profile?access_token="+ token,
          method: 'POST',
          headers: {'Content-Type': 'application/json'},
          form: messageData
      },
      function (error, response, body) {
          if (!error && response.statusCode == 200) {
              // Print out the response body
              res.send(body);
          } else {
              // TODO: Handle errors
              res.send(body);
          }
      });
    }

More pictures

Response 2 Response 3

Thoughts

Facebook chatbot is still a new technology. Even more advanced chatbot such as cnn only maps user to news. I think the future is to have implement with a AI so chatbot can be more lively.