Simplified Architecture

Create a Facebook Page

Create a Facebook Messenger App

SCROLL DOWN…… SELECT EVERYTHING RELATING TO THE PAGE YOU CREATED

Webhook must be listening and ready when you click Verify and Save. It must echo back the challenge as text that FB sends to the webhook. Plus it also must send back 200 OK.

Get a Permanent Access Token

1. GET USER SHORT-LIVED ACCESS TOKEN

Go to the Graph API Explorer. https://developers.facebook.com/tools/explorer
Select the application you want to get the access token for (in the “Application” drop-down menu, not the “My Apps” menu).

Click “Get Token” > “Get User Access Token”.

In the pop-up, under the “Event, Groups, Permissions”, check “manage_pages”.
Click “Get Access Token”.

Grant access from a Facebook account that has access to manage the target page. Note that if this user loses access the final, never-expiring access token will likely stop working.

The token that appears in the “Access Token” field is your short-lived access token.

Copy your short lived access token for later use further down.

2 GENERATE LONG-LIVED ACCESS TOKEN

Get your App Secret:

Click Show in screenshot above and get AppSecret. Copy it.
Make a GET request to:

https://graph.facebook.com/v2.10/oauth/access_token?grant_type=fb_exchange_token&client_id={app_id}&client_secret={app_secret}&fb_exchange_token={short_lived_token}

Substitute your AppID into {app id}
Substitute your App Secret into {app secret}
Substitute your short lived token that you got into {short lived token}

Open the above URL in a browser. You should get a response as follows in the browser:
{“access_token”:”EAAFjQjTZBuFIBAJTCOEA4SZCZCGDdeTz3Os3nLPBJSzmcMrZBuFIBAJTCOEA4SZCZCGDdeTz3mFbl32l084Yvyf300SBFWSLRNyKISSQL9yuvZCWTk5zlt4ZC9J3FQgk3felVozlbSGqD4gYbpzNX40K9RvvkZD”,”token_type”:”bearer”}

This access token is your long lived access token.

3. GET USER ID

Using the long-lived access token, make a GET request to
https://graph.facebook.com/v2.10/me?access_token={long_lived_access_token}

You should get a response like:
{
“name”: “Janet Smith”,
“id”: “101561708617082312”
}

The id field is your account ID. You’ll need it for the next step.

Make a GET request to
https://graph.facebook.com/v2.10/{account_id}/accounts?access_token={long_lived_access_token}

{
“data”: [
{
“access_token”: “EAAFjQjTZBuFIBAGqst5SsUl5tCuBYX0UgjnC06Upv2hf3ELd3OWZBFuNjQbPn17Bi5ndcmzSkq9hox8ApUsJO9BhxHB3kgWp4GO1ZAAXEYsokdwVlhsJCkErO65nkfz5xkLMsYDHQQcz5xkLMsYpKEsOZCVs8rGAGTfXCADEgZDZD”,
“category”: “Local Service”,
“category_list”: [
{
“id”: “zzzzzzzzzzzz”,
“name”: “Local Service”
}
],
“name”: “LIPR2-Page”,
“id”: “xxxxxxxxxxxxxxx”,
“tasks”: [
“ANALYZE”,
“ADVERTISE”,
“MODERATE”,
“CREATE_CONTENT”,
“MANAGE”
] }
],
“paging”: {
“cursors”: {
“before”: “MjI5MTE1MTU3NzU4MDkwNAZDZD”,
“after”: “MjI5MTE1MTU3NzU4MDkwNAZDZD”
}
}
}

The App is now configured to pass Fcebook Messages to and from yourFacebook Bot.

FACEBOOK MESSENGER BOT SPECIFICS

INBOUND MESSAGE : Facebook user to Webhook
• The Webhook must have an SSL Cert and be configured for SSL comms.
• The message session always originates from the FB user.
• The bot (listener/worker) cannot originate messages. When the listener receives a message, it must immediately respond with a 200 OK.
• When FB User sends a message to the FB Page, the message is redirected to our listener. It contains a message ID and a sender ID

Example Message:
{“object”:”page”,”entry”:[{“id”:””:”“,”time”:1539868174883,”messaging”:[{“sender”:{“id”:”“},”recipient”:{“id”:”“},”timestamp”:1539868173509,”message”:{“mid”:”XGmMti8_cm3K0HqG_ND-inWmom3dPjDLnO1oj8h12yTl4f2BGIKSdB-lGYLvBz1bUeqxt7tcfv4JSiCNRFS3gg”,”seq”:10016,”text”:”“}}]}]}

• A Facebook user is given a unique PSID per page that they message with. So it is always possible to send a message back to that specific user using that PSID. This is asynchronous.

OUTBOUND MESSAGE FROM YOUR IMPLEMENTATION OF SEND API TO FACEBOOK
A simple example of an asynchronous message from the worker back to a User on the FB messenger platform is as follows:

curl -X POST -H “Content-Type: application/json” -d ‘{
“messaging_type”: ““,
“recipient”: {
“id”: “
},
“message”: {
“text”: “hello, world!”
}
}’ “https://graph.facebook.com/v2.6/ /messages?access_token=

FB responds synchronously with
{
“recipient_id”: “” “,
“message_id”: “m_AG5Hz2Uq7tuwNEhXfYYKj8mJEM_QPpz5jdCK48PnKAjSdjfipqxqMvK8ma6AC8fplwlqLP_5cgXIbu7I3rBN0P”
}

DEVELOPMENT OF BOT WITHOUT A PUBLIC FACING IP AND NO SSL CERT SUCH AS HOME LAPTOP
• Get an account at ngrok
• Use ngrok to forward the https request from Facebook to your Webhook as follows:

Run this command from the ngrok installation directory:
ngrok http -bind-tls=true 4025

Output will be
Session Status online
Account Your Name (Plan: Free)
Version 2.2.8
Region United States (us)
Web Interface http://127.0.0.1:4040
Forwarding https://826f5033.ngrok.io -> localhost:4025

Connections ttl opn rt1 rt5 p50 p90
582 0 0.00 0.00 1.44 10.45

4025 is the port your Webhook should listen on
https://826f5033.ngrok.io/ is the URL you should register for your webhook when setting up your FB Messenger App (see para Create Facebook Messenger App in this document)

You need to re-setup and re-register this webhook every time you restart ngrok as the URL changes for each sesson. You don’t need to worry about certificates then. Ngrok handles this and send the de-crypted http packets to the listener and passes the reply back.

https://developers.facebook.com/apps/2725xxxx3387119/webhooks/ <=== to edit webhook url (every time you restart ngrok). Click Edit Subscription. You must use the verify access token.

All tokens need recreation when restarting ngrok. The webhook requires re-verification when restarting ngrok

Pin It on Pinterest

Share This