Cross-Origin XMLHttpRequest

When activating the mdp-connect plugin, I received an error that wouldn't allow files loaded from other domains. Here's how I fixed it.

When activating the mdp-connect plugin, I received an error that wouldn’t allow files loaded from other domains. Here’s how I fixed it.

Here’s the initial error I received on the page that needed to load files via JavaScript:

Access to XMLHttpRequest at 'https://mortensondentalpartners.com/wp-content/plugins/mdp-connect/templates/mappins-smiles360.html' from origin 'https://smiles360dental.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

To fix it, add the following to your .htaccess file to allow these files to be loaded from other domains:

<IfModule mod_headers.c>
  <FilesMatch "\.(css|js|json|xml|html)$">
    Header set Access-Control-Allow-Origin "*"
  </FilesMatch>
</IfModule>

In that bit of code I’m allowing files with the specified extensions. You can add/remove from that as needed.

This code has been added (in this example) to the .htaccess for both mortensondentalpartners.com and smiles360dental.com. I recommend this be added by default moving forward.