|
Hello, As a developper, I now have to work on an existing application with a setup of leaflet using OSM that is already in place. The application is displaying a map on a page (client side application using Angular). If I deploy the code somewhere, the map is working fine. But during the development phase, the project runs in local (served on localhost:4200). But in local the map does not load and I can see many calls failing in the network tab of the debugger. I can see that the app can't load tiles because it gets an HTTP 403 forbidden as a reponse. Below you can find a example of a call done for a tile that is failing: curl 'https://a.tile.openstreetmap.org/18/134243/87922.png' \ After some more investigation I found that in local it works on Safari but not on Chrome. So the problem seems to come from headers added by the browser. UPDATE 1: I have the impression that OSM is validating those 2 headers: referer and user-agent
Chrome Safari Do you think this is a normal behavior ? If OSM need one of those 2 headers to be validated on the server side, I'm not getting why it does not reconize Chrome user-agent as a valid one. Am I missing something ?
showing 5 of 6
show 1 more comments
|
|
The answer from Pintosack works for me. Thanks! Maybe this will help someone else, for those using leaflet, we fixed it by changing http to https on the tileLayer png. Seems to work on localhost in Chrome & Edge. |
It's unclear exactly what you are trying to do and where localhost fits in?
Normally a leaflet map would use localhost if there are tiles being served locally. Do you believe that you are doing that?
I'm working on a projet as a developper. During the development phase, the project runs in local (served on localhost:4200). Leaflet is set up to have a map on a page. It works everywhere but not in local. After some investigation I saw that it's due to 2 headers: user-agent and/or referer. I added more details as an update in the original post. If something is not clear, please tell me and I'll add all the needed informations.
Now just look at the other side. The OWG has to try to block users that are not following the Tile Usage Policy and overusing the systems. The problem is: some of them just fake user-agent and referrer, therefore they'll have to block those combinations (right now it's maybe localhost as referrer + Chrome as User-Agent) that are used by bad actors, which might result in false positives while blocking, so this may happen anytime. Works today, stops tomorrow (the same would happen if e.g. Fastly would stop sponsoring their CDN resources for OSM). But please remember: the OWG is working on this voluntarily in their free time for the OSM project. So if the application is a project for work, it's best to find a reliable tile provider (when you pay someone money, you have someone to complain to if sth. is not working). If the project is just for fun, you may think about setting up your own tileserver (see https://www.switch2osm.org for a guide), which will cost time (and server resources=money) as well.
So is there a way to get localhost working or no? If so, what are the steps?
Thanks.
If the OWG blocks localhost right now, you can't do anything about but either not use localhost or use a different tile provider or host tiles yourself. The problem with localhost is that the OWG won't be able to distinguish your application. So be creative in making UA and Referrer unique and best include a way to contact you. See https://operations.osmfoundation.org/policies/tiles/ for more information.
Maybe this will help someone else, for those using leaflet, we fixed it by changing http to https on the tileLayer png. Seems to work on localhost in Chrome & Edge.