Hello all,
I have two use cases that I need to implement the messaging chat for.
user logs into chat messaging using SSO. I assume I can use the openID here with our microsoft AD with ENTRA ID?
user is brand new hire and doesn't have SSO yet or AD profile but has email address to type into a form field.
Is there is way to launch the chat with just passing an email address to the chat with what the user has entered into an input field or something?
thanks in advance!
Hi,
1/ yes, integration with Microsoft Entra would work.
2/ You may either attach custom attributes with data gathered from elsewhere or involve a BOT to capture customer info online.
Hope this helps,
Regards,
V.P.
Thanks can you maybe point me to some documentation to do the items you mentioned in 2? Thanks so much!
Hi,
You can check this post and this link for custom attributes.
For bot topic, you may refer to this article.
Regards,
V.P.
Thanks ill check it out. Also for number 1 would I refer to documentation for openid integration to implement that? Any other documentation to look at for that?
Hi,
You may want to check this article.
And this post.
Getting also your auth provider documentation may be helpful.
Regards,
V.P.
Thanks we got number 2 handled and are able to pass attributes into the chat. Works great.
Still trying to connect with openid though for number 1 use case. Forgive me if I say things incorrectly as I havent ever setup SSO at all.
We are setting it all up in azure as a registered app. I setup the openid connect integration in purecloud with client id secret and discovery URI etc given to me by azure admin. I published new version of chat with this now in authentication mode pointed towards using that openid connect integration and there is the code snippet on the page from before it was using authentication. I set the deployment to the use the new version etc but now the chat launcher doesn't show up at all and there a no errors in JS console and no network SSO calls that can see in chrome f12 dev tools. Any good way to debug what might be happening?
The code snippet I was given to put on the page is all that is needed right? Or is there more needed when using openid connect? One thing we are not sure of is what we are supposed to put in for the "redirect URI" on the azure side setup. Do need to do all this as well?
Hi,
Yes, add the debug attribute to the Messenger snippet:
(function (g, e, n, es, ys) {
g['_genesysJs'] = e;
g[e] = g[e] || function () {
(g[e].q = g[e].q || []).push(arguments)
};
g[e].t = 1 * new Date();
g[e].c = es;
ys = document.createElement('script'); ys.async = 1; ys.src = n; ys.charset = 'utf-8’;
document.head.appendChild(ys);
})(window, 'Genesys', '>URL>’,
environment: '<ENV>’,
deploymentId: '<ID>’,
debug: true <=== add this attribute
});
Messenger will not show up until successful authentication.
Callback url plays a central role there.
You need to set it exactly as it is being registered in Azure when calling /authorize endpoint and Genesys Api.
When Azure has authenticated the user, it will invoke the callback url, ie your webapp.
When your web app receives this call, it should load Messenger script with auth plugin to execute the second step of the authentication code flow: the code exchange.
Url callback contains a code to exchange only once within a limited timeframe.
Set the code with callback url and various other parameters (see the doc):
AuthProvider.registerCommand('getAuthCode', (e) => {
e.resolve({
authCode: authCode, // code to exchange
redirectUri: redirectUri // Redirect URL as configured in Azure
})
});
This will finalize the flow.
Messenger should show up.
Hope this helps,
Regards,
V.P.
Here's a basic javascript sample to setup authenticated Messenger:
<head>
<script type="text/javascript">
(function (g, e, n, es, ys) {
g['_genesysJs'] = e;
g[e] = g[e] || function () {
(g[e].q = g[e].q || []).push(arguments)
};
g[e].t = 1 * new Date();
g[e].c = es;
ys = document.createElement('script'); ys.async = 1; ys.src = n; ys.charset = 'utf-8'; document.head.appendChild(ys);
})(window, 'Genesys', 'https://<GENESYS_URL>/genesys-bootstrap/genesys.min.js', {
environment: '<YOUR REGION>',
deploymentId: '<YOUR DEPLOYMENT_ID>',
debug: true // optional - Enables Genesys browser console logging
});
</script>
<script type="text/javascript">
const redirectUri = "YOUR_CALL_BACK_URL"; // ex: "http://localhost:3000/authorization-code/callback";
// Activate Messenger auth plugin when callback Url is invoked. Ex: /authorization-code/callback
if (window.location.pathname == '<YOUR_CALLBACK_URL relative path>') {
const urlParams = new URLSearchParams(window.location.search || window.location.hash.slice(1));
const authCode = urlParams.has('code') ? urlParams.get('code') : ""
console.log('urlParams=' + decodeURIComponent(urlParams));
console.log('authCode=' + authCode);
// https://developer.genesys.cloud/commdigital/digital/webmessaging/messengersdk/authenticatedMessenger
// https://developer.genesys.cloud/commdigital/digital/webmessaging/messengersdk/SDKCommandsEvents/authPlugin
// https://developer.genesys.cloud/commdigital/digital/webmessaging/messengersdk/SDKCommandsEvents/authProviderPlugin
Genesys('registerPlugin', 'AuthProvider', (AuthProvider) => {
AuthProvider.registerCommand('getAuthCode', (e) => {
console.log(`getAuthCode called, code: ${authCode}, redirectUri: ${redirectUri}`);
e.resolve({
authCode: authCode,
redirectUri: redirectUri
})
});
AuthProvider.registerCommand('reAuthenticate', (e) => {
// Messenger will call this command when current refreshToken and/or authCode are no more valid.
// Brand can add logic here to simply re-login and resolve this command after successful login so that Messenger can get the new authCode. (In case when browser needs to reload for a login, there is no need to resolve this command). Note: After a successful re-login, calling the getAuthCode command is taken care internally and there is no need to call it explicitly again.
window.document.getElementById('authLoginBtn').click(); // simulate the login button click
e.resolve();
});
AuthProvider.subscribe('Auth.ready', () => {
console.log("Auth plugin ready");
});
AuthProvider.subscribe('Auth.authenticated', (jwt, refreshToken) => {
console.log("Auth.authenticated");
const authLogoutBtn = window.document.getElementById('authLogoutBtn');
if (authLogoutBtn) {
authLogoutBtn.onclick = function () {
AuthProvider.command('Auth.logout').finally(() => {
window.location.replace(window.location.origin);
});
}
}
});
AuthProvider.subscribe('Auth.authError', (e) => {
alert('Auth.authError\n' + JSON.stringify(e, null, 4));
console.log("Auth.authError");
console.log(JSON.stringify(e, null, 4));
});
AuthProvider.subscribe('Auth.loggedOut', () => {
const authLogoutBtn = window.document.getElementById('authLogoutBtn');
if (authLogoutBtn) {
authLogoutBtn.onclick = null;
}
});
AuthProvider.subscribe('Auth.ready',() => {
console.log("Auth plugin is ready.")
});
AuthProvider.ready(); // COMPULSORY
});
Genesys('subscribe', 'Messenger.ready',
(e) => console.log('Messenger.ready')
);
function toggleMessenger(){
Genesys("command", "Messenger.open", {},
function(o){}, // if resolved
function(o){ // if rejected
Genesys("command", "Messenger.close");
}
);
}
}
</script>
</head>
<body>
<h2>Flush local storage to restart login</h2><br>
<div><p id="authURL">https://YOUR_AUTH_SERVER/authorize?client_id=<CLIENT_ID>&response_type=code&response_mode=fragment&scope=openid%20profile%20email%20offline_access%20phone&redirect_uri=YOUR_REDIRECT_URI</p></div>
<div><p id="authClientId">ClientId: YOUR ID</p></div><br>
<div><p id="instruction">Check Integration config to use your auth server</p></div>
<div><p id="discoveryUri">Discovery Uri: https://YOUR_AUTH_SERVER/.well-known/openid-configuration</p></div>
<div id="auth">
<button id="toggleBtn" type="button" onclick="toggleMessenger()">Toggle</button>
<button id="authLoginBtn" type="submit" formmethod="get" formtarget="_self" onclick="location.href=window.document.getElementById('authURL').innerText">Login</button>
<button id="authLogoutBtn" type="button">Logout</button>
</div>
</body>
Ok got it to work. Had to click login again. Ok so now how does the authenticated messager get at the users info like email address etc from that AD profile since they are logged in with that basically?
Glad you succeeded.
This is achieved by specifying scopes like profile and email.
While we can access theoretically all data referenced by the scope(s), our service currently handle only three types of info:
firstname, lastname and email.
Please refer to this article for more details and this one for Architect.
Regards,
V.P.
Excellent thanks!
so we tried using the "Message.Message.senderAddressInfo.email" variable in the architect and we couldnt get a value for it. What could we be doing wrong? Azure admin says that the email scope should be a default scope that is included in the call. But we also did define that with the authlogin url all like so:
https://login.microsoftonline.com/xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx/oauth2/v2.0/authorize?client_id
=xxxxxxxxxxxxxxxx&response_type=code&response_mode=fragment&scope=openid%20profile%20email%20offline_access%20phone&redirect_uri=
https://localhost:44391/chatsession.aspx
Sounds good to me.
Can you provide a contextId (in the response headers of your request when login in) ?
Regards,
V.P.
you mean with this GET URl call?
https://login.microsoftonline.com/xxxxxxxxxxxxxxxxxx/oauth2/v2.0/authorize?client_id%20=xxxxxxxxxxxxxxxx&response_type=code&response_mode=fragment&scope=openid%20profile%20email%20offline_access%20phone&redirect_uri=%20https://localhost:44391/chatsession.aspx
If so I dont see a contextId in the response header looking at chrome dev tools.
No,
when calling Genesys Api /api/v2/webdeployments/token/oauthcodegrantjwtexchange
This is what Messenger auth plugin does behind the hood.
Inspecting network logs from the developer tools should do.
Regards,
V.P.
here is all the request headers for that call:
Access-Control-Allow-Headers:
Origin, X-Requested-With, Content-Type, Accept, Authorization, DNT, User-Agent, Keep-Alive, Cache-Control, ININ-Client-Path, Genesys-App
Access-Control-Allow-Methods:
GET, POST, PUT, DELETE, OPTIONS, HEAD, PATCH
Access-Control-Allow-Origin:
Access-Control-Expose-Headers:
Retry-After,inin-correlation-id
Access-Control-Max-Age:
86400
Cache-Control:
no-cache, no-store, must-revalidate
Connection:
keep-alive
Content-Length:
1176
Content-Type:
application/json
Date:
Thu, 25 Apr 2024 12:19:08 GMT
Inin-Correlation-Id:
067200aa-b7a6-4016-8ad7-8932c9d8eb50
Strict-Transport-Security:
max-age=31536000; includeSubDomains
Via:
1.1 f4a9c912221b840a5f27fb82db198fd0.cloudfront.net (CloudFront)
X-Amz-Cf-Id:
hHR2B4nmbDY8wPcA6smol34C1L9BVNjFmogekeFds_6b-0ZFURv3Jg==
X-Amz-Cf-Pop:
ATL59-P4
X-Cache:
Miss from cloudfront
Request Headers
Raw
Network Data Available
Hi,
yes, Inin-Correlation-Id is what I needed.
I could check in logs that attributes for first name, last name and email were populated.
So no issue here on Azure or initial /authorize request.
Next step is to check in your flow what values were set.
Check in your Messenger deployment which workflow is used.
Open it in Architect.
You should have an execution history button.
Click on it and select the more recent execution flow.
Then dive into the variables set when the workflow starts.
You should see Message.senderAddressInfo.email attribute.
Pay attention also to the syntax (case sensitive) for the variable: Message.Message.senderAddressInfo.email
Regards,
V.P.
Hey we got it to work. The person building the architect flow was setting State.email = Message.Message.senderAddressInfo.email in the start of it and trying to use State.email(if you look at my screenshot) to output the value. Had him try to switch it to use Message.Message.senderAddressInfo.email directly instead of setting the value to another variable and it now works and shows the email in chat. Thanks for all the help! Also we dont have that execution history button. If I google that it says its a future feature coming soon. I guess you have a beta version there? It would have been very nice to have that log in this scenario!
Glad you make it work.
Looks weird that you cannot save the variable into another one.
and 
for everyone.
