CORS Help!!

1162
4
Jump to solution
03-13-2017 07:49 AM
LloydBronn
Occasional Contributor II

I have a GP service that generates a PDF report in reportlab based on a country clicked on a web map. I've placed the HTML/Javascript document on our web server for testing, and it's working (although we can only generate one report at a time, but that is a separate issue). I've tried to place this code in an HTML widget on our website and test it, and I keep getting the "XMLHttpRequest cannot load  No 'Access-Control-Allow-Origin' header is present on the requested resource." I've tried to follow every thread I've found on this (there are dozens) and added " <add name="Access-Control-Allow-Origin" value="*" />" to the web config files on our proxy server and the arcgis web config in the wwwroot. I'm still getting this error when I run the tool. We have two other pages on our website that use a GP tool to generate charts and these pages do not throw up this error. I'm not sure how to get this working. 

0 Kudos
1 Solution

Accepted Solutions
LloydBronn
Occasional Contributor II

Just found this public CORS solution. I dropped this into the JavaScript and it works.

 (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);
};
})();

View solution in original post

0 Kudos
4 Replies
LloydBronn
Occasional Contributor II

Still trying to figure this out. I've added this to different web config files, but it hasn't helped. I'm not sure which web.config file to alter. There are three different ones in our wwwroot folder. 

<customHeaders>  
        <add name="Access-Control-Allow-Origin" value="*" />  
        <add name="Access-Control-Allow-Headers" value="*" />  
        <add name="Access-Control-Allow-Methods" value="*" />  
</customHeaders> 
0 Kudos
LloydBronn
Occasional Contributor II

Just found this public CORS solution. I dropped this into the JavaScript and it works.

 (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);
};
})();
0 Kudos
RandallWilliams
Esri Regular Contributor

Hmmm...personally, I wouldn't do this in PROD. If you have to, I'd download and host this API in house in your shop. Most current web servers set CORS headers by default. I'd set those headers in the web.config on the root of your web server.

"

A public demo of CORS Anywhere is available at https://cors-anywhere.herokuapp.com. This server is only provided so that you can easily and quickly try out CORS Anywhere. To ensure that the service stays available to everyone, the number of requests per period is limited, except for requests from some explicitly whitelisted origins.

If you expect lots of traffic, please host your own instance of CORS Anywhere, and make sure that the CORS Anywhere server only whitelists your site to prevent others from using your instance of CORS Anywhere as an open proxy."

0 Kudos
LloydBronn
Occasional Contributor II

I set the headers in our web.config and still got those errors. 

0 Kudos