"Network interruption occurred. Reconnecting…"，当我最小化或最大化 chabot 时如何潜在地自动重新连接

Question

我们已经实现了 bot framework-webchat 来创建一个 bot。目前，我们使用组件中传递的事件（代码如下所示）来处理最小化和最大化，但是当我最小化然后最大化我看到的聊天机器人时会出现挑战 'Unable to connect' 消息然后它闪烁，如果一个小时后- 稍后如果我们最小化和最大化我得到 'Network interruption occurred, Reconnecting...' 当我最小化和最大化 Chabot 时如何保持网络聊天可能自动重新连接。

MaximizeChatWndow () {
  if (this.state.token === null &&
    this.state.productService === null) {
    return
  }

  this.setState({
    directLine: this.createDirectLine()
  }, () => {
    this.setState({
      minimized: false,
      newMessage: false,
      userId: 'User_' + Math.random
    })
  })
  this.checkExpandFlag = true
}

组件：

render () {
  const {
    state: { minimized, store }
  } = this 
  return (
    <Row>
     <Col md={12}>
       <div>
         {minimized ? (
           <ChatDon
             handleMaximizeButtonClick={this.handleMaximizeButtonClick}
           />
         ) : (
           <ChatWin
             handleMinimizeButtonClick={this.handleMinimizeButtonClick}
             directLine={this.state.directLine}
             userId={this.state.userId}
             store={store}
           />
         )}
       </div>
     </Col>
   </Row>
  )
}

Answer 1

您似乎在 "MaximizeChatWndow()" 中创建了 directLine 对象，我认为这是问题所在。在 "MaximizeChatWndow()" 中，您应该获取您的令牌并将其传递给您的网络聊天组件。在 Web 聊天组件中，您应该使用令牌来调用 createDirectLine()。

06.recomposing-us/a.minimizable-web-chat 示例似乎有各种更新。（这些文档看起来也已经过时并且不再与代码匹配）。但是，如果与可用的示例代码进行比较，您会想要执行如下操作。请查看上面的完整代码 link，因为我在这里只包括最相关的部分。

当我测试时，对话重置或网络没有问题 disconnecting/reconnecting。

MinimizableWebChat.js

import WebChat from './WebChat';

const MinimizableWebChat = () => {

  [...]

  const [token, setToken] = useState();

  const handleFetchToken = useCallback(async () => {
    if (!token) {
      const res = await fetch('http://localhost:3500/directline/token', { method: 'POST' });
      const { token } = await res.json();

      setToken(token);
    }
  }, [setToken, token]);

  [...]

  return (
    [...]
    <WebChat
      className="react-web-chat"
      onFetchToken={handleFetchToken}
      store={store}
      styleSet={styleSet}
      token={token}
    />
  )

WebChat.js

const WebChat = ({ className, onFetchToken, store, token }) => {
  const directLine = useMemo(() => createDirectLine({ token }), [token]);

  [...]

  useEffect(() => {
    onFetchToken();
  }, [onFetchToken]);

  return token ? (
    <ReactWebChat ...
  );
};

希望得到帮助！

"Network interruption occurred. Reconnecting…"，当我最小化或最大化 chabot 时如何潜在地自动重新连接

"Network interruption occurred. Reconnecting…" , How to potentially automatically reconnect when i minimize or maximize chabot

botframework