在Microsoft Bot Framework v4中处理自适应卡-Node.js [英] Handling Adaptive cards in Microsoft Bot Framework v4 - Nodejs

问题描述

  return new Promise((resolve, reject) => {
                            x = context.sendActivity({
                            text: 'hi',
                             attachments: [CardFactory.adaptiveCard(menuJson)]
                            })

我正在尝试发送自适应卡，其中包含一个Input.text字段...现在我的问题是如何使用上下文对象从程序中的用户获取输入数据?

I am trying to send an adaptive card, which contains a Input.text field in it...Now my question is how to get the input data from the user in my program using a context object ?

即如何使用节点js处理bot框架v4中的自适应卡?

推荐答案

自适应卡的提交结果与常规用户文本略有不同.当用户键入聊天并发送普通消息时，它最终以context.activity.text结尾.当用户填写自适应卡上的输入时，它会以context.activity.value结尾，这是一个对象，其中键名是menuJson中的id，值是自适应卡中的字段值.

Adaptive Cards send their Submit results a little different than regular user text. When a user types in the chat and sends a normal message, it ends up in context.activity.text. When a user fills out an input on an Adaptive Card, it ends up in context.activity.value, which is an object where the key names are the id in your menuJson and the values are the field values in the adaptive card.

例如json:

{
    "type": "AdaptiveCard",
    "body": [
        {
            "type": "TextBlock",
            "text": "Test Adaptive Card"
        },
        {
            "type": "ColumnSet",
            "columns": [
                {
                    "type": "Column",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "Text:"
                        }
                    ],
                    "width": 20
                },
                {
                    "type": "Column",
                    "items": [
                        {
                            "type": "Input.Text",
                            "id": "userText",
                            "placeholder": "Enter Some Text"
                        }
                    ],
                    "width": 80
                }
            ]
        }
    ],
    "actions": [
        {
            "type": "Action.Submit",
            "title": "Submit"
        }
    ],
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.0"
}

..创建一张看起来像这样的卡片:

.. creates a card that looks like:

如果用户在文本框中输入"Testing Testing 123"，然后单击Submit，则context.activity将类似于:

If a user enters "Testing Testing 123" in the text box and hits Submit, context.activity will look something like:

{ type: 'message',
  value: { userText: 'Testing Testing 123' },
  from: { id: 'xxxxxxxx-05d4-478a-9daa-9b18c79bb66b', name: 'User' },
  locale: '',
  channelData: { postback: true },
  channelId: 'emulator',
  conversation: { id: 'xxxxxxxx-182b-11e9-be61-091ac0e3a4ac|livechat' },
  id: 'xxxxxxxx-182b-11e9-ad8e-63b45e3ebfa7',
  localTimestamp: 2019-01-14T18:39:21.000Z,
  recipient: { id: '1', name: 'Bot', role: 'bot' },
  timestamp: 2019-01-14T18:39:21.773Z,
  serviceUrl: 'http://localhost:58453' }

可以在context.activity.value.userText中看到用户提交的内容.

The user submission can be seen in context.activity.value.userText.

请注意，自适应卡的提交是作为postBack发送的，这意味着提交数据不会作为对话的一部分出现在聊天窗口中，而是保留在自适应卡上.

Note that adaptive card submissions are sent as a postBack, which means that the submission data doesn't appear in the chat window as part of the conversation--it stays on the Adaptive Card.

使用自适应卡和

Using Adaptive Cards with Waterfall Dialogs

您的问题并不完全与此相关，但是由于您可能最终尝试这样做，因此我认为将其包含在答案中可能很重要.

Your question doesn't quite relate to this, but since you may end up attempting this, I thought it might be important to include in my answer.

从本质上讲，自适应卡不能像提示一样工作.带有提示，提示将显示并等待用户输入，然后继续.但是对于自适应卡(即使它包含一个输入框和一个提交按钮)，自适应卡中也没有代码，这会使瀑布对话框在继续对话框之前先等待用户输入.

Natively, Adaptive Cards don't work like prompts. With a prompt, the prompt will display and wait for user input before continuing. But with Adaptive Cards (even if it contains an input box and a submit button), there is no code in an Adaptive Card that will cause a Waterfall Dialog to wait for user input before continuing the dialog.

因此，如果您使用的是接受用户输入的自适应卡，则通常要处理用户在瀑布对话框"上下文之外提交的所有内容.

So, if you're using an Adaptive Card that takes user input, you generally want to handle whatever the user submits outside of the context of a Waterfall Dialog.

话虽如此，如果您想在瀑布对话框中使用自适应卡，则有一种解决方法.基本上，您:

That being said, if you want to use an Adaptive Card as part of a Waterfall Dialog, there is a workaround. Basically, you:

1. 显示自适应卡
2. 显示文字提示
3. 将用户的自适应卡输入转换为文本提示输入

在瀑布对话框"文件中(步骤1和2):

In your Waterfall Dialog file (steps 1 and 2):

async displayCard(step) {
    // Display the Adaptive Card
    await step.context.sendActivity({
        text: 'Adaptive Card',
        attachments: [yourAdaptiveCard],
});
    // Display a Text Prompt
    return await step.prompt('textPrompt', 'waiting for user input...');
}

async handleResponse(step) {
    // Do something with step.result
    // Adaptive Card submissions are objects, so you likely need to JSON.parse(step.result)
    ...
    return await step.next();

在您的bot.ts文件中(第3步):

In your bot.ts file (step 3):

const activity = dc.context.activity;

if (!activity.text && activity.value) {
    activity.text = JSON.stringify(activity.value);
}

这篇关于在Microsoft Bot Framework v4中处理自适应卡-Node.js的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！