node.js - 如何在使用 waterfall 对话框(Node js)的同时使用微软机器人框架将英雄卡片发送到 fb 信使

Question

我正在尝试使用 Microsoft bot 框架创建一个 Messenger bot

我正在使用 waterfall 对话框来创建结构的流程。

在这方面，我有多个步骤，在一个特定步骤中，我需要发送四张带有按钮的英雄卡片的轮播。

我使用了史蒂文的答案，
Handling HeroCards responses In Microsoft Bot Framework v4 for NodeJS

我在机器人模拟器和网络聊天中测试时工作正常
但是在 Messenger bot 中测试时会产生错误

谁能帮我纠正这个错误，提前致谢

   async locationStep(step) {
        // WaterfallStep always finishes with the end of the Waterfall or with another dialog; here it is a Prompt Dialog.
        // Running a prompt here means the next WaterfallStep will be run when the user's response is received.
        await this.sendIntroCard(step)
        await step.context.sendActivity("How often do you use surface on the move?")
        let acard =CardFactory.heroCard(
            " ",
            [`https://scontent.fmaa1-4.fna.fbcdn.net/v/t1.0-9/89121134_2372258766207358_5255590702309441536_n.jpg?_nc_cat=109&_nc_sid=8024bb&_nc_ohc=1cHak5WO_yoAX-VdtfO&_nc_ht=scontent.fmaa1-4.fna&oh=fd002544bc74bf53ae0185f4c192efe6&oe=5E82E09B`],
            [{  type: ActionTypes.PostBack,
                title: 'Never',
                value: 'Never'}]
       );
        let bcard =CardFactory.heroCard(
            " ",
            ['https://i.imgur.com/m2DWB7m.jpg'],
            [{  type: ActionTypes.PostBack,
                title: 'Once in a while',
                value: 'Once in a while'}]
        );
        let ccard =CardFactory.heroCard(
            " ",
            ['https://i.imgur.com/Kwn0FBn.jpg'],
            [{  type: ActionTypes.PostBack,
                title: 'A few days a week',
                value: 'A few days a week'}]
        );
        let dcard =CardFactory.heroCard(
            " ",
            ['https://i.imgur.com/mAlW0Bv.jpg'],
            [{  type: ActionTypes.PostBack,
                title: 'Every day',
                value: 'Every day'}]
        );
        await step.context.sendActivity( {attachments:[acard,bcard,ccard,dcard],attachmentLayout: AttachmentLayoutTypes.Carousel
       });
       return await { status: DialogTurnStatus.waiting }; 
    }

Answer 1

您的问题是由您在英雄卡片标题中包含的空格引起的:" " .解决您的问题很简单。您可以使用没有空格的实际空字符串( "" )，甚至可以完全省略标题。

编辑:如您所见，如果您没有提供选项卡，Bot 框架将添加“选项”作为卡的标题，因为它使用 Facebook Messenger 的 generic template这需要一个标题。 Bot Framework 无能为力，您也无法绕过 Facebook 的 API 限制。但是，如果您真的想发送带有图像和按钮的卡片，那么您可以使用 media template .这会很不方便，因为您需要事先上传图片附件，以便您可以使用此 API 获取附件 ID:https://developers.facebook.com/docs/messenger-platform/reference/attachment-upload-api

与其让您的机器人每次需要使用它们时都上传图像，您应该能够自己上传每个图像一次，然后将 ID 提供给您的机器人。上传附件后，您可以直接使用 Send API 发送媒体模板。或根据以下说明使用 Bot Framework 事件的 channel 数据:https://blog.botframework.com/2017/03/28/custom-channel-data/

await step.context.sendActivity( {
    "channelData": {
        "attachment": {
            "type": "template",
            "payload": {
                "template_type": "media",
                "elements": [
                    {
                        "media_type": "image",
                        "attachment_id": "<YOUR_ATTACHMENT_ID>",
                        "buttons": [
                            {
                                "type": "postback",
                                "payload": "Never",
                                "title": "Never"
                            }
                        ]
                    },
                    // More media templates ...
                ]
            }
        }
    }
} );

由于这可能比您想要的更复杂，您可以考虑使用替代设计，例如 Messenger 的 quick replies .