How to prevent browser from caching CORS domain?

1664
5
08-20-2019 06:27 AM
Highlighted
New Contributor

The internet is full of questions about CORS, and this is definitely another one of them.  Here's (what I think is fairly standard) situation, and the problem I'm facing.

CORS is set up and working properly in my web application, and on the external ArcGIS servers which provide the basemaps and data it uses.  However, there's an issue which plagues developers and testers:

If I'm developing/testing on devserver.com and my browser makes a CORS request out to basemaps.com, everything works fine.  If I then go to prodserver.com in another browser tab and bring up the application, a CORS request is sent out and denied with the "Access to XMLHttpRequest at 'basemaps.com/arcgis...' from origin 'https://devserver.com' has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header has a value 'https://prodserver.com' that is not equal to the supplied origin.

Clearly some caching is happening in the browser, where it's sending the wrong (previous devserver.com) domain out in the request so the external ArcGIS server is (correctly) rejecting it, but no amount of googling / stack-overflowing / etc. has led me to anything approaching a solution to this problem. I don't know how to stop the caching, or inject something into the request to prevent it, or anything.  I feel like this has to be a common problem among folks developing webapps using the ArcGIS Javascript API. I have my local development server, a test server, and a production server, and this issue has been nagging at me for years.

If anyone has any insight into a possible solution for this problem, it would be greatly appreciated!  This is my white whale.

Tags (1)
5 Replies
Highlighted
Occasional Contributor II

I can't speak onto your particular issue, but I use a Chrome extension during development that removes the headache: Allow-Control-Allow-Origin: * - Chrome Web Store 

Highlighted
New Contributor II

I've got the same problem but not on dev/prod servers. We've got situation with ArcGIS Enterprise 10.6.1 and WebAdaptors on Tomcat when on first server is deployed app and on second server is another app. These apps have same layer (service from the same ArcGIS Server). When I try to get map from fist app, there's no problem, when I get request from second app, app gets CORS error.

Reply
0 Kudos
Highlighted
Occasional Contributor II

Hi,

Can you provide the exact error you are getting? This is likely an issue with the HTTP headers of one of the servers. I would check to see if the headers are different between the two.

Also, is one app hosted on the same server as the service? That would eliminate any cross origin requests which might be why one is working.

Highlighted
New Contributor

Hi,

I also have the same problem !

In one case, I have a page hosted on the GIS server and another on a server outside of GIS infrastructure. Below the steps to reproduce my problem :

Thanks for your feedback

Chris

Reply
0 Kudos
Highlighted
Occasional Contributor II

Hi Chris,

I was able to reproduce the issue on my end with the following error:

Access to image at 'https://sig.nanterre.fr/ags/rest/services/Adresse_Voie/MapServer/export?bbox=631714.6775547416%2C6859217.652993829%2C651746.8509524217%2C6874474.61684109&bboxSR=102110&imageSR=102110&size=1183%2C901&dpi=96&format=png32&transparent=true&layers=show%3A-1&f=image' from origin 'https://www.nanterre.fr' has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header has a value 'https://sig.nanterre.fr' that is not equal to the supplied origin.

The issue seems to be the browser switching from the origin www.nanterre.fr to sig.nanterre.fr and then back. The easiest fix without digging too deep would be to change the Access-Control-Allow-Origin header from the origin https://www.nanterre.fr to *

Reply
0 Kudos