Messenger Chatbot Setup Using Swift Web Server

last updated : May 21, 2016

Due to Swift was open sourced last year, there are lots of applications developed in Swift such as web server framework or even be compiled on Raspberry Pi. Last article, I just successfully compiled Swift on my Raspberry Pi 2, and even made GPIO control a LED. This time, I was going to talk about one of its web framework, Vapor, and I will use it to make a Facebook Messenger Bot.

Vapor has already been the most used Swift web framework on Github. Their documents are very clear and their official website is very elegant lol. On the other hand, Vapor gets updated frequently to run on the latest Swift 3 snapshots. Therefore, I recommend Vapor to do a web server.

Prerequisites

You can read the Vapor’s official instructions here
Install Swift 3 snapshot they asked. If you have Xcode 7.3, you’ll already have Swift 2 installed. Therefore, you need to verify that you are under the right environment because Vapor only support on Swift 3.

If you have lots of versions of Swift and you want to switch them easily, you can install Swiftenv or use the toolchain of Xcode.

Getting Started

First, we have to install Vapor (refer to this page) and make sure that CLI is successfully installed by running help.

curl -L cli.qutheory.io -o vapor
chmod +x vapor
sudo mv vapor /usr/local/bin
vapor help

Creating a Web Server

Now, we are able to create a new Vapor project.

vapor new <the name of project>
cd <the name of project>

You will find that there are a Package.swift file and some example codes in the project’s dictionary. Let’s build it.

vapor build

You will see that Vapor will clone some packages this project need. After all have done, run it.

vapor run

Now, you have successfully setup a Swift Web Server. Let’s visit the http://localhost:8080 on the browser. You will see a Vapor welcome page.

For much more details and guide, you can browse their official websit. 
In the following, I will start to talk about how to build a Facebook Messenger Bot using Vapor.

Facebook Messenger Bot

Recently, Facebook has launched their own Messenger platform and everyone could think some useful or some interesting applications on it for their businesses. Take CNN for example, now I will receive the news in my message box sent from CNN at a specific moment. On the other hand, if you want to search for the related news, you can just type the key words and CNN bot will send you the news they found.

I felt excited and I think that there will be lots of applications developed on Message platform. Therefore, I wrote a Bot using Python/Django last month for an easy test. As long as I send a message to my bot, he will response the same one to me.

Then, I found that why not write a Swift/Vapor one!

You can see my project in my github.

Create a App and a fan page on Facebook

According to the guide on Facebook, we need to have a Facebook App and Page at first. Then add the Messenger service to the Facebook App.

Setup Webhook

A webhook (also called a web callback or HTTP push API) is a way for an app to provide other applications with real-time information.

In this case, Facebook provides our app with real-time information i.e. whenever someone sends our page a message.
Back to our Vapor project and in main.swift, we have to receive a webhook request from Facebook, and response it.

Now, you have a URL to receive/response the webhook with your Facebook App.

http://localhost:8080/fbwebhook

Back to the setting of Facebook App, under the “PRODUCT SETTINGS” section, click on the “Messenger” product you just added, find the Webhooks section and click Setup Webhooks. Enter the URL for a Webhook, arbitrarily enter a Verify Token and select message_deliveries, messages, messaging_optins, and messaging_postbacks under Subscription Fields.

Facebook only accept https URL for Webhook. I use Ngrok that sets up secure tunnels to our localhost i.e. Ngrok gives web accessible URLs and tunnels all traffic from that URL to our localhost.
Go to Ngrok’s download page, download it, and simply run the command.

./ngrok http 8080

The terminal panel would looks like this.

In this example, https://cc6db8d0.ngrok.io/fbwebhook is the URL for Webhook I need. The “Verify Token” can be any value you wish. Now click on “Verify and Save” and your webhook is setup! You should see the green tick. Next, select the page you want your app to be subscribed to and click on Subscribe.

Make Bot reply you the Same Message

Now your Facebook App has been subscribed, Facebook will make POST requests every time the selected page event is triggered i.e. whenever user send you a message. Your Vapor server would receive a Json String, so you need to parse this Json and find out the message the user typed. Then, make Bot response you the same message.

At first, you have to get the Page Access Token here.

Using the Page Access Token generated in this step. This URL will subscribe your app to get updates for this specific Page.

let url = "https://graph.facebook.com/v2.6/me/messages?access_token=" + PAGE_ACCESS_TOKEN

In your webhook, listen for POST calls.

After everything is fine, open your own facebook messenger and send the message to your subscribed fan page. The Bot would reply you the same one!

That’s cool!

If you want to let your friends interact with your bot, you can add your friends in the Roles page in the setting page. And if you want to publish your bot, you need to go to the App Review page and wait a few days to let Facebook review your bot.

For full API reference and more details of Messenger platform, you can check Facebook’s official website.

If you have any problem, feel free to leave comments here or even join Vapor’s slack!