Creating A Facebook Bot Using Microsoft Bot Framework

Jun 30

Written by:
6/30/2016 9:51 PM  RssIcon

image

You can easily create a Bot and deploy it on Facebook.

image

To do this, we will use the Microsoft Bot Framework that contains the following components:

  • Bot Connector – A service that connects your bot to communication channels such as Facebook, Skype, and email.
  • Bot Builder – A C# and Node.js library that provides a powerful framework for constructing bots that can handle freeform and guided interactions.
  • Bot Directory – A directory of Bots that you can connect to.

image

The Bot Connector helps you connect your Bot to communication channels. You can write a Bot and expose the Microsoft Bot Framework-compatible API on the internet.

The Bot  Connector will forward messages to users, and will send the user messages back to your Bot.

image

To demonstrate this, we will start with the Bot created in the article: Creating a Hello World! Bot Using The Microsoft Bot Framework.

Set-Up Facebook

image

The first step is to log into your Facebook.com account (or create one).

image

Select Create Page.

image

Select a template, fill in the required information, and click Get Started.

image

To get the Facebook Page ID (that you will need later), click on the About tab…

image

… and you will find the Facebook Page ID.

Create A Facebook Developer Account

image

Go to: https://developers.facebook.com/docs/apps/register and click the button to create a Facebook developer account.

image

Click the slider to Yes to accept the Policy and click Register.

Create A Facebook App

image

Next, go to: https://developers.facebook.com/ (log in again if needed).

image

Select Add a New App.

image

Select basic setup.

image

Fill in the information and click Create App ID.

image

Make a note of the App ID, you will need it in a later step.

Click the Show button to display the App Secret. Make a note of it, you will need it in a later step.

image

Now that the App is created, you need to configure it to use the Facebook Messenger.

Click Add Product.

image

Select Messenger.

image

Select Get Started.

image

Facebook Messenger has been added.

Get Page Token

image

In the Token Generation section, select the page that you previously created.

image

A Page Access Token will be created.

Copy the Page Access Token.

You now need to configure it to talk to the Microsoft Bot Connector.

Configure The Callback Url and Verify Token

image

Go to: https://dev.botframework.com/ and Sign In.

image

Select My bots.

image

Select a published bot you created using the directions in the article: Creating a Hello World! Bot Using The Microsoft Bot Framework.

image

Click the Add button next to the Facebook Messenger channel.

image

Click the expander next to Set webhook callback url and verify token.

image

Use the Select buttons to individually select and copy the Callback Url and Verify Token.

image

Return to: https://developers.facebook.com, select your application, and in the settings for Messenger, click the Setup Webhooks button.

image

Enter the Callback Url and Verify Token your copied, check the Subscription fields indicated in the image above, and click the Verify and Save button.

image

After the Webhooks have been set, click the dropdown next to Select a Page.

image

Select the Facebook page you created earlier.

image

Next, click the Subscribe button.

Configure The Microsoft Bot Connector

image

Return to: https://dev.botframework.com/ and select your Bot again, then click the Edit button next to the Facebook Messenger channel.

Click the expander next to Enter your credentials.

Enter the information you gathered in the earlier steps and click the Resubmit button.

image

Check the box next to Enable this bot on Facebook Messenger.

Click the I’m done configuring Facebook Messenger button.

Talking To Your Bot

image

You can now talk to your Bot by navigating to:

https://www.messenger.com/t/{Your Page ID}/

This will take you to a Facebook Messenger, and after logging in with your Facebook ID, it will allow you to converse with your Bot.

image

Until your App is approved and made public, only you can chat with your Bot.

To create test accounts to test it, go to: https://developers.facebook.com/, select the App, and then select Roles and then Test Users.

Fill in the form that displays to create test users.

image

To allow real Facebook users to test it, select Roles and then Add Testers.

Fill in the form that displays to allow access for the users.

image

To make the Bot public, select App Review then click the slider to change it from No to Yes.

image

To request the needed permissions, select Settings under Messenger then click the Request Permissions button.

image

Select pages_messaging and then click the Add 1 Item button.

See this page for more information on the App review process:

https://developers.facebook.com/docs/messenger-platform/app-review

Links

Microsoft Bot Framework

Facebook for developers

Facebook Messenger (Stack Overflow)

Microsoft Bot Framework messages with buttons in Facebook Messenger

Download

You can download the code from the Download page