I've been dealing with this issue for a while. I have a geoprocessing tool on the ArcGIS server that generates a report from a map click. I get the CORS error when the server tries to return the report PDF to the popup in the map window.
I've tried adding this to our webconfig file, and it doesn't help.
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="*" />
<add name="Access-Control-Allow-Methods" value="*" />
</customHeaders>
I tried adding this to my JavaScript code and it worked in once instance, but not another.
esriConfig.defaults.io.corsEnabledServers.push("ourserver.com")
I've also tried removing these lines from the webconfig and adding "Access-Control-Allow-Origin, * " under HTTP response headers in our IIS web server manager and I get this error "The 'Access-Control-Allow-Origin' header contains multiple values 'null, *', but only one is allowed. Origin 'null' is therefore not allowed access."
I'm pulling my hair out trying figure this out.
Solved! Go to Solution.
If your server and client are on the same machine... I cannot understand.
Are you running the application from outside, for example your machine?
Please, check the following:
BTW: double check that esriConfig.defaults.io.corsEnabledServers.push("ourserver.com") is include in your code after the changes you did.
I have the same issues whether I test this in the browser on the server machine or a browser on another machine. I opened Chrome without web security. I didn't get any errors, but it is still not finding the existing report and returning it. I uncommented esriConfig.defaults.io.corsEnabledServers.push("ourserver.com") and nothing changed. I'm still getting the error "Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access." What I don't understand is why it needs an Access-Control-Allow-Origin header on an existing element on our web server (the PDF), but it has no problem returning the new PDF that is generated on the same server?
The new PDF generated from ArcGIS Server is accessed through the ArcGIS WebAdaptor (I guess), so it comes with the right header, just because the WebAdaptor was adding the "Access-Control-Allow-Origin" to the header by default. Or the ArcGIS Server itself, doesn't matter.
But the PDF you are providing through "your server" does not write such header.
You have to add the custom header to the endpoint is providing your PDF. If you have a web.config, just add the following statement:
<system.webServer>
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
</customHeaders>
</httpProtocol>
<system.webServer>
I hope it helps.
That was one of the first things I tried. It didn't work.
But you got the following message "The 'Access-Control-Allow-Origin' header contains multiple values 'null, *', but only one is allowed. Origin 'null' is therefore not allowed access." because probably the custom header was added from 2 different points.
We need to summarise all the things, if not we'll lost the focus:
I added the custom header to the server (IIS 8 Manager > default website > HTTP response headers). I still get "The 'Access-Control-Allow-Origin' header contains multiple values 'null, *', but only one is allowed. Origin 'null' is therefore not allowed access." I removed the custom header from every web.config file I could find (There are three: C://webroot/DotNet/Web.config, C://webroot/resource-proxy-master/DotNet/Web.config, C://webroot/arcgis/Web.config). I still get the error. The only thing that works is the public JS CORS API I found at cors-anywhere.herokuapp.com. That server is not always available, though. I need to get this figured out before our website is live. Should I contact ESRI support?
Here is the CORS anywhere function. Could I set something like this up on our own server?
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);
};
})();
I think I just figured it out. The arcgis server under our default site in IIS had the custom header, even though I had commented it out in the arcgis Web.config file! I removed the custom header from there and added it to the default site, and I'm not getting any errors. I'll keep testing but I think it works.
Thanks a lot. This information has helped to resolve the issue.
I'm thinking your solution might be something we want to try with our similar issue, but I just wanted to clarify something: Is "arcgis" the name of your web adaptor? I'm still learning by feel when it comes to IIS and CORS and the whole nine yards.
Yes, the default web adapter that's created during the ArcGIS Web Adapter install is called "arcgis." You can name it whatever you want to.