如何在使用瀑布对话框(Node JS)时使用Microsoft Bot框架将英雄卡发送到FB Messenger

时间:2020-03-05 10:35:41

标签: node.js botframework facebook-messenger

我正在尝试使用Microsoft机器人框架创建一个Messenger机器人

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

在此过程中,我有多个步骤,在特定步骤中,我需要发送一个带有四个英雄卡的轮播,每个卡有按钮。

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

在bot模拟器和网络聊天中进行测试时,我可以正常工作 但是在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 }; 
    }

1 个答案:

答案 0 :(得分:1)

您的问题是由您作为英雄卡标题包含的空格引起的:" "。解决您的问题很简单。您可以使用不带空格("")的实际上为空的字符串,甚至可以完全省略标题。

编辑:如您所见,如果您未提供Bot Framework的名称,则Bot Framework将添加“选项”作为卡的标题,因为它使用了需要标题的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活动的频道数据发送媒体模板: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之类的替代设计。