Feedback: countries layer of OpenLayers3 demo not appearing in Firefox

[Jeff McKenna]

From Jukka:

---
Some observations about the demo that starts from ​http://localhost/openlayers/examples/mapserver-wms.html?mode=advanced

• Countries layer does not show with Firefox 46.0.1 on Windows 7. Only the background is visible but Firefox shows that valid GetMaps are sent and good maps are coming back from the server. GetFeatureInfo works. With IE 11 also Countries is OK.

[Jeff McKenna]

This is a complex issue. Good news is that I can duplicate, and there is a quick fix. Bad news is that to fix this properly a new module will have to be enabled in Apache, and a setting added to httpd.conf. Here are my findings:

Background

• MS4W users access the MS4W homepage by either ​http://localhost or ​http://127.0.0.1
• mapserver-wms.js contains a url parameter, to point to the local WMS service

Actual Error Message

Image from origin 'http://127.0.0.1' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not allowed access.

How to Reproduce

• \ms4w\apps\openlayers-3.15.1\examples\mapserver-wms.js contains a url with 127.0.0.1:

     url: 'http://127.0.0.1/cgi-bin/mapserv.exe?MAP=/ms4w/apps/openlayers-3.15.1/examples/map/wms-server.map',
  

• using Chrome, Firefox, or Safari, try to go to: ​http://localhost/openlayers/examples/mapserver-wms.html

Reason for Error

Web browsers have security included to not allow Javascript being executed in regards to a different host. OpenLayers2 users will remember having to use a 'proxy.cgi' file often for this scenario. For OpenLayers3, there is a 'crossOrigin' parameter to handle these requests. Here is a good discussion on this crossOrigin: ​http://gis.stackexchange.com/questions/71715/enabling-cors-in-openlayers

Quick Workaround

If you are using localhost, then edit \ms4w\apps\openlayers-3.15.1\examples\mapserver-wms.js and modify the url parameter (line #2) to:

  url: 'http://localhost/cgi-bin/mapserv.exe?MAP=/ms4w/apps/openlayers-3.15.1/examples/map/wms-server.map',

Longer-term Solution

MS4W's Apache must be modified as follows, to allow both localhost and 127.0.0.1 in OpenLayers:

• edit httpd.conf and
  • uncomment line#~117: LoadModule headers_module modules/mod_headers.so
  • inside the /cgi-bin location section (line#~384) add: Header set Access-Control-Allow-Origin "*"
  • restart Apache

[Jeff McKenna]

Milestone renamed

[Jeff McKenna]

Milestone renamed

[Jeff McKenna]

Milestone renamed

[TC Haddad]

Seems like a slightly safer way to go for this is to use

Header add Access-Control-Allow-Origin "localhost";
Header add Access-Control-Allow-Origin "127.0.0.1";

[Jeff McKenna]

Replying to TC Haddad:

Seems like a slightly safer way to go for this is to use

Header add Access-Control-Allow-Origin "localhost";
Header add Access-Control-Allow-Origin "127.0.0.1";

Good idea. From testing, apparently we cannot have multiple of these set, as this error is thrown: "Multiple CORS header ‘Access-Control-Allow-Origin’ not allowed".

However this does work (note that the http is required for it to work) :

<Location "/cgi-bin">
    Options None
    Require all granted
    Header add Access-Control-Allow-Origin "http://localhost"
</Location>

I think this should be added into the next release. (keeping in mind that the overwhelming majority of MS4W users are using the setup.exe installer, which creates a shortcut on their desktop to goto ​http://127.0.0.1 (and avoids this issue). However for advanced users I agree that this is a good enhancement. Will include in next release. Thanks for this idea!

[Jeff McKenna]

Milestone renamed