Build, test & deploy bots on Facebook Messenger

Our earlier guides demonstrated the creation of a bot using Gupshup's Bot Builder tool. Using the methods mentioned in the above guides, let us create a simple bot that asks the user for his/her favourite publication and then prints the day's top stories from that publication. We will then publish this bot to Facebook Messenger.

Please do read the previous guides, before proceeding.

1.   Build:

Create a new bot using the Bot Bulider. In the messageHandler() method, ask for the user's favourite publication.

if(event.message.toLowerCase() == "hi") {
                context.sendResponse("Hey there " + event.sender + " Do you prefer reading Wired or Techcrunch?");
            }

Lets us set the user's preferences based on the answer given.

else if((event.message.toLowercase() == "wired") || (event.message.toLowercase() == "techcrunch")) {
                setPreference(event.message);      
            }

We're going to use persistence to store the user's preference.

function setPreference (pref) {
            context.simpledb.roomleveldata.publication = pref;
}

2.   Test:

Let's use the Gupshup Proxy Bot to test out the bot.

Once the user's preference is set, make an http call to the publication's RSS feed. Here, we're using Google's RSS feed to get the top story of the day.
Here's how it will look:

function setPreference (pref) {
            context.simpledb.roomleveldata.publication = pref;
            context.simplehttp.makeGet('https://ajax.googleapis.com/ajax/services/feed/load?v=2.0&q=http://www.' + event.message + '.com/feed/&num=1');
}   

In our HttpResponseHandler() handler, parse the response from the RSS feed and display the news article. This is how the method will look:

function HttpResponseHandler(context, event) {

            var respJson = JSON.parse(event.getresp);
            var stories = respJson.responseData.feed.entries;
            var resp = "";

            for (var i = 0; i<1; i++) {
                resp = resp + stories[i].title + "\n" + stories[i].link + "\n";
            }

            resp = resp.replace("&nbsp", "");
            context.sendResponse(resp);
        }

Here is an image of the bot in action

Your bot is now ready to be published to any messaging channel.

3.   Deploy:

Now publish your bot to Facebook Messenger using the Bot Builder's publish functionality.
Go to Facebook developer portal and login. Click on the My Apps tab at the top-right of your screen and 'Add a New App'.
The Facebook App can remain in sandbox mode.

Once created click on Add Product in the left-menu bar and choose Messenger. Go to the Webhooks section and setup your Callback URL and Verify Token. The Callback URL and Verify Token can be found in our documentation

Then create a Facebook Page for your app.

The Page does NOT have to be publicly visible,
Go back to the app you've just created and find the Token Generation section. Select the Facebook Page you have just created. A Page Access Token will be generated for you.

You can get your Facebook Page ID by clicking on the 'About' tab on your page and then scrolling right to the bottom.

Submit your Page ID, page access token and the welcome message to Gupshup's Publish page and your bot will be live on Facebook.

Hit submit and your bot will be live. Your bot will need to be approved/reviewed by Facebook before the public can access it. You can add testers to try a chatbot linked to your Facebook Page while your app is under review.

1.In your App open the 'Roles' section.
2.Find the 'Testers' group in the bottom of the page and click Add Testers.
3.Add people to test your app.

4.   Publish/App Review by Facebook:

Prerequisite
1. Icon - You can upload a JPG, GIF or PNG file. The size of the image must be 1024 x 1024 pixels. File size limit 5 MB
2. App display name.
3. App namespace.
4. Contact Email.
5. Category.
6. Privacy policy URL
7. Terms of Service URL
8. Video - You'll be prompted to upload a screen cast of your chatbot working.
9. Facebook page.

In the Messenger section press the 'Request Permissions' button. Choose pages_messaging from left panel in the popup that appears.
Fill required fields and upload a video showing your chatbot in action.

In the App Review section click on 'Submit for Review'.
It will take anywhere between one day to a week until your App is reviewed by Facebook.
You'll be prompted to upload a screen cast of your chatbot working.