javascript - 聊天准备好后回调(Callback once chat is ready)

Question

I am building a ChatBot service using the Microsoft Bot Framework, over Azure as the service, and QnA Maker for the key-value-pairs.(我正在使用Microsoft Bot框架，Azure作为服务以及QnA Maker用于键-值对来构建ChatBot服务。)

In our implementation, we are having everything completely hosted in the cloud using Azure, and therefore, we do NOT have access to any code-behind for the framework.(在我们的实施中，我们使用Azure将所有内容完全托管在云中，因此，我们无权访问该框架的任何代码。)

It is all done in JS via the webpage.(这都是通过JS在网页上完成的。) No "cards" or special "interfaces" that we can push through from the back-end.(没有可以从后端推送的“卡”或特殊的“接口”。) As such, I have had to implement a bit of a "hack" in that, I have implemented my own JS functionality, which, when the page loads, sends out a message on behalf of the user in order to trigger a QnA Maker response.(因此，我必须实现一点“ hack”，因为我实现了我自己的JS功能，该功能在页面加载时代表用户发送消息以触发QnA Maker响应。)

The issue I am having is that even though the DOM may be ready, the ChatBot implementation and back-end service, may not!(我遇到的问题是，即使DOM准备就绪，但ChatBot实现和后端服务可能还没有！)

It may still be in a "connecting..." or loading state and therefore, when my JS tries to send out the message, it simply does not fire, because the button to send the message is disabled until the service is ready .(它可能仍处于“正在连接...”或正在加载状态，因此，当我的JS尝试发送消息时，它根本不会触发， 因为在服务就绪之前，发送消息的按钮被禁用了 。) This part is all controlled by the bot framework.(这部分全部由bot框架控制。) Therefore, on some instantiations (usually on the first ones for the day or the first one after a while without it being used), the message "Hi! I have a question..." remains in the "User chat bar" and never fires.(因此，在某些实例化（通常是当天的第一个实例或一段时间后的第一个实例，而没有使用它）上，消息“嗨！我有一个问题...”保留在“用户聊天栏”中，并且永远不会火灾。)

Here is my question: Is there a way for me to have the bot framework perform a Callback once it is ready to receive input?(这是我的问题：一旦准备好接收输入，我是否可以让bot框架执行Callback？)

If so, where would I place that callback in the JS implementation?(如果是这样，我应该将该回调放在JS实现中的什么位置？) Or alternatively, how could I "wait until the button is enabled" before firing off the send event? ( 或者，如何在触发发送事件之前“等到按钮启用”？ )

Let me know if this is not clear or if you need more information.(让我知道是否不清楚或是否需要更多信息。)

UPDATE(更新)

Upon verification, the button is NOT even disabled while the chatbot is connecting to the service, so even that option is not available.(经过验证，当聊天机器人连接到服务时，甚至不会禁用该按钮，因此该选项也不可用。)

A callback seems the only possible way of achieving this?(回调似乎是实现此目标的唯一可能方法？)

UPDATE --> SOLUTION!(更新->解决方案！)

In case anyone is wondering how to do this, here is a working example that shows you exactly how.(如果有人想知道如何执行此操作，以下是一个有效的示例，向您确切演示了如何操作。) This was amalgamated from different GitHub instructions pages for the BotFramework, which Steven Kanberg provided in the comments below.(这是从BotFramework的不同GitHub指令页面合并而成的，Steven Kanberg在下面的评论中提供了该页面。) Thanks!(谢谢！)

//This is how you build your store, and load the web chat... StyleOptions is a constant that is up to you to create.

const token = 'ENTER YOUR SECRET HERE';

const store = window.WebChat.createStore({}, ({ dispatch }) => next => action => {
     if (action.type === 'DIRECT_LINE/CONNECT_FULFILLED') {
          const event = new Event('webchatreadyactivity');
          event.data = action.payload.activity;
          window.dispatchEvent(event);

          // When we receive DIRECT_LINE/CONNECT_FULFILLED action, we will send an event activity using WEB_CHAT/SEND_EVENT
          dispatch({
               type: 'WEB_CHAT/SEND_EVENT',
               payload: {
                    name: 'webchat/join',
                    value: { language: window.navigator.language }
               }
          });
     }
     return next(action);
});

window.WebChat.renderWebChat({
     directLine: window.WebChat.createDirectLine({ token }),
     store,
     styleOptions
}, document.getElementById("ENTER CHAT ELEMENT ID HERE"));

//THEN, simply hook onto the event like this, to send your initial message...
//This event will fire only ONCE, and only once the chat is READY.
window.addEventListener('webchatreadyactivity', ({ data }) => {
//this is yours to build as well...
sendWelcomeMessage(); 
});

  ask by MaxOvrdrv translate from so

Answer 1

The BotFramework-WebChat repo has a variety of samples showing different functionalities.(BotFramework-WebChat存储库具有显示不同功能的各种示例。)

For instance, this sample shows how to trigger events only after the bot has connected.(例如， 此示例显示仅在僵尸程序连接后如何触发事件。) In this way, via styleOptions , you may be able to initially turn off the sendBox until the bot has connected.(通过这种方式，您可以通过styleOptions最初关闭sendBox直到机器人连接为止。)

Hope of help!(希望有帮助！)