cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Highlighted

[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
Highlighted

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

Highlighted

@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
PVA Commnity Blog

NEW Power Virtual Agents Community Blog

View articles posted by fellow community members on the Power Virtual Agents Community Blog!

Community Conference

Power Platform Community Conference

Check out the on demand sessions that are available now!

Power Platform ISV Studio

Power Platform ISV Studio

ISV Studio is designed to become the go-to Power Platform destination for ISV’s to monitor & manage published applications.

Top Solution Authors
Top Kudoed Authors
Users online (10,075)