Access to XMLHttpRequest at 'av/1506_audio.encode.wasm' from origin 'https://web.vptsapp.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource

Hello Zoom Team,

I am getting this CORS error when my angular application trying to access below files.

“Access to XMLHttpRequest at ‘hs://source.zoom.us/2.2.0/lib/av/1506_audio.encode.wasm’ from origin 'hs://web.vptsapp.com’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.”

“Access to XMLHttpRequest at ‘hs://source.zoom.us/2.2.0/lib/av/1506_video.simd.wasm’ from origin 'hs://web.vptsapp.com’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.”

Please let me know the solution asap.

Thanks
Vaibhav Chaurasiya
vchaurasiya4@hotmail.com

Welcome, @vchaurasiya4,

Thank you for posting a Zoom Developer Forum, and we apologize for the missed response here. I am happy to help, as a start can you share if you have Cors enabled in the backend of your application? For more information about Cross-Origin Resource Sharing (CORS), please see this helpful resource:

Also, you may find this support document with instructions on how to enable cross-origin isolation for the web meeting SDK helpful:

https://marketplace.zoom.us/docs/sdk/overview/websdk-gallery-view/

This error typically occurs in web development when making cross-origin requests. This error is related to the same-origin policy implemented by web browsers for security reasons. The same-origin policy restricts web pages from making requests to a different domain unless the server explicitly allows it by including the ‘Access-Control-Allow-Origin’ header in the response. To resolve this issue, the server hosting the requested resource needs to include the appropriate ‘Access-Control-Allow-Origin’ header, specifying the domain or origins allowed to access the resource. This can be done by configuring the server’s response headers or by using server-side middleware or frameworks that handle cross-origin requests.

JSON with Padding is just a way to circumvent same-origin policy, when CORS is not an option. This is risky and a bad practice. Avoid using this.

If you want to bypass that restriction when fetching the contents with fetch API or XMLHttpRequest in javascript, you can use a proxy server so that it sets the header Access-Control-Allow-Origin to *.

If you need to enable CORS on the server in case of localhost, you need to have the following on request header.

Access-Control-Allow-Origin: http://localhost:9999