如何將自定義負載從 React bf DIRECT_LINE/CONNECT_FULFILLED 發送到 onMembersAdded 事件

Question

我一直在使用 React 網絡聊天與 botframework 進行交互。我需要向 onMembersAdded 事件發送一些自定義負載。

參考鏈接

下面是我的代碼

if (action.type === 'DIRECT_LINE/CONNECT_FULFILLED') {
  dispatch({
    type: 'WEB_CHAT/SEND_EVENT',
    payload: {
      name: 'webchat/join',
      value: {
        language: window.navigator.language,
        key: "customdata",  // custom value
      }
    }
  });
}

我的應用服務邏輯

this.onMembersAdded(async (context, next) => {
    console.log('Running onMembersAdded Activity.');
    console.log(`Processing onMembersAdded Activity :: ${JSON.stringify(context.activity)}`);
    
    await context.sendActivity('Welcome to the QnA Maker sample! Ask me a question and I will try to answer it.');

    // By calling next() you ensure that the next BotHandler is run.
    await next();
});

日志響應

{
  "type": "conversationUpdate",
  "id": "Il5FyDXlgNn",
  "timestamp": "2022-03-23T12:36:21.930Z",
  "serviceUrl": "https://webchat.botframework.com/",
  "channelId": "webchat",
  "from": {
    "id": "9sdfs15-0b2a-43b1-9c7e-7d29ffa79f23"
  },
  "conversation": {
    "id": "KywsdfkRLNGDCxjBNQQsVn-in"
  },
  "recipient": {
    "id": "xxx_xxx@B6i2sd3Yvs4",
    "name": "xxx_xxx"
  },
  "membersAdded": [
    {
      "id": "xxx_xxx@B6i2sd3Yvs4",
      "name": "xxx_xxx"
    },
    {
      "id": "9sdfs15-0b2a-43b1-9c7e-7d29ffa79f23"
    }
  ],
  "locale": "en-US",
  "rawTimestamp": "2022-03-23T12:36:21.9302875Z",
  "callerId": "urn:botframework:azure"
}

無法在日志響應中看到我的自定義負載。

我可以使用 onEvent 事件並檢查 (context.activity.name)，但我很想知道它是如何處理 onMembersAdded 事件的。

Answer 1

由於 React JS 版本，可能會出現此問題。 由於使用 React V17.0.2 處理 Webchat 時存在一些故障，並且經常中斷操作。 嘗試將 React 版本降級到 v16.8.6。

https://github.com/microsoft/BotFramework-WebChat/issues/4205

Answer 2

這個問題根本與 React 版本甚至 React 無關。

相反，這是一種競爭條件。 ConversationUpdate活動在您的 Web 聊天客戶端中的 DirectLine object 與 Azure 機器人服務建立連接時發生。 然后，連接器向機器人發出ConversationUpdate活動，本質上說，'嘿，我在這里看到一些活動。 這個“會員”剛剛加入。 此活動是自動的，不受機器人或客戶端（即 Web 聊天）的影響。

問題在於：當您在DIRECT_LINE/CONNECT_FULFILLED期間發送事件、消息等時，它可能會與同時發生的ConversationUpdate發生沖突。 結果是ConversationUpdate獲勝，而 Web Chat 活動“丟失”。

不要害怕......有兩種可能的方法來克服這個問題。

第一，將 Web 聊天調度操作包裝在setTimeout()中，延遲 100-200 毫秒。

第二，在DIRECT_LINE/CONNECT而不是DIRECT_LINE/CONNECT_FULFILLED上發送操作。

在我的測試中，這些選項中的任何一個都可以解決問題，並且應該也能為您解決問題。

希望有所幫助！