Dialogflow messenger webhook response (richcontent)

[azarug]

I’ve set up a Dialogflow webhook with PHP that is working fine. Receives a query and responds correctly (message shown to the user). The problem that i have is i can’t figure out how to show a basic card style message (text with a link and a image) or any kind of richcontent. This only happens in Dialogflow messenger added to a webpage. This is the json i send:

{
   "source": "aaaaaaaa-aaaa-aaaa-aaaa-aaaaaaaa-aaaaaaaa",
   "fulfillmentMessages": [{"card":    {
      "title": "Title",
      "subtitle": "text sample",
      "imageUri": "www.domain.com/img.png",
      "buttons": [      {
         "text": "Read",
         "postback": "www.domain.com"
      }]
   }}]
}

[xavidop]

Hi,

the format is wrong, as per the docs, you need to do it in this way: https://cloud.google.com/dialogflow/cx/docs/concept/integration/dialogflow-messenger/fulfillment#info_response_type

{
  "richContent": [
    [
      {
        "type": "info",
        "title": "Info item title",
        "subtitle": "Info item subtitle",
        "image": {
          "rawUrl": "https://example.com/images/logo.png"
        },
        "anchor": {
          "href": "https://example.com"
        }
      }
    ]
  ]
}

[azarug]

Hi, thanks for the reply.

The problem im having is that the response from a webhook isnt showing in dialogflow messenger but when i try it from dialogflow UI, it shows correctly. This makes me think the JSON im sending is correct but somehow dialogflow messenger doesnt shiw this kind of response from a webhook.

** 1st image doesnt show the card but 2nd image shows it (same action in both).

payload response from webhook is:

{
“source”: “aaaaaaa-aaaa-aaaa-aaaa-aaaaaaaa-aaaaaa”,
“fulfillmentMessages”: [{“card”: {
“title”: “My Title”,
“subtitle”: “My subtitle”,
“imageUri”: “https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png”,
“buttons”: [ {
“text”: “Click my Link”,
“postback”: “https://www.google.com”
}]
}}]
}

[azarug]

Hi, the payload i send throught the webhook shows correctly in DF web UI “try it now” but doesnt show in DF messenger thats why i think its a issue with DF messenger not being able to show richcontent recieved from a webhook.

** 1st image doesnt show payload but in 2nd its shown. Same payload.

[xavidop]

the format is incorrect. it should be:

{
  "richContent": [
    [
      {
        "type": "info",
        "title": "Info item title",
        "subtitle": "Info item subtitle",
        "image": {
          "src": {
            "rawUrl": "https://example.com/images/logo.png"
          }
        },
        "actionLink": "https://example.com"
      }
    ]
  ]
}

[xavidop]

the format is incorrect. it should be:

{
  "richContent": [
    [
      {
        "type": "info",
        "title": "Info item title",
        "subtitle": "Info item subtitle",
        "image": {
          "src": {
            "rawUrl": "https://example.com/images/logo.png"
          }
        },
        "actionLink": "https://example.com"
      }
    ]
  ]
}

[azarug]

Hi,

Your sugested way works as expected in a “Custom Payload” from DF web UI, but doesnt work in a webhook response. Any sugestion?

[xavidop]

yeah, this is not a custom payload, this should be part of the payload.

A custom payload is when you are using different integrations like slack and you create a payload for them and manage them accordingly in your front.

custom paylod for the web integration will never work.

Best,

Xavi