CORS access control help

I’m having immense trouble figuring out how to deal with CORS policy via URLRequest Headers.

when I use openfl.display.Loader without any headers, like so:

var loader = new Loader();
loader.load(new URLRequest(medalData.icon));

I get the following error:

Access to image at 'https://img.ngfiles.com/icons/medal_secret.png'
from origin 'http://127.0.0.1:3000' has been blocked by
CORS policy: The 'Access-Control-Allow-Origin' header has a
value 'https://www.newgrounds.com' that is not equal to the
supplied origin. [http://127.0.0.1:3000/]

So I tried

var loader = new Loader();
var request = new URLRequest(medalData.icon);
request.requestHeaders.push(new URLRequestHeader("Access-Control-Allow-Origin", "http://127.0.0.1:3000/"));
loader.load(request);

and got:

Access to XMLHttpRequest at 'https://img.ngfiles.com/icons/medal_secret.png'
from origin 'http://127.0.0.1:3000' has been blocked by 
CORS policy: Response to preflight request doesn't pass access control check:
No 'Access-Control-Allow-Origin' header is present on the
requested resource. [http://127.0.0.1:3000/]

I find this confusing because in the first case even though I’m not manually adding a header, it apparently has the header for newgrounds.com, but when i try to add a header, it says no header is present. I know very little about dealing with CORS and http headers in general (this post is likely evident of that) so any help would be greatly appreciated

Headers have to be setup on the server side, not the client.
This page shoud help you to understand how CORS works :

1 Like

Apparently I should be running my browser with CORS features disabled, as this is for testing something that will be hosted on the same domain as the server

If you want to test locally, I’d suggest to put your assets in the same folder as your HTML5 build, and load them with a relative path (e.g. “./Data/myImage.png”).
When you run your project in test mode, lime starts a local web server and serves all assets with your html5/bin folder as the web root.

sure, but I’m specifically testing the loading of external files from a remote server

For local test you can try to add some chrome extensions such as https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi
or https://chrome.google.com/webstore/search/cors

@LarryB : they have become totally useless, at least for me, since Chrome was updated about 1 month ago.

@GeoKureli : we added the following in the resource service configuration

hope this can help.