Let’s code a serverless chatbot for Facebook messenger

Serverless is the buzzword of the infrastrucurte world these days. It may not fit into every place people are trying to squeeze it into but we’ve found that it works great for chatbots. Chatbots can easily surge when conversations are active and then fall into a baseline. Think sports chatbots during important games or pizza delivery chatbots after the bars close.

We’re defining serverless as when you don’t have fixed (server) infrastrucure you need to manage, the platform takes care of spinning from zero to massive.

Stack for this example

• Alana bot framework
• Google cloud functions

Repo with everything

https://github.com/alana-bot/example-serverless

The framework

Alana is a javascript based chatbot framework developed from the beginning with a serverless capability (that’s how we run it at alana.cloud, through Google cloud functions). It also has a few tricks to making writing bots easier… more on that later though

Framework setup & demo

Let’s start with a quick install of the alana’s CLI interface. This will install the framework and create the file structure alana expects.

$ npm i -g alana
$ mkdir ~/alana-serverless && cd ~/alana-serverless
$ alana init
$ ls

Alana is opiniated on your code structure, all the bot code is in scripts/ and test code goes into tests/.

Giving the bot some brains

We’ll make a bot that echos back the user’s input. Copy the following code scripts-main.js into scripts/index.js and tests-main.js into tests/index.js.

Quick install:

$ curl -o scripts/index.js https://raw.githubusercontent.com/alana-bot/example-serverless/master/scripts/index.js
$  curl -o tests/index.js https://raw.githubusercontent.com/alana-bot/example-serverless/master/tests/index.js

Alana uses the idea of ‘scripts’ to break conversations into components, a bot could have a script for profile creation, order tracking, exchange process, etc. If you’re coming from the back-end world think of them as routes for a web service. In this example we are creating a greeting (a special script sent only once when a user first connects with the bot) and a default script. Each script has dialogs to organize the flow. This script has a single dialog that will loop with each input.

Let’s make sure it all works by running the tests. Yes, testing is a first-class citizen of the alana ecosystem.

$ alana test

If everything is ok play around with your new bot on the console.

$ alana run --console

Setting alana up for self-hosting

Alana easily lets your drop out of CLI control and set you up for running it directly. The following command will add the necessary files and packages so the bot is self-sufficent.

$ alana self-host

Let’s add facebook as a platform to alana and request so we can communicate with Facebook’s send api

$ npm i --save @alana/platform-facebook request-promise request bluebird lodash.flatten 

Change index.js, we’re going to snub a the FB platform module since google cloud functions will take care actualling running the http server. We run each script inside a vm context so we can control its globals and inject alana’s globals without screwing with the larger process’ globals.

Quick install:

$ curl -o index.js https://raw.githubusercontent.com/alana-bot/example-serverless/master/index.js

Creating a facebook app

Select “Get Started” in the messenger section

You’ll need to already have a facebook page you want to connect to (or make a new one). Then go to developers.facebook.com and create a new app and open your new app. Make sure to add “Messenger” in the “Add product” section.

Next we need to get a page access token so the bot can talk to users. We’ll also need to set up a webhook but we’ll do that after we get cloud functions up-and-running.

Select your page and get an access token so your bot can talk to it

Paste this token into index.js replacing access_token

/** change these **/
const ACCESS_TOKEN = 'PAGE_ACCESS_TOKEN';
const VERIFY_TOKEN = 'verify_my_voice'; // don't need to change this

Set up a Get Started Button

$ curl -X POST -H "Content-Type: application/json" -d '{ 
  "get_started":{
    "payload":"GET_STARTED_PAYLOAD"
  }
}' "https://graph.facebook.com/v2.6/me/messenger_profile?access_token=PAGE_ACCESS_TOKEN"

Setting up cloud functions

Zip up the contents of your directory (excluding node_modules) with your favorite utility or from the command line:

$ zip -r -X ../serverless.zip * -x\node_modules/*

Create a Google cloud account and create a new project then open the cloud functions page in the compute section.

Create a new function, pick a fun name and set the memory to 512MB or 1GB, so we get the faster processor, otherwise replies will take a bit longer then they should at the 128/256 levels. Also be sure to select HTTP trigger and zip upload and set runbot as the function to execute.

Cloud function settings example

Let’s test everything

$ curl "{your-function-url}?hub.verify_token=verify_my_voice&hub.challenge=it%20works"

Set up FB webhook

Go back to your Facebook app developers page and set up the webhook. Make sure to set the callback url to your functions url and if you changed the verify token in index.js to the new verify token.

You will need the firls messages and messaging_postback at least

Click verify and save, if everything works the popup should disappear. Now we just need to register the page you chose with the webhook and we’re done

Subscirbe to the right page

It’s time to test the bot! Open your page on facebook and click message and chat away.

Shameful plug

Don’t want to set this up on your own?

We made alana.cloud so that you can focus on your bot and we focus on scaling it, plus we have a pretty kick-ass web chatbot-focused IDE.

Want to know more about alana? We’re polishing our documentation at https://alana.tech every day and have code on github at https://github.com/alana-bot.