如何在 Dialogflow 中创建 Facebook 轮播 "Custom Payload"

Question

我想在不使用 webhook 的情况下使用 Dialogflow 创建一个 Mockup Facebook Bot。

可以在 Dialogflow 中定义特定于渠道的答案。您可以在其中选择预定义的响应类型或自定义负载。一个简单按钮的自定义负载有效，但是当我尝试创建轮播时没有任何反应。

https://developers.facebook.com/docs/messenger-platform/send-messages/template/generic#carousel

我在哪里可以找到 Dialogflow 支持和不支持的内容？如何使用自定义负载构建轮播卡片？

{
  "facebook": {
    "attachment": {
      "type": "template",
      "payload": {
        "template_type": "generic",
        "elements": [
          {
            "title": "Welcome!",
            "image_url": "https://upload.wikimedia.org/wikipedia/commons/7/70/Example.png",
            "subtitle": "We have the right hat for everyone.",
            "default_action": {
              "type": "web_url",
              "url": "https://commons.wikimedia.org/wiki/File:Example.png",
              "messenger_extensions": false,
              "webview_height_ratio": "tall",
              "fallback_url": "https://website.com/"
            },
            "buttons": [
              {
                "type": "web_url",
                "url": "https://commons.wikimedia.org/wiki/File:Example.png",
                "title": "View Website"
              },
              {
                "type": "postback",
                "title": "Start Chatting",
                "payload": "DEVELOPER_DEFINED_PAYLOAD"
              }
            ]
          }
        ]
      }
    }
  }
}

Answer 1

如果您从 JSON 中删除 messenger_extensions 和 fallback_url 它应该可以正常工作.

通过在 dialogflow 中使用自定义负载，只要您发送正确的相应通道，一切都得到支持 json

这是一个轮播（多个元素）的工作测试示例

{
 "facebook":{
  "attachment":{
     "type":"template",
     "payload":{
        "template_type":"generic",
        "elements":[
           {
              "title":"Welcome!",
              "image_url":"https://upload.wikimedia.org/wikipedia/commons/7/70/Example.png",
              "subtitle":"We have the right hat for everyone.",
              "default_action":{
                 "type":"web_url",
                 "url":"https://www.google.com/",
                 "webview_height_ratio":"tall"
              },
              "buttons":[
                 {
                    "type":"web_url",
                    "url":"https://www.google.com/",
                    "title":"View Website"
                 },
                 {
                    "type":"postback",
                    "title":"Start Chatting",
                    "payload":"DEVELOPER_DEFINED_PAYLOAD"
                 }
              ]
           },
               {
              "title":"Welcome!",
              "image_url":"https://upload.wikimedia.org/wikipedia/commons/7/70/Example.png",
              "subtitle":"We have the right hat for everyone.",
              "default_action":{
                 "type":"web_url",
                 "url":"https://www.google.com/",
                 "webview_height_ratio":"tall"
              },
              "buttons":[
                 {
                    "type":"web_url",
                    "url":"https://www.google.com/",
                    "title":"View Website"
                 },
                 {
                    "type":"postback",
                    "title":"Start Chatting",
                    "payload":"DEVELOPER_DEFINED_PAYLOAD"
                 }
              ]
           },
               {
              "title":"Welcome!",
              "image_url":"https://upload.wikimedia.org/wikipedia/commons/7/70/Example.png",
              "subtitle":"We have the right hat for everyone.",
              "default_action":{
                 "type":"web_url",
                 "url":"https://www.google.com/",
                 "webview_height_ratio":"tall"
              },
              "buttons":[
                 {
                    "type":"web_url",
                    "url":"https://www.google.com/",
                    "title":"View Website"
                 },
                 {
                    "type":"postback",
                    "title":"Start Chatting",
                    "payload":"DEVELOPER_DEFINED_PAYLOAD"
                 }
              ]
           }
        ]
     }
  }
 }
 }