Chatbot restarts conversation on minimizing

Question

I developed my chatbot using c# and bot framework sdk v4. I connected it to my webpage using react js by passing directline token. But now when i Minimize the chat and then maximize it the chat stops the flow and gets restarted. But the old messages are still there. I doesn't need to restart the flow when minimized. My reactjs implementation code is given below.

const store = createStore({}, () => next => action => {
         if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY') {
            if (action.payload.activity.from.role === 'bot') {
               this.setState(() => ({ newMessage: true }));
            }
         }

         return next(action);
      });
this.state = {
         minimized: true,
         newMessage: false,
         side: 'right',
         store,
         styleSet: createStyleSet({
            backgroundColor: 'Transparent'
         }),
         token: null
      };
   }

   async handleFetchToken() {
      if (!this.state.token) {
         const res = <ReactWebChat directLine={ this.directLine } />
         console.log(res)
         // const { token } = await res.json();

         // this.setState(() => ({ token }));
      }
   }

   handleMaximizeButtonClick() {
      this.setState(() => ({
         minimized: false,
         newMessage: false,
      }));
   }

   handleMinimizeButtonClick() {
      this.setState(() => ({
         minimized: true,
         newMessage: false
      }));
   }

inside render

render() {
      const {
         state: { minimized, newMessage, side, store, styleSet, token }
      } = this;

<WebChat
                     className="react-web-chat"
                     // onFetchToken={this.handleFetchToken}
                     store={store}
                     styleSet={styleSet}
                     token={"my_token_here"}
                  />

Please help me in resolving the issue. Thanks in advance.

I noticed you have `onFetchToken={this.handleFetchToken}` commented out. What happens if you don't comment this out and use it as-is? I suspect that this is the issue as the `WebChat.js` file relies on this function, at least to some degree. — Steven Kanberg, Feb 05 '20 at 18:06
I get CORS policy issue. So I commented all the fetch token statements — Basil, Feb 06 '20 at 05:45
Where do you obtain the token from? Wherever that is, that is where you need to update the CORS policy to include the URI for the page hosting your web chat. For instance, I run a server locally using restify to generate a token (by calling the `/directline/tokens/generate` API). I use "restify-cors-middleware" to manage CORS locally (more for testing, than anything). If I'm using ngrok to tunnel to ABS, then I update the whitelist found in the DirectLine Channel setting, under "Enhanced Authentication Option". — Steven Kanberg, Feb 08 '20 at 00:07
Resolve the CORS issue first so you are running the code as it is intended, then let's see if the issue persists. — Steven Kanberg, Feb 08 '20 at 00:09
Since i am new to this platform i didn't get the idea what you have said. Can you please clarify it. Or if possible can you put that as an answer. — Basil, Feb 10 '20 at 05:22
Thanks for your comment @Steven. It helped me to resolve the issue. — Basil, Mar 02 '20 at 11:01

score 1 · Accepted Answer · answered Mar 03 '20 at 18:32

Check out this solution I posted explaining how to make a basic local token server. Enabling CORS here only applies if you are running purely local. If you are tunneling via ngrok to Azure Bot Service, then you will need to make changes either on your bot's DirectLine Channel or on the App Service. View this image post for visual reference.

Chatbot restarts conversation on minimizing

1 Answers1