How can I update channelData for conversationUpdate Event being triggered from WebChat component?

Question

I am trying to connect to a bot Service using an Angular Client. I am able to connect to the Bot Service, but as soon as I post a message Activity, the WebChat client is sending a conversationUpdate event to the Bot, due to which I receive a Sign In Card from the Bot. (If I send userToken in channelData of firstMessage to Bot Service from client, i will not get the Sign In card).

I am trying to send a activity with userToken inside channelData, but the conversationUpdate event reaches Bot Service before my message activity and I receive a Sign In card.

I need to send custom channelData with the conversationUpdate event being sent from Client.

Using backchannel mechanism, i am able to send custom channelData for posting acctivities, but this conversationUpdate event is being triggered internally from websocket and I need to intercept this event trigger.

Following are the code details:

Index.html

<script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>
<script src="https://unpkg.com/simple-update-in/dist/simple-update-in.production.min.js"></script>

app.component.ts

// after response from https://directline.botframework.com/v3/directline/conversations
createDirectLine(response: any) {
        this.directLine =  window.WebChat.createDirectLine({
            token: response.token,
            webSocket: true,
            streamUrl: response.streamUrl,
            conversationId: response.conversationId
          });
}

this.store = window.WebChat.createStore({},
            ({dispatch}) => next => action => {
                    if (action.type === 'DIRECT_LINE/POST_ACTIVITY') {
                     // add custom channelData to every postActivity
                     action = window.simpleUpdateIn(action, ['payload', 'activity', 'channelData', 'UserToken'], function () { return this.userToken; });
                    }
                    if (action.type === 'DIRECT_LINE/CONNECT_FULFILLED') {
                        // Send event to bot with custom data
                        dispatch({
                          type: 'WEB_CHAT/SEND_EVENT',
                          payload: {
                            activity: {
                                type : 'conversationUpdate',
                                channelData : { 'UserToken : this.userToken}
                                }
                            }
                        })
                    }
                  return next(action);
                });

renderWebChat() {
        window.WebChat.renderWebChat(
            {
                directLine: this.directLine,
                store: this.store
            },
            this.botWindowElement.nativeElement
        );
}

P.S. This is'nt the full code, I have only added snippets.

Answer 1

You should not be trying to use Web Chat to directly manipulate the conversation update activities spawned by Direct Line. You can influence those activities by providing a user ID when you create the conversation, but the rest is out of your hands. It's probably not a good idea to try to embed the token in the user ID, but you might be able to host the token somewhere the bot could look it up using the user ID.

I think what you really want to do is to send an event activity to the bot that indicates a successful connection, and then use that instead of a conversation update. You already seem to be on the right track because you're trying to respond to DIRECT_LINE/CONNECT_FULFILLED actions in your middleware. Just try following the sample here: https://github.com/microsoft/BotFramework-WebChat/tree/master/samples/04.api/a.welcome-event