Using the Meta Messenger Integration, you can create a Meta Messenger bot to interact with your users.
How it works
This is how the integration works:
- You create a Meta app that uses the Meta Messenger Platform.
- You configure the Dialogflow CX Integration and Meta app so that they communicate with each other.
- The Dialogflow CX Integration sends messages to your users using the Meta Messenger API.
- The Dialogflow CX Integration receives messages from your users by acting as the Meta Webhooks for Messenger Platform.
Setup
Make sure billing is enabled on your project before testing the integration.
To set up the integration:
- Follow the steps to create a Meta app: Meta App Development.
- Set up the Meta app to use the Meta Messenger Platform. Follow the steps in
the
Meta Webhooks for Messenger Platform
documentation to accomplish the following:
- Add the Messenger Platform to your Meta app.
- Subscribe your app to a Meta page. Make sure
messagesandmessaging_postbacksare enabled in the page subscription. - Copy the access token provided at this step. This token is used to configure the integration from the Dialogflow CX console.
- Don't configure the webhook or test your integration yet.
- Configure the integration from the Dialogflow CX console:
- Go to the Dialogflow CX console.
- Select the Manage tab on the navigation menu.
- Select Integrations.
- Click the Connect button on the Meta Messenger tile.
- Complete the configuration dialog fields:
- App secret: Enter the app secret from App Dashboard Basic Settings.
- Verify token: Enter any private token you need. Copy this value. This is used to configure the Meta Messenger Webhook.
- Page access token: Enter the access token you copied during the Meta app setup.
- Enable get started button: Select this checkbox to enable the Get started button.
- Webhook URL: Copy this value. This is used to configure the Meta Messenger Webhook.
- Start: Select this checkbox to start the integration service for your agent.
- Finish setup of the Meta app and test it. Follow the steps in the
Meta Webhooks for Messenger Platform
documentation to accomplish the following:
- Configure the Meta webhook for your app. Use the Webhook URL and
Verify token values you copied earlier. Be sure to enable
messagesandmessaging_postbacksin the page subscription. - Test your app.
- Configure the Meta webhook for your app. Use the Webhook URL and
Verify token values you copied earlier. Be sure to enable
Events
The following events are invoked by this integration. You can create custom event handlers to define what to do when the events are triggered.
| Event | Description |
|---|---|
FACEBOOK_WELCOME |
Triggered when an end-user clicks the Meta Messenger Get Started Button. |
FACEBOOK_MEDIA |
Triggered when the message from an end-user contains attachments (for example, audio, image, or video). |
Get started button
Set up the Meta Messenger get started button:
Toggle Enable Get Started Button when enabling this integration service.
This integration service lets you enable the button by calling the Messenger Profile API.
curl -X POST \ -H "Content-Type: application/json" \ -d '{"get_started": {"payload": "FACEBOOK_WELCOME"}}' \ "https://graph.facebook.com/v10.0/me/messenger_profile?access_token=${PAGE_ACCESS_TOKEN}"
Create a custom event handler for the
FACEBOOK_WELCOMEevent.
To test it:
- Delete the previous conversation with your Meta page if applicable.
- The Get Started button only shows up on new conversations.
- Start a new conversation with your Meta page.
- Click the Get Started button, and verify the response from the custom event handler.
You can call Messenger Profile API to manage the Get Started button. This can help with testing.
To check the status of the Get Started button, use the following request:
curl -X GET \
"https://graph.facebook.com/v10.0/me/messenger_profile?fields=get_started&access_token=${PAGE_ACCESS_TOKEN}"
You can use the following request to disable the Get Started button:
curl -X DELETE \
-H "Content-Type: application/json" \
-d '{"fields": ["get_started"]}' \
"https://graph.facebook.com/v10.0/me/messenger_profile?access_token=${PAGE_ACCESS_TOKEN}"
Rich response messages
Rich response messages are supported using Custom Payload in Fulfillment. For more information, see the Send API Parameters Message Object documentation for the message format.
For example, the following custom payload provides a text message:
{
"text": "Hello, world"
}
The following custom payload provides an image message:
{
"attachment": {
"type": "image",
"payload": {
"url": "https://example.com/test.jpg"
}
}
}
Channel-specific responses
After you configure the
channel-specific responses,
the agent automatically uses the DF_CX_FB_MESSENGER channel to respond to
Meta Messenger messages.