cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Diganta
PVA
PVA

[Announcement] Make your Power Virtual Agents bot start the conversation using a custom canvas

Make your Power Virtual Agents bot start the conversation using a custom canvas blog: https://powervirtualagents.microsoft.com/en-us/blog/make-your-power-virtual-agents-bot-start-the-con...

 

StartConversation.jpg

 

 

 

11 REPLIES 11

@Anonymous - You need to deploy your custom canvas code to start the conversation automatically.

Anonymous
Not applicable

@Diganta 

I did but the error persists. 
In the sample HTML page it works: file://cyg7006/users$/8233/Documents/chatbot/index.html

I cannot link our deployed page because it's out intranet on SharePoint, but in the demo website you can see that the message is not coming up https://powerva.microsoft.com/canvas?cci_bot_id=de070903-2993-49e5-8028-1e5952c31484&cci_tenant_id=e...

 

Could I be doing something else wrong?

I used the code from docs.microsoft.com and only changed the name, colours and bot name

<!DOCTYPE html>
<html>
<head>
<title>Contoso Sample Web Chat</title>
<style>
html, body {
height: 100%;
}
body {
margin: 0;
}
h1 {
font-size: 16px;
font-family: Segoe UI;
line-height: 20px;
color: whitesmoke;
display: table-cell;
padding: 13px 0px 0px 20px;
}
.heading {
background-color: blue;
height: 50px;
}
.main {
margin: 18px;
border-radius: 4px;
}

div[role="form"]{
background-color: black;
}
#webchat {
position: fixed;
height: calc(100% - 50px);
width: 100%;
top: 50px;
overflow: hidden;
}
</style>
</head>
<body>
<div>
<div class="heading">


<h1>Here2Help</h1>

</div>
<div id="webchat" role="main"></div>
</div>
<script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>
<script>
const styleOptions = {
// Add styleOptions to customize web chat canvas
hideUploadButton: true
};


var BOT_ID = "de070903-2993-49e5-8028-1e5952c31484";

var theURL = "https://powerva.microsoft.com/api/botmanagement/v1/directline/directlinetoken?botId=" + BOT_ID;

const store = window.WebChat.createStore(
{},
({ dispatch }) => next => action => {
if (action.type === "DIRECT_LINE/CONNECT_FULFILLED") {
dispatch({
meta: {
method: "keyboard",
},
payload: {
activity: {
channelData: {
postBack: true,
},
//Web Chat will show the 'Greeting' System Topic message which has a trigger-phrase 'hello'
name: 'startConversation',
type: "event"
},
},
type: "DIRECT_LINE/POST_ACTIVITY",
});
}
return next(action);
}
);
fetch(theURL)
.then(response => response.json())
.then(conversationInfo => {
window.WebChat.renderWebChat(
{
directLine: window.WebChat.createDirectLine({
token: conversationInfo.token,
}),
store: store,
styleOptions: styleOptions
},
document.getElementById('webchat')
);
})
.catch(err => console.error("An error occurred: " + err));
</script>
</body>
</html>

Helpful resources

Announcements
 WHAT’S NEXT AT MICROSOFT IGNITE 2022

WHAT’S NEXT AT MICROSOFT IGNITE 2022

Explore the latest innovations, learn from product experts and partners, level up your skillset, and create connections from around the world.

Register for a free PVA chatbot creation workshop

Register for a free PVA chatbot creation workshop

Learn how to respond rapidly to your customers and employees at scale, using intelligent conversational chatbots.

Top Kudoed Authors
Users online (3,552)