Demonstration of two servers with only first server allowing CORS-requests.
Expected results as of now:
Request to https://cors-test.appspot.com/test successful.
{"status":"ok"}
Request to https://stadtplan.bonn.de/geojson?Thema=19584&koordsys=25832 unsuccessful.
[object ProgressEvent]
Desired result is that both servers return data and have set the response header:
Access-Control-Allow-Origin: *
xxxxxxxxxx<head> <meta charset="utf-8"> <script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script></head><body> <script> function log(message) { $(document.body).append("<p>" + message + "</p>"); } // Create the XHR object. function createCORSRequest(method, url) { var xhr = new XMLHttpRequest(); // Chrome, Firefox, Safari... if ("withCredentials" in xhr) { xhr.open(method, url, true); // ... IE } else if (typeof XDomainRequest != "undefined") { xhr = new XDomainRequest(); xhr.open(method, url); // ... some weird browser } else { xhr = null; } return xhr; } // Make the actual CORS request. function makeCorsRequest(url) { var xhr = createCORSRequest('GET', url); if (!xhr) { alert('Browser does not support CORS.'); return; } // Response handlers. xhr.onload = function() { log("Request to " + url + " successful."); var text = xhr.responseText; log(text) }; xhr.onerror = function(error) { log("Request to " + url + " unsuccessful."); log(error) }; xhr.send(); } // This server allows CORS requests makeCorsRequest('https://cors-test.appspot.com/test') // This server disallows CORS requests makeCorsRequest('https://stadtplan.bonn.de/geojson?Thema=19584&koordsys=25832') </script></body> https://code.jquery.com/jquery-3.2.1.min.js