CORS error on Leaflet

  • Hi, Using the following Leaflet implementation I am getting CORB cors errors, what do I need to get this working in development environment ?

    L.tileLayer(`https://api.wikiocity.com/r/vector/en/{z}/{x}/{y}.pbf?key=${apiKey}`, {

    attribution: '© Wikiocity © OpenStreetMap contributors',

    style: 'https://api.wikiocity.com/style/wikiocity-mgl-style.json',

    }).addTo(map);

  • Hey sfaulkner, are you using the leaflet-maplibre-gl library as shown in [Vector Map Tutorial] under the Leaflet tab at the top? Leaflet only works with Raster tiles last time I checked, but that tutorial will show you how to get it working with Vector tiles. For Raster tiles in Leaflet, you will need to add "crossOrigin: true" as shown in the leaflet section of the [Raster Map Tutorial].

    If you don't already have Leaflet specific code written, I highly recommend switching to Maplibre-GL-JS. We have a fully built library that will make most basic functions a lot easier to get working. I've also enabled a free trial on your account while we continue to work our way out of beta. This will let you play around with raster maps as well. Do let me know if you're still having problems though.

    We're currently finishing an update that will include 120+ million more buildings and 450+ million more street addressses. After that, we should be opening up the option to upgrade. Thanks!

  • Update:

    This setting should no longer be needed. If you are still having issues with Cross origin requests, please let us know.

Register or Login to Post