Cross-Origin Resource Sharing (CORS) is a mechanism to allow URLs (or origins) different from your own to make requests to your server. Below, we'll explore exactly what CORS is, and then help you understand how to set it up for Mutiny.
In the case of Mutiny, when we load a preview of an experience or show a page in the editor, we load the page using the origin of https://peek-achoo.com. If we try to make requests to your server, we may get blocked because of the same-origin policy.
Cross-Origin Resource Sharing
Of course, there may be situations when you want to allow a different domain to request information from your servers. In order to relax the restrictions of the same-origin policy, you can use a CORS policy. The CORS policy is set so when the response comes back from the server, there will be a note that essentially says "this site isn't the same origin as my server, but we trust it, so you can allow the request to go through". That way, the browser won't block it.
CORS and Mutiny
How to know if you’re running into CORS issues
If you’re having trouble previewing your experience you can check your browser console to see if CORS issues are at play. Right-click the page and click “Inspect > Console” and look for an error that looks similar to this:
In order for Mutiny to work properly, you need to be sure that your CORS policy allows requests from Mutiny origins. To do this, ensure that when Mutiny makes a request from the following domain, an Access-Control-Allow-Origin header is added to the response allowing that specific domain. Note the spelling difference between these domains.
For example, the header response for a request from https://peek-achoo.com should look like this:
Don't be a stranger
If you have any questions, we’re here to help! Please feel free to contact us at any time, either through Intercom chat or via email@example.com.