Question

我已经创建了一个post back dialog，但是尝试在v＃4的Microsoft bot框架中调用回发对话框时尝试发布一些参数，却无法正常工作。

我已编写此代码以从英雄卡中调用回发对话框。在这里，我可以回叫该帖子，但无法将值（参数）发送到回发对话框。

var card1 = CardFactory.heroCard(
                    Name,
                    Address1+", "City",
                    CardFactory.images([Image]),
                    CardFactory.actions([
                        {
                            type: 'postBack',
                            title: Service,
                            value: PostBack_DIALOG,
                            text: 'arguments for postback dialog'
                        },
                        {
                            type: 'call',
                            title: phone ,
                            value: "tel:" + phoneNumber
                        }
                    ])

请建议如何发送参数以在bot框架v＃4中发送回发对话框

Answer 1

您可以通过发送自变量来实现此目的，而不是作为卡片的一部分，而是在英雄卡片已呈现并且用户选择了按钮之后，作为连续sendActivities步骤的一部分来发送。

在下面的代码示例中，我有两个步骤。一种用于渲染卡，另一种用于在用户与卡交互后发送数据。在称为postBackCardStep的第一步中，我从用户选择“蓝色”或“绿色”的建议操作中捕获了先前的值。然后，当按下该按钮时，该值就会在Service按钮中传递。

第二步，称为postBackPostStep，我捕获并在resultDetails中发送用户的选择。我还定义了一个名为postBackArg的属性，并发送一个属性vlaue以便在客户端进行验证。我在data活动中的sendActivities字典对象中发送此消息。这样一来，我既可以发送消息，也可以发送数据。

async postBackCardStep ( stepContext ) {
  const PostBack_DIALOG = stepContext.context.activity.text;

  const reply = { type: ActivityTypes.Message };

  const postBackBtn = { type: ActionTypes.PostBack, title: 'Service', value: PostBack_DIALOG }
  const callBtn = { type: ActionTypes.Call, title: 'Phone', value: '123-456-7890' }

  const card = CardFactory.heroCard(
    '<Name>',
    '<Address>',
    ['<link to some image>'],
    [
      postBackBtn,
      callBtn
    ]
  );

  reply.attachments = [ card ];

  await stepContext.context.sendActivity( reply );
  return { status: DialogTurnStatus.waiting };
}

async postBackPostStep ( stepContext ) {
  const resultDetails = stepContext.context.activity.text;

  const data = { value: resultDetails, postBackArg: 'true' };
  await stepContext.context.sendActivities( [
    { text: `Sending ${ resultDetails } via postBack`, type: 'message' },
    { name: 'data', type: 'event', channelData: { 'data': data } }
  ] );
  return await stepContext.next();
}

接下来，在html页面的网络聊天脚本中，我有以下代码。我创建了一个商店，创建并命名了一个事件，并将从机器人获取的数据传递到该事件中。然后，我创建一个事件侦听器，该事件侦听器通过检查接收到的数据是否为event类型和postBackArg值为'true'来验证数据（此值应从bot作为字符串传递并经过验证作为字符串）。如果两项检查均通过，则控制台消息将与这些值一起发布。然后将商店传递到renderWebChat。

const store = window.WebChat.createStore( {}, ( { dispatch } ) => next => action => {
  if ( action.type === 'DIRECT_LINE/INCOMING_ACTIVITY' ) {
    const event = new Event('incomingActivity');

    event.data = action.payload.activity;
    window.dispatchEvent(event);
  }

  return next( action );
} );

window.addEventListener('incomingActivity', ({ data }) => {
  const type = data.type;
  if (type === 'event' && data.channelData.data.postBackArg === 'true') {
    console.log('DATA ', data);
    const resultDetails = data.channelData.data.value;
    const args = data.channelData.data.postBackArg;
    console.log(`Received a message from the bot (${resultDetails}) with argument value ${args}.`);
  }
} );

window.WebChat.renderWebChat( {
  directLine: directLine,
  store
}, document.getElementById( 'webchat' ) );
document.querySelector( '#webchat > *' ).focus();

在这里，您可以看到数据已经成功地从漫游器传递到了页面，如incomingActivity事件侦听器中所指定，该页面仅在传递了正确的数据属性并成功验证后才发生。

除非我很误会，否则您现在应该可以上手！

希望有帮助！

如何发送参数以回发对话框

1 个答案: