How to read KMLfile from local server for Openlayers "EarthQuakes in KML"?

Question

I use the following EarthQuake map on my local server: https://openlayers.org/en/v4.6.5/examples/kml-earthquakes.html

I have a standalone "map.html" for the map in my application in my "Views" folder. Impementing this works ok, the map loads, and using the examples data:

url: 'https://openlayers.org/en/v4.6.5/examples/data/kml/2012_Earthquakes_Mag5.kml' 

The data shows up in the map, all good so far

By going to this'data-url', a file is downloaded. So i download and edit this file with my own KML-datapoints. And then i place this file in the same folder as my "map.html" (The views folder).

I have tried to reference it manually by path, but got some CORS issues, then i sought out some xmlhttprequest, but not sure that is the right path since it's supposed to be a file (?) ..... So it all boils down to:

How do i reference my kml-file from within the script tags in the HTML-eartquake-file to this file in the same folder?

Update feb 2020:

I think now the CORS issue is removed. However, when i try to implement this it does not work:

1. If i use the Openlayer example link in the VectorSource - URL; https://openlayers.org/en/v4.6.5/examples/data/kml/2012_Earthquakes_Mag5.kml, my app downloads a file like this: "filename.kml"

2. If i use my own file on my server, i get a file like this "filename"

   • That is without the .kml extension.
   • The url looks like this in this case: https://myapp.net/mydata.kml

In express/nodejs i send the file like this:

router.get("/mydata", function (req, res) {
    res.sendFile(path + "mydata.kml");
});

Here is a example from the Chrome download bar:

How can i send my file WITH extension? And will that solve my problem?

Thanks

Answer 1

If you are using IIS you need to go to the management panel and add .kml to the MIME types. If you are planning a lot a mapping applications adding .geojson (application/json) and .gml and .gpx (text/xml) might also be useful.

You will also need to enable cross origin access for your data folder