Creating your first Messenger Bot from Zero will be as easy as 1, 2, 3... 10 Minutes
- Bootstrap your local development environment
- Config your Facebook App for Messenger Account
- Start handling conversation with peoples
You can use the editor on GitHub to maintain and preview the content for your website in Markdown files.
Using HTTPS is required to communicate with Facebook Messenger, and the easiest way to get it on development mode is to use NGROK
You can follow the instruction to download and install NGROK.
1 - Download the ThunderBot boilerplate
git clone https://github.com/jamaity-tn/ThunderBot-Boilerplate
2 - Run the local server:
php -S localhost:1337
3 - Deploy the https tunnel
ngrok http 1337
You are up !
You can now use the ngrok url as Facebook Messenger webhook. Beware that the ngrok url is changing each time you execute ngrok command, so make sure to update the webhook url.
In this section, we will simply follow the Facebook Messenger Plateform quick start accessible following this link.
Go ahead and Create a Facebook Fan page, you can also use an existing page you admin.
Make sure that "Messenger" producted is on under "Product Settings".
Webhooks are used to send you a variety of different events including messages, authentication events and callback events from messages.
In the Messenger Platform tab, find the Webhooks section and click Setup Webhooks. Enter a URL for a webhook, define a Verify Token and select message_deliveries, messages, messaging_optins, and messaging_postbacks under Subscription Fields.
Add your webhook URL (**Ngrok generated secure url https://RANDOM.ngrok.com/ **/), add code for verification. Your code should expect the Verify Token you previously defined, and respond with the challenge sent back in the verification request. Click the "Verify and Save" button in the New Page Subscription to call your webhook with a GET request.
Since the Webhook only accepts HTTPS urls, we recommand to install NGROK locally in order to test your bot under development mode (Go to Step 1/A to know how)
You can find all the details related to the Webhook by following this link.
A Page Access Token is based on an app, page and user and has scopes associated with it. In the developer app, go to the Messenger tab. Select your page and generate a token:This will generate a non-expiring Page Access Token with the manage_pages, pages_messaging, and pages_messaging_phone_number scopes. Save this token as it will be used throughout your integration. You must be an admin on the page in order to generate a valid page access token.
In order for your webhook to receive events for a specific page, you must subscribe your app to the page. You can do this in the Webhooks section under the Messenger Tab.
Or you can do this via API by using your Page Access Token and making a POST request to /me/subscribed_apps
You can use tools like Postman to get easily this done.
curl -X POST "https://graph.facebook.com/v2.8/me/subscribed_apps?access_token=**PAGE_ACCESS_TOKEN**"
If successful, you will receive a response:
{
"success": true
}
To test you're receiving updates via the Webhook, simply send a message to your page. You can do that from your page on facebook.com, the Facebook mobile app, searching your page on Messenger, or using your Messenger short url https://m.me/PAGE_USERNAME.
If you don't receive an update via your Webhook, please ensure you didn't receive any errors when you setup your Webhook and you subscribed your App to your page.
In order to inspect requests that are received and sent to Facebook Messenger, you can access: http://localhost:4040/ after running the Ngrok command.
You should now see the first replies of your bot to messages like: "hello", "me"...
The main development process will be concentrated on the index.php file which always do the same 3 main steps: 1 - Verify the integrity and security of the data received 2 - Get the message / payload 3 - Return the appropriate result (SWITCH blocks) according to preformatted templates made by Facebook Messenger
You can find almost all of those templates implemented with samples.