topic Re: WxCC Desktop iFrame JS Copy to Clipboard Failing in Webex for Developers

WxCC Desktop iFrame JS Copy to Clipboard Failing

Faisal Zaidi — Thu, 27 Apr 2023 09:47:56 GMT

We have a web application which contains a button to invoke a JavaScript function which copies text from a textbox to the users clipboard. This functions works perfectly when the application is browsed directly.

However, when we embed the application as an iFrame in the WxCC Agent Desktop, the copy to clipboard doesnt work and we get the following error in the browser console logs for Chrome and Edge (Firefox still works fine):

"Uncaught (in promise) DOMException: The Clipboard API has been blocked because of a permissions policy applied to the current document."

We have tried to set both of these custom header values in our iFrame application as well as directly in IIS on the hosting WebServer but neither has worked:

Any ideas please?

Re: WxCC Desktop iFrame JS Copy to Clipboard Failing

Santosh Patil — Fri, 28 Apr 2023 06:09:23 GMT

Hi Faisal, Could you please raise this query as a ZENDESK ticket as that will be our new process to handle the Wxcc API request queries?
You could write a mail to this wxccdevsupport@webex.com and it will create a ticket on us. Thank you.

Re: WxCC Desktop iFrame JS Copy to Clipboard Failing

Faisal Zaidi — Fri, 28 Apr 2023 09:34:39 GMT

Thanks Santosh - doing that now..

Re: WxCC Desktop iFrame JS Copy to Clipboard Failing

sanjeevwagh1 — Thu, 19 Oct 2023 22:02:20 GMT

Is this resolved? Can someone brief on the solution?

Re: WxCC Desktop iFrame JS Copy to Clipboard Failing

Sham N Satyaprasad — Fri, 20 Oct 2023 06:36:18 GMT

Hi @sanjeevwagh1,

To resolve the issue we have provided example code snippets for both same-origin and cross-origin scenarios, demonstrating the usage of the "allowedParams" attribute.

For same-origin scenarios:

{ "comp1": { "comp": "agentx-wc-iframe", "attributes": { "src": "https://widget-kad.s3.amazonaws.com/Trading.htm", "allowedParams": "clipboard-read; clipboard-write" }, "wrapper": { "title": "Return drop off locations", "maximizeAreaName": "app-maximize-area" } } }

For cross-origin scenarios: ${URL} URL for the site that you are copying from

{ "comp1": { "comp": "agentx-wc-iframe", "attributes": { "src": "https://widget-kad.s3.amazonaws.com/Trading.htm", "allowedParams": "clipboard-read; clipboard-write self ${URL}" }, "wrapper": { "title": "Return drop off locations", "maximizeAreaName": "app-maximize-area" } } }

Adding the `allowedParams` attribute as either "clipboard-read; clipboard-write" or "clipboard-read; clipboard-write self ${URL}" enables clipboard read and write operations within the iframe.

We've also added an example to our GitHub repository, which you can find here - https://github.com/CiscoDevNet/webex-contact-center-widget-starter/blob/master/Iframe_Widget_Allowedparams.json

Please try these and let us know the outcome. If the issue still persists, I suggest creating a ticket here for further assistance - https://developer.webex-cx.com/support/.