Intercept outbound web message client side

Web Messaging
1

I know we can use the Genesys Web Messenger Plugin to subscribe to events and receive a message from agent/bot:

Genesys("subscribe", "MessagingService.messagesReceived", function({ data }) {
console.log(data);
});

But is it possible to intercept the message and change it before it is displayed in the native Genesys Cloud Web Messenger widget?

I was hoping to be able to change the inner html of a link element so that we could load a different web page in the existing tab (another page with the web messaging deployment code snippet). Opening a new tab or browser isn't ideal and goes against accessibility.

TIA, Lee.
2

Hi @Lee_Clements
You might get some ideas from this blueprint. It intercepts web messages in order to translate them.

3

Thanks Jacob, I'll take a look.

My initial thinking hasn't worked out I'm afraid, each of the <div> tags used to build the UI with the message uses dynamic class selectors, meaning I can't then grab it after the message has been displayed and modify the properties, such as target="_blank" to target="_parent".

Maybe this blueprint will give me some different options to explore.

4

If you're using the messenger widget, you must use it as-is and constrain your efforts to the supported integration points. Hacking the DOM is unsupported and unsafe; we make no commitments about our private source code not having breaking changes.

If you wish to manage the display of messages yourself, you must build your own client using the web messaging guest API. This will give you full control over everything client-side, because you have to build it all from scratch. It's not an easy option, but your choices are to use the out of the box Messenger with the integration points it documents or build your own client if your use case falls outside of the supported options. The docs for the guest API can be found here: https://developer.genesys.cloud/commdigital/digital/webmessaging/websocketapi

You can request new features and share your use case at https://genesyscloud.ideas.aha.io/.

That blueprint is essentially an out-of-band solution. It presents an additional alternative UI with modified output but does not alter the original screen. It's also on the agent side, not the customer. It may spur some ideas for you, but it will not satisfy your requirement of intercepting and modifying a message within Messenger.

5

Thanks Tim; you've hit on all the points I was concerned about when trying to change the "as-is" solution. I think our only option is to get for a fully custom UI. Thank you for your feedback on this.

6

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.