Web SDK CORS Issue (Laravel Echo)

[alexmayo]

Hi,

We are creating a virtual event platform and would like to integrate the Zoom Web SDK into our webpage. I am successfully generating a signature via PHP and initialising Zoom, however when attempting to join meetings I am receiving CORS errors. We do not use node as a backend, and I am seeing conflicting posts about whether we can or cannot join meetings on the client side? I don’t see why it would be an issue doing it all client side, especially if signatures are being generated on the backend.

Thanks,
Alex

Error
Joining meeting timeout. Could not connect to Web Server error.
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://rwcff.cloud.zoom.us/wc/ping/[...]. (Reason: header ‘x-socket-id’ is not allowed according to header ‘Access-Control-Allow-Headers’ from CORS preflight response).

File Versions
https://source.zoom.us/zoom-meeting-1.7.9.min.js

Screenshots

[alexmayo]

Okay, problem solved! It turns out that Laravel Echo forces some headers on all Ajax requests, so I followed a little workaround here which completely resolved my issue.

x-socket-id header default causing issues.

I simply added the below statement after instantiating Laravel Echo.

//Instantiate Echo as normal
var echo = new Echo({...});

//Clear the headers that Echo sets
$.ajaxSetup({
    beforeSend: function() {}
});

//Continue with Zoom Web SDK...

[alexmayo]

@tommy would it be worth mentioning this on the documentation somewhere, maybe add a CORS section on the Web SDK page with common issues and fixes, I have seen quite a few people with these issues so it would be good to have the solutions consolidated somewhere…

[tommy (Tommy Gaessler)]

Hey @alexmayo,

Glad to hear you got it sorted out! Thanks for the suggestion too, we will look into adding a CORs errors section to our Web SDK.

Thanks,
Tommy