WMS server with CORS enabled?

Consider this question here. Many servers do not set CORS headers correctly. As I recover here, even esri does not do so, but bing does.

That begs for the question, what are some WMS servers that have their CORS headers properly?

Answer

If you are hosting your map server,

It simply depends of your WMS server deployment and sofware but it's not set by default.

• 
  
  

  For MapServer, it can be deployed with Apache, Lighthttpd, or Nginx.

  
  


• 
  

  For GeoServer, you should avoid the default Jetty (version 6 too old, need to hack to set proper CORS headers) but use instead Jetty 7, TomCat or JBoss.

  
  


• 
  

  It's also possible to use a third party server like Apache/Nginx in front of your WMS. I mean your server WMS is not exposed directly: it's Apache/Nginx that acts as a reverse proxy where you can set CORS headers. You can see keywords proxypass for this case using a search engine.

  
  

You can take a look on http://enable-cors.org to grasp configuration you should do depending on the server associated with your WMS server.

When you do not have control over third party server,

You have to use a proxy: public or your own.

If it's for demo purpose, the simplest way to do is to rely on a public CORS proxy using this snippet at the beginning of your JS code

(function() {
    var cors_api_host = 'cors-anywhere.herokuapp.com';
    var cors_api_url = 'https://' + cors_api_host + '/';
    var slice = [].slice;
    var origin = window.location.protocol + '//' + window.location.host;
    var open = XMLHttpRequest.prototype.open;
    XMLHttpRequest.prototype.open = function() {

        var args = slice.call(arguments);
        var targetOrigin = /^https?:\/\/([^\/]+)/i.exec(args[1]);
        if (targetOrigin && targetOrigin[0].toLowerCase() !== origin &&
            targetOrigin[1] !== cors_api_host) {
            args[1] = cors_api_url + args[1];
        }
        return open.apply(this, args);
    };
})();

This snippet will take care of "proxyfying" all your Ajax HTTP calls.

For production, you can just set your own instance with Node cors-anywhere module (it motors previous mentioned proxy).