Hi @jbmsft ,
Thanks for your reply.
I noticed that you posted the links related to Bot Framework Composer, but in this case I'm talking about PVA and from the sample on the tutorials, I got the following:
<!DOCTYPE html>
<html>
<head>
<title>My Bot</title>
<link rel="stylesheet" href="style.min.css">
</head>
<body>
<div>
<div id="heading">
<!-- Change the h1 text to change the bot name -->
<div class="headingFirst">
<h1 class="chatboth1header">My Bot</h1>
</div>
<div class="headingSecond">
</div>
</div>
<div id="webchat" role="main"></div>
</div>
<script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>
<script>
const styleSet = window.WebChat.createStyleSet({
// Add styleOptions to customize Web Chat canvas
bubbleBackground: 'rgba(0, 0, 255, .1)',
bubbleFromUserBackground: 'rgba(0, 255, 0, .1)',
rootHeight: '100%',
rootWidth: '100%',
backgroundColor: 'white',
hideUploadButton: false,
userAvatarBackgroundColor: 'white',
botAvatarBackgroundColor: 'white',
});
// Set the avatar options.
const avatarOptions = {
backgroundColor: 'white',
botAvatarBackgroundColor: 'rgba(255, 255, 255, 1)',
// accent: 'rgba(255, 255, 255, 1)',
botAvatarInitials: 'MPID',
userAvatarInitials: 'ME',
};
// Add your BOT ID below
var BOT_ID = "my_bot_id";
var theURL = "https://powerva.microsoft.com/api/botmanagement/v1/directline/directlinetoken?botId=" + BOT_ID;
fetch(theURL)
.then(response => response.json())
.then(conversationInfo => {
window.WebChat.renderWebChat({
directLine: window.WebChat.createDirectLine({
token: conversationInfo.token,
}),
styleSet,
styleOptions: avatarOptions
},
document.getElementById('webchat')
);
})
.catch(err => console.error("An error occurred: " + err));
</script>
</body>
</html>
So, my bot id is the id from my PVA bot.
I inserted the bot on my site through an iframe and when I change the page the conversation disappear and the user have to start all over again.
If there is a better way to do it using PVA credentials, please share with the community.
Kind regards,
Fernando
