We have to control the initEmbeddedMessaging() calling to display Salesforce Messaging for In-App and Web.
embeddedservice_bootstrap.utilAPI.launchChat() can be used to launch Salesforce Messaging for In-App and Web on a button click.
We can use sessionStorage for Messaging Session continuity. When the page load, the Messaging window will be hidden since initEmbeddedMessaging() is not called. So, we can check the sessionStorage on page load to call initEmbeddedMessaging() to display and embeddedservice_bootstrap.utilAPI.launchChat() to launch the messaging to continue the session.
Sample Code:
<html>
<script type="text/javascript">
function initEmbeddedMessaging() {
try {
embeddedservice_bootstrap.settings.language = "en_US"; // For example, enter 'en' or 'en-US'
embeddedservice_bootstrap.init("00D8Z000000sp44", "Messaging_for_In_App_and_Web_GitHub", "https://infallibletechiemiaw.my.site.com/ESWMessagingforInAppa1676392506026", {
scrt2URL: "https://infallibletechiemiaw.my.salesforce-scrt.com",
});
} catch (err) {
console.error("Error loading Embedded Messaging: ", err);
}
}
</script>
<!--
Copy Paste the initEmbeddedMessaging() from Embedded Service Code Snippet
-->
<script type="text/javascript" src="https://infallibletechiemiaw.my.site.com/ESWMessagingforInAppa1676392506026/assets/js/bootstrap.min.js"></script>
<button id="launchChatButton" onclick="launchChat()">
Chat with our Agents!!!
</button>
<script>
window.onload=function() {
console.log( 'Inside onload' );
let startMessaging = sessionStorage.getItem(
'messagingStartCheck'
);
if (
startMessaging &&
startMessaging === 'YES'
) {
console.log( 'Messaging was in progress' );
/*
For session continuity when the page loads,
Messaging is initiated and launched.
*/
initEmbeddedMessaging();
embeddedservice_bootstrap.utilAPI.launchChat();
}
};
function launchChat() {
/*
For session continuity , sessionStorage is used.
*/
sessionStorage.setItem(
'messagingStartCheck',
'YES'
);
initEmbeddedMessaging();
console.log("Loading Messaging now");
setTimeout(() => {
embeddedservice_bootstrap.utilAPI
.launchChat()
.then(() => {
console.log("Inside Launch Chat");
})
.catch(() => {
console.log("Inside Launch Chat catch Block");
})
.finally(() => {
console.log("Inside Launch Chat finally Block");
});
}, 2000);
}
</script>
</html>
