Rich Messages for Dialogflow JSON V2

Question

Google has the documentation on rich messages (https://developers.google.com/actions/assistant/responses) but I am using JSON request and response direct from DialogFlow and in the dialogFlow documentation no format for displaying rich messages is given to the user except one of a Basic Card in sample response on this link(https://dialogflow.com/docs/fulfillment#response) with the key as 'fulfillmentMessages' in which card is defined.

Every resource online has given the code to display the rich messages if using Actions SDK but not for Dialogflow JSON.

Can anyone give the code snippet of each rich response(Card,List,Table,Carousel etc.) that I can send in fulfillmentMessages.

Thanks!

Answer 1

As documented, most of the Actions SDK response is embedded inside the Dialogflow response under the payload.google object, although there are some twists to doing so.

In particular, for sending back rich messages, it requires a richResponse field which contains a RichResponse object. This is the same RichResponse object described by the Actions SDK and contains an items property which is the array of different responses.

The documentation for the JSON protocol used contains more information and there are a number of examples of JSON replies using Dialogflow v2.

Answer 2

You can do this easily now with the Dialogflow Messenger integration (Beta feature). No need for third party paid apps such as Kommunicate. Check out the documentation here.

Answer 3

Instead of creating your own code to generate every rich response, the simple way to use a third party Chat UI tool Kommunicate as it proves ready-made rich message services such as (suggested replies, link button, card carousel, images, etc) using dialogflow fulfilment.

There are multiple ways to set the rich response button from Dialogflow:

1. Dialogflow offers an easy way to use the interface itself to provide rich messages using custom payloads.

2. Another way is to add rich messages using fulfilment code by enabling the webhook call for the intent and adding pre-built Kommunicate code to the inline editor. Please check the link for step by step instructions