leaflet-geosearch - localhost blocked by CORS policy

84
1
Jump to solution
10-16-2020 12:26 PM
Highlighted
New Contributor

Hello, I would like to ask if anyone else is experiencing a CORS error when working with "EsriProvider" from "leaflet-geosearch" library. This error has been noticed very recently. It occurs when hosting a web application in a development environment on "localhost". The code which triggers the error is as follows: -

 

import { EsriProvider } from "leaflet-geosearch";
const myProvider = new EsriProvider();
const results = await myProvider.search({ query: event.target.value });

 

The error message in the browser console is :-

 

Access to fetch at 'http://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer/find?f=json&text=london' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

 

I would be grateful if someone could advise on how to resolve this error experienced, thanks for support.

Tags (2)
Reply
0 Kudos
1 Solution

Accepted Solutions
Highlighted
Occasional Contributor

Hi Ike,

leaflet-geosearch isn't part of Esri Leaflet. We do maintain our own Esri Leaflet Geocoder library GitHub - Esri/esri-leaflet-geocoder: helpers for using the ArcGIS World Geocoding Service in Leaflet .

It looks like leaflet-geosearch is trying to make a request to the HTTP endpoint instead of the HTTPS endpoint. Looking at their code up to their 2.5.1 version this would make an HTTP request since your localhost is HTTPS. leaflet-geosearch/esriProvider.js at v2.5.1 · smeijer/leaflet-geosearch · GitHub 

It looks like this is resolved at their latest 3.0.5 version though leaflet-geosearch/esriProvider.ts at v3.0.5 · smeijer/leaflet-geosearch · GitHub  and the request should always go to HTTPS. Can you try to upgrade to the latest version and see if that works.

Patrick

View solution in original post

1 Reply
Highlighted
Occasional Contributor

Hi Ike,

leaflet-geosearch isn't part of Esri Leaflet. We do maintain our own Esri Leaflet Geocoder library GitHub - Esri/esri-leaflet-geocoder: helpers for using the ArcGIS World Geocoding Service in Leaflet .

It looks like leaflet-geosearch is trying to make a request to the HTTP endpoint instead of the HTTPS endpoint. Looking at their code up to their 2.5.1 version this would make an HTTP request since your localhost is HTTPS. leaflet-geosearch/esriProvider.js at v2.5.1 · smeijer/leaflet-geosearch · GitHub 

It looks like this is resolved at their latest 3.0.5 version though leaflet-geosearch/esriProvider.ts at v3.0.5 · smeijer/leaflet-geosearch · GitHub  and the request should always go to HTTPS. Can you try to upgrade to the latest version and see if that works.

Patrick

View solution in original post