CORS issue with WebTileLayer

1947
20
Jump to solution
09-19-2019 02:13 AM
MatthieuThery3
New Contributor

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?

Tags (2)
0 Kudos
1 Solution

Accepted Solutions
ReneRubalcava
Frequent Contributor II

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

View solution in original post

20 Replies
RobertScheitlin__GISP
MVP Esteemed Contributor

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"

0 Kudos
MatthieuThery3
New Contributor

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/");
0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

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

0 Kudos
MatthieuThery3
New Contributor

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.

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

It sounds like it could be a bug.

0 Kudos
UndralBatsukh
Esri Regular Contributor

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

VictorTey
Esri Contributor

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.

0 Kudos
MatthieuThery3
New Contributor

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.

0 Kudos
VictorTey
Esri Contributor

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

0 Kudos