Skip to main content

Notifications

Copilot Studio - Bot Extensibility
Unanswered

Loading chat history using webchat.js and direct line API

(0) ShareShare
ReportReport
Posted on by 4

I have a MVC application in which I am attempting to embed my chat bot into.

 

My MVC application is used by internal staff. They will be using the web chat when a customer has asked to speak with a human after having an initial conversation with the bot. I want to be able to render the web chat with chat history from this previous conversation that the bot has been having with a customer.

 

I am trying to do this by creating a store with the activities from the previous conversation and passing this into my renderWebChat call like so (simplified example with IDs scrambled, activities are actually being pulled via the direct line API)

 

 

<div id="webchat" role="main"></div>

@section Scripts {
 <script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>
 <script>
 const history = [
 {
 "type": "message",
 "id": "DHKDFYTDVDUYHG3pNihdH-au|0000000",
 "timestamp": "2024-04-23T00:44:04.1202119+00:00",
 "localTimestamp": "2024-04-23T10:43:59.116+10:00",
 "localTimezone": "Australia/Sydney",
 "serviceUrl": "https://directline.botframework.com/",
 "channelId": "directline",
 "from": {
 "id": "dl_12a0062b-cbff-450f-ad29-b10a00a68857",
 "name": "",
 "aadObjectId": null,
 "role": null
 },
 "conversation": {
 "isGroup": null,
 "conversationType": null,
 "id": "DHKqOSRTSDCG3pNihdH-au",
 "name": null,
 "aadObjectId": null,
 "role": null,
 "tenantId": null
 },
 "recipient": {
 "id": "20a68920-caac-42f4-a7d0-665f79030dcd@M3-KDTYFDVYG",
 "name": "Jac Test",
 "aadObjectId": null,
 "role": null
 },
 "textFormat": "plain",
 "attachmentLayout": null,
 "membersAdded": null,
 "membersRemoved": null,
 "reactionsAdded": null,
 "reactionsRemoved": null,
 "topicName": null,
 "historyDisclosed": null,
 "locale": "en-AU",
 "text": "Hello",
 "speak": null,
 "inputHint": null,
 "summary": null,
 "suggestedActions": null,
 "attachments": [],
 "entities": [
 {
 "type": "ClientCapabilities",
 "requiresBotState": true,
 "supportsListening": true,
 "supportsTts": true
 }
 ],
 "channelData": {
 "clientActivityID": "lbdkoa947y"
 },
 "action": null,
 "replyToId": null,
 "label": null,
 "valueType": null,
 "value": null,
 "name": null,
 "relatesTo": null,
 "code": null,
 "expiration": null,
 "importance": null,
 "deliveryMode": null,
 "listenFor": null,
 "textHighlights": null,
 "semanticAction": null,
 "callerId": null
 },
 {
 "type": "message",
 "id": "DHKqRDTRDRFTGNihdH-au|0000001",
 "timestamp": "2024-04-23T00:44:04.600965+00:00",
 "localTimestamp": null,
 "localTimezone": null,
 "serviceUrl": null,
 "channelId": "directline",
 "from": {
 "id": "20a68920-caac-42f4-a7d0-5619689648d",
 "name": "Jac Test",
 "aadObjectId": null,
 "role": "bot"
 },
 "conversation": {
 "isGroup": null,
 "conversationType": null,
 "id": "DHKqINIJNJa3pNihdH-au",
 "name": null,
 "aadObjectId": null,
 "role": null,
 "tenantId": null
 },
 "recipient": null,
 "textFormat": "markdown",
 "attachmentLayout": null,
 "membersAdded": [],
 "membersRemoved": [],
 "reactionsAdded": [],
 "reactionsRemoved": [],
 "topicName": null,
 "historyDisclosed": null,
 "locale": "en-AU",
 "text": "Hello, how can I help you today?",
 "speak": "Hello, \u003cbreak strength\u003d\"medium\" /\u003e how can I help?",
 "inputHint": "acceptingInput",
 "summary": null,
 "suggestedActions": null,
 "attachments": [],
 "entities": [],
 "channelData": null,
 "action": null,
 "replyToId": "DHKqBJHHBHF6Gva3pNihdH-au|0000000",
 "label": null,
 "valueType": null,
 "value": null,
 "name": null,
 "relatesTo": null,
 "code": null,
 "expiration": null,
 "importance": null,
 "deliveryMode": null,
 "listenFor": [],
 "textHighlights": [],
 "semanticAction": null,
 "callerId": null
 }
 ];
 
 const store = window.WebChat.createStore({ activities: history}, ({ dispatch }) => next => action => {
 return next(action);
 });
 
 
 
 window.WebChat.renderWebChat({
 directLine: window.WebChat.createDirectLine({
 token: '@Model.ChatBotToken' // Use the token from the model
 }),
 store: store
 }, document.getElementById('webchat'));
 </script>
}

 

 

When loading my Razor view I get the following error

 

JacDomney_0-1713914054379.png

 

Is anyone able to assist?

Categories:

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

Microsoft Kickstarter Events…

Register for Microsoft Kickstarter Events…

Announcing Our 2025 Season 1 Super Users!

A new season of Super Users has arrived, and we are so grateful for the daily…

Announcing Forum Attachment Improvements!

We're excited to announce that attachments for replies in forums and improved…

Leaderboard

#1
WarrenBelz Profile Picture

WarrenBelz 145,304

#2
RandyHayes Profile Picture

RandyHayes 76,287

#3
Pstork1 Profile Picture

Pstork1 64,703

Leaderboard

Featured topics