You’re offline. This is a read only version of the page.
11
Hi Team,
We need a solution, how to pass email address after Azure authentication in react webapp to Power Virtual Agent. We want to store that email address in PVA as a global variable which we will use for further activity like retrieving ServiceNow ticket based on email address.
Our overall goal is we don't want user to enter email address, as he can enter email for others too.
Below is the code i am using in React for PVA bot popup customization
************************************************************
<!DOCTYPE html>
<html lang="en">
<head>
<title>Contoso Sample Web Chat</title>
<style>
html,
body {
height: 100%;
}
body {
margin: 0;
}
h1 {
color: whitesmoke;
font-family: Segoe UI;
font-size: 16px;
line-height: 20px;
margin: 0;
padding: 0 20px;
}
#banner {
align-items: center;
background-color: black;
display: flex;
height: 50px;
}
#webchat {
height: calc(100% - 50px);
overflow: hidden;
position: fixed;
top: 50px;
width: 100%;
}
</style>
</head>
<body>
<div>
<div id="banner">
<h1>Contoso Bot Name</h1>
</div>
<div id="webchat" role="main"></div>
</div>
<script crossorigin="anonymous" src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>
<script>
(async function () {
const styleOptions = {
// Hide upload button.
hideUploadButton: true,
};
const tokenEndpointURL = new URL(
'TokenEndpointURL'
);
const locale = document.documentElement.lang || 'en'; // Uses the language specified in the <html> element and falls back to English (United States).
const apiVersion = tokenEndpointURL.searchParams.get('api-version');
const [directLineURL, token] = await Promise.all([
fetch(
new URL(`/powervirtualagents/regionalchannelsettings?api-version=${apiVersion}`, tokenEndpointURL)
)
.then((response) => {
if (!response.ok) {
throw new Error('Failed to retrieve regional channel settings.');
}
return response.json();
})
.then(({ channelUrlsById: { directline } }) => directline),
fetch(tokenEndpointURL)
.then((response) => {
if (!response.ok) {
throw new Error('Failed to retrieve Direct Line token.');
}
return response.json();
})
.then(({ token }) => token),
]);
const directLine = window.WebChat.createDirectLine({
domain: new URL('v3/directline', directLineURL),
token,
});
// Send the username and start the conversation
directLine
.postActivity({
from: { id: 'yourUserId', name: 'YourUserName' },
type: 'message',
text: 'Hello, EmailAddress',
})
.subscribe();
WebChat.renderWebChat({ directLine, locale, styleOptions }, document.getElementById('webchat'));
})();
</script>
</body>
</html>
****************************************************************************************************
In Above code in place for EmailAddress we are passing our react variable where we have store email after login
Hi @amit_05
You can pass context variables to a Copilot Studio bot in the activities sent to the Direct Line API.
For example, the below values Language and TrackingId can fill values the Global.Language and Global.TrackingId variables that have been configured to accept external values in Copilot Studio, as part of the conversation start event:
Share
Report
All responses (
Answers (
activity: {
channelData: {
postBack: true,
},
name: 'startConversation',
type: "event",
// Passing context variables, created as Global variables accepting external values in Copilot Studio
value: {
Language: "en",
TrackingId: "G-1234567"
}
}
In Copilot Studio, the questions for the global variables don't have to be defined in the triggered topic, they can live in any custom topic:
#1
WarrenBelz
146,524
Most Valuable Professional
#2
RandyHayes
76,287
Super User 2024 Season 1
#3
Pstork1
65,906
Most Valuable Professional
