topic Re: CORS issue with WebTileLayer in ArcGIS JavaScript Maps SDK Questions

CORS issue with WebTileLayer

MatthieuThery3 — Thu, 19 Sep 2019 09:13:50 GMT

Hi,

I'm trying to add a layer to my webmap using WebTileLayer and am getting a CORS error message.

Our domain is being

Our server is CORS enabled. I tried to add the url to the trusted servers. I tried adding the Tile Layer using leaflet and it works ok. I tried doing it in the API sandbox, I'm getting CORS messages as well.

Here is the urlTemplate: https://{subDomain}.tiles.openrailwaymap.org/standard/{level}/{col}/{row}.png

Any ideas?

Re: CORS issue with WebTileLayer

RobertScheitlin__GISP — Thu, 19 Sep 2019 12:48:04 GMT

Matthieu,

When you added it to your trusted servers how specific were you with the url? Less specific is preferable i.e. "https://*.tiles.openrailwaysmap.org"

Re: CORS issue with WebTileLayer

MatthieuThery3 — Thu, 19 Sep 2019 12:59:17 GMT

Robert,

Yes I litteraly did that (still not working) :

esriConfig.request.trustedServers.push("https://www.openrailwaymap.org/");

esriConfig.request.trustedServers.push("https://a.tiles.openrailwaymap.org/");

esriConfig.request.trustedServers.push("https://b.tiles.openrailwaymap.org/");

esriConfig.request.trustedServers.push("https://c.tiles.openrailwaymap.org/");

esriConfig.request.trustedServers.push("https://*.tiles.openrailwaymap.org/");

Re: CORS issue with WebTileLayer

RobertScheitlin__GISP — Thu, 19 Sep 2019 13:12:53 GMT

have you watched the network traffic in your browsers developer tools and ensured it is not trying to use http urls instead of https?

Re: CORS issue with WebTileLayer

MatthieuThery3 — Thu, 19 Sep 2019 13:20:25 GMT

Yes it looks fine, it's using https.

When replacing the url in the sandbox with that railway one (ArcGIS API for JavaScript Sandbox) it seems to throw the same sort of errors.

Re: CORS issue with WebTileLayer

RobertScheitlin__GISP — Thu, 19 Sep 2019 13:30:05 GMT

It sounds like it could be a bug.

Re: CORS issue with WebTileLayer

UndralBatsukh — Thu, 19 Sep 2019 18:02:47 GMT

Hi there,

It looks like Access-Control-Allow-Origin is missing from the response header as the errors indicate. This header must be included in all valid CORS responses; omitting the header will cause the CORS request to fail. Please refer to this document for more explanation.

-Undral

Re: CORS issue with WebTileLayer

VictorTey — Sun, 22 Sep 2019 13:28:12 GMT

Matthieu Thery‌, with all CORS error, the way to debug your issue is to look at the preflight request. If you look at your network traffic, there is a OPTION request. look at your request header and then the response header and compare. It will tell you what is missing and what is causing your CORS error. If you take a screenshot, I am happy to assist.

Re: CORS issue with WebTileLayer

MatthieuThery3 — Mon, 23 Sep 2019 08:46:24 GMT

Hi, Thanks for helping. Having a look at my network traffic, that is the only thing I get:

I can't see any response headers.

Re: CORS issue with WebTileLayer

VictorTey — Mon, 23 Sep 2019 10:56:50 GMT

Hi I am doing this on my mobile phone so I can only search for a example online.

See screenshot below. Request method of type options. There should be a response header and a request header. This is a preflight request

Re: CORS issue with WebTileLayer

VictorTey — Mon, 23 Sep 2019 10:59:14 GMT

The response header contain what the setting on your server is and the request header shows what is being send. They have to match up to avoid CORS error

Hi I am doing this on my mobile phone so I can only search for a example online.

See screenshot below. Request method of type options. There should be a response header and a request header. This is a preflight request

<image1.png>

Re: CORS issue with WebTileLayer

MatthieuThery3 — Mon, 23 Sep 2019 11:14:54 GMT

Sorry I must be doing something wrong, but I don't have any OPTIONS request in my network tab. They're all GET. I tried in every browser.

Re: CORS issue with WebTileLayer

VictorTey — Mon, 23 Sep 2019 11:50:14 GMT

It should be initiated at the beginning before all the actual request.

Re: CORS issue with WebTileLayer

MatthieuThery3 — Mon, 23 Sep 2019 12:16:18 GMT

Can't see it. As an example can you see it in the esri sandbox url I posted above?

Re: CORS issue with WebTileLayer

VictorTey — Mon, 23 Sep 2019 12:26:51 GMT

Hi, if you keep the network tab open and click on f5 to refresh. Then you right click to save as har file, I can have a look.

Re: CORS issue with WebTileLayer

MatthieuThery3 — Mon, 23 Sep 2019 12:43:00 GMT

There it is.

Re: CORS issue with WebTileLayer

VictorTey — Mon, 23 Sep 2019 14:05:30 GMT

Hi, looks like it didn't send the preflight request as it is a simple request. I am stumped sorry

Re: CORS issue with WebTileLayer

ReneRubalcava — Mon, 23 Sep 2019 16:08:00 GMT

I don't think cors is enabled on the server. I tried a few different ways.

I tried testing with this site https://www.test-cors.org/#?client_method=GET&client_credentials=false&server_url=https%3A%2F%2Fb.tiles.openrailwaymap.o…

But I'm not getting back any response headers for access-control.

I would expect to see something like this.

https://www.test-cors.org/#?client_method=GET&client_credentials=false&server_url=https%3A%2F%2Fstamen-tiles-a.a.ssl.fastly.net%2Fterrain%2F0%2F0%2F0.png&server_enable=true&server_status=200&server_credentials=false&server_tabs=remote

Re: CORS issue with WebTileLayer

MatthieuThery3 — Mon, 23 Sep 2019 16:19:26 GMT

They do say that their API allows CORS (although maybe not for the tiles): OpenRailwayMap/API - OpenStreetMap Wiki

It did work using Leaflet. Maybe they're just not allowing arcgis somehow.

Re: CORS issue with WebTileLayer

ReneRubalcava — Mon, 23 Sep 2019 18:18:13 GMT

It's the WebGL rendering of the 4x API. WebGL requires CORS, and although that doc says it supports it, I don't think it's working. You could probably get around this with a proxy if you really need it.

This works in 3x https://codepen.io/odoe/pen/bGbzwvz?editors=1000 because 3x isn't fully WebGL