Skip to content

Xatkit Facebook Messenger Platform

Jordi Cabot edited this page Jan 23, 2021 · 3 revisions

This page will show you how to build and install the Facebook Messenger Xatkit platform and also how to locally start an example bot on your own Facebook page. Here is also a video that will go through both the prerequisite installations and this guide.

Refer to the FB Messenger platform itself for the detailed list of events, actions and options available in this platform to help you build Messenger chatbots.

NB! This guide may be outdated after the 16th of December, because of updates to the Facebook Messenger API which are not under our control.

Prerequisites

In order to set up your own Facebook Messenger bot, you first must have installed and built Xatkit.

In order to set the bot up locally, we will use ngrok.

Facebook for Developers

To setup the bot on your own Facebook page, you must first make a Developer account using your Facebook account and create an application.

  1. Go to the Facebook for Developers page and login with your Facebook account.

  2. Click on “My apps” and choose “Create App”. A popup should appear with 3 choices.

  3. Choose the first one (“Manage Business Integrations”) and fill out the needed information. Press the “Create app ID”.

  4. This should redirect you to a page with plenty of “products” to add to your application. Press “set up” on both the “Messenger” and “Webhooks” products.

  5. Go to the Messenger product settings and create a new page for your bot in the “Access tokens” block. After this, press the “Add or Remove Pages” button and add your newly created page. When the whole process is over this is the page on which you will send and receive messages to the bot.

Facebook Messenger platform and basic bot

After having setup your Facebook account and page,you will have to install and build the Xatkit Facebook Messenger platform.

  1. Clone and install the Messenger platform using the following commands.
git clone -b develop https://github.com/xatkit-bot-platform/xatkit-facebook-messenger-platform.git
cd xatkit-facebook-messenger-platform
mvn clean install -DskipTests
  1. Clone the FB bot example and navigate to the resources directory

  2. Once there, using your preferred text editor, create a file called “bot-private.properties” and copy the following text into it:

VERIFY_TOKEN_KEY=
ACCESS_TOKEN_KEY=
APP_SECRET_KEY=

For the verify token key, you need to enter any random string. You will need to give this string to Facebook later.

The access token key can be found by going to your Developer account, opening your Facebook application and moving to the “Messenger” product settings. In the “Access Tokens” block, next to your page should be a button called “Generate Token”. Copy that token and paste it next to the ACCESS_TOKEN_KEY (Without adding any quotation marks, just pasting the code given by facebook). image3

You can find the app secret key by going to your developer accounts basic settings and press “show” in the app secret field and copying-pasting as you did with the access token key. image1

  1. (Optional) If you want to send files, they will also be uploaded from this directory. By default, the FileManager will attempt to read a file called pic.jpg.

  2. Start the bot by running the following commands (from the directory /xatkit-messenger-bot-examples/MessengerBotBasic):

mvn clean compile
mvn exec:java -Dexec.mainClass="com.xatkit.example.MessengerBotBasic"

The bot should now have started.

  1. Open up ngrok and enter the following command:
ngrok http 5000
  1. Copy the second “Forwarding” url (the one which starts with https). Go back to your Facebook applications “Messenger” products settings and navigate to the “Webhooks” block. Press the “edit callback url” button and enter the ngrok url and add “/messenger/webhook” to the end of the url. For the verify token add the string from your bot-private.properties verify_token_key value. After this you have to Edit the webhook fields and add the following: “messages, message_deliveries, messaging_postbacks, message_reads and message_reactions”.

The “Webhooks” block should look something like this: image2

  1. In order to send the bot messages and have it respond, you have to open your bots page and go to the "about" section. Press "send message" and the messaging box should popup. Now you should press on the page's/bot's name and click "Open in messenger" (Sending messages in facebook itself may not work, but on messenger it should be working).

image3

The bot should now work! Here is an example of a few messages you can send it.

image4

A more advanced bidirectional example bot

Our platform can also handle bidirectionality between different platforms, as for instance, replying to FB messenger bots from Slack.

Clone this wiki locally