如何在反应网络聊天中区分 bot id 和用户 id UI

Question

我正在尝试使用 Microsoft Bot 的纯网络聊天 UI 自定义我的 Bot。 Sample Link
我是 Reach 和 Web Chat 的新手。我想知道我们如何区分对话。无论是来自机器人还是来自用户。因为两者都返回相同的 activity.id。

我添加了这段代码进行测试。
content={activity.text + ' Testing ' + activity.id}

这是完整的代码片段

{activities
          // Currently, this sample only displays an activity of type "message"
          .filter(({ type }) => type === 'message')
          // We need to hide "postBack" message sent by the user
          .filter(({ channelData: { postBack } = {}, from: { role } }) => !(role === 'user' && postBack))
          // Normalize the activity:
          // - Every activity should have an "attachments" array, consisting of zero or more attachments:
          // - If this is a "messageBack" message, we should use the "displayText",
          //   because "text" is being submitted to bot, and "displayText" is what we use to override what the bot displays to the user.
          .map(activity => ({
            ...activity,
            attachments: activity.attachments || [],
            text: getValueOrUndefined(activity, 'channelData', 'messageBack', 'displayText') || activity.text
          }))
          // Filter out all empty messages (no attachments or text)
          .filter(({ attachments, text }) => attachments.length || text)
          .map((activity, index) => (
            <React.Fragment key={activity.id || index}>
              <li className="Sender">
                {!!activity.text && (
                  // We are using the very same component for text message and attachments.
                  // This is because, attachments can also have "text/markdown" or "text/plain" content.
                  // In this case, we prefer to have a single component for both of them.
                  <Attachment
                    content={activity.text + ' Testing ' + activity.id}
                    contentType={activity.textFormat === 'markdown' ? 'text/markdown' : 'text/plain'}
                  />
                )}
                {!!activity.attachments.length && (
                  <ul>
                    {activity.attachments.map((attachment, index) => (
                      <li key={index} className="Send">
                        <Attachment {...attachment} />
                      </li>
                    ))}
                  </ul>
                )}
              </li>
            </React.Fragment>
          ))}

请告诉我如何解决这个问题。

Answer 1

从用户发送的任何 activity 都将具有 from => role 属性，其值为 user。如果不是来自用户，则 role 值将被删除，from => name 值包含您的机器人名称。

请记住，这些值中的任何一个 都可能 被覆盖，具体取决于您使用的渠道（即 FB、Slack、网络聊天等）。通常情况并非如此，因为大多数元数据都附加到 channelData 属性，但需要注意一些事项。

作为参考，您可以查看 activity here 的所有可能属性，因为它们与 BotFramework 有关。

希望得到帮助

如何在反应网络聊天中区分 bot id 和用户 id UI

How to differentiate bot id and user id in react web chat plain UI

reactjs

botframework

web-chat