Is it possible to send a message to the Bot Framework as if it were from the user?

Question

I'm using Direct Line 3.0 and the Microsoft Bot Framework and require the webpage to send some form fields to the bot as if the user sent them. For example when the user presses Submit, the fields email, phone etc are sent to the bot as if the user sent them like this: email, phone, etc. This is because the bot redirects the user depending on what the values are. The bot is in C# and is hosted on Azure. The logic for submitting the information should be in JavaScript.

Bot is initiated like this:

<div id="chat" style="background-color:white;   
   width:250px;height:600px;"><div id="bot" />
<script src="https://cdn.botframework.com/botframework-
webchat/latest/botchat.js"></script></div></div>

and through a DirectLine script:

<script>
    const botConnection = new BotChat.DirectLine({
        secret: 'secret',
    });

    BotChat.App({
        user: { id: 'You' },
        bot: { id: 'myId' },
        resize: 'detect',
        botConnection: botConnection
    }, document.getElementById("bot"));

</script>

All I need is to send one string as if the user sent it. I cannot do this with HTML manipulation it seems.

Thanks for anyone pointing me in the right direction!

Answer 1

Sending a message to the bot "like the user would do" is possible using the "Backchannel" functionnality of the webchat.

There is a good sample of use in the Readme file on Github webchat's page: https://github.com/Microsoft/BotFramework-WebChat#the-backchannel .

You have to use your botConnection previously created to send an activity like the following:

botConnection.postActivity({
    from: { id: 'me' },
    name: 'buttonClicked',
    type: 'event',
    value: ''
});

Then catch this on your bot code, but checking the Activity type which will be Event in this case.

You can have a look on how they throw this postActivity from a button click in the sample provided: samples here: https://github.com/Microsoft/BotFramework-WebChat/blob/master/samples/backchannel/index.html

Or in this other sample that I made (available on Github, both client web page and bot code): the bot's controller looks like the following:

[BotAuthentication]
public class MessagesController : ApiController
{
    /// <summary>
    /// POST: api/Messages
    /// Receive a message from a user and reply to it
    /// </summary>
    public async Task<HttpResponseMessage> Post([FromBody]Activity activity)
    {
        // Process each activity
        if (activity.Type == ActivityTypes.Message)
        {
            await Conversation.SendAsync(activity, () => new Dialogs.RootDialog());
        }
        // Webchat: getting an "event" activity for our js code
        else if (activity.Type == ActivityTypes.Event && activity.ChannelId == "webchat")
        {
            var receivedEvent = activity.AsEventActivity();

            if ("localeSelectionEvent".Equals(receivedEvent.Name, StringComparison.InvariantCultureIgnoreCase))
            {
                await EchoLocaleAsync(activity, activity.Locale);
            }
        }
        // Sample for Skype: locale is provided in ContactRelationUpdate event
        else if (activity.Type == ActivityTypes.ContactRelationUpdate && activity.ChannelId == "skype")
        {
            await EchoLocaleAsync(activity, activity.Entities[0].Properties["locale"].ToString());
        }

        var response = Request.CreateResponse(HttpStatusCode.OK);
        return response;
    }

    private async Task EchoLocaleAsync(Activity activity, string inputLocale)
    {
        Activity reply = activity.CreateReply($"User locale is {inputLocale}, you should use this language for further treatment");
        var connector = new ConnectorClient(new Uri(activity.ServiceUrl));
        await connector.Conversations.SendToConversationAsync(reply);
    }
}