1

I am using Leaflet 1.4.0 and a beginner with Leaflet and JavaScript.

I try to display shapefile data on my webmap with Leaflet. But it doesn't work. All the data (.shp, index.html... ) in WGS84 are on my computer, in the same directory.

My JavaScript code is:

var shapeLayer = new L.Shapefile("data/QualiAgro.zip");

I get the following Console message:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://some-url-here. (Reason: additional information here).

If I understood this is a CORS problem (url). But I don't know how to do? Does any one have any idea?

I also try the shapefile data with: http://leaflet.calvinmetcalf.com/#3/32.69/10.55 There's no display.

I have installed "Wampserver2" on my computer to run my html from a local server.
I changed the JavaScript code :

    var shapeLayer = new L.Shapefile("http//localhost:80/data/QualiAgro.zip");

But I still have the same problem with no message Console for the mistake.

Improve this question
2
  • I recommend abandoning the shp altogether. Put the shp in postgres and use one of the many middleware options and pull it in through leaflet
    – ziggy
    Jul 18, 2022 at 11:39
  • you can also convert the shp to geojson and there are a few ways to avoid the CORs problem
    – ziggy
    Jul 18, 2022 at 11:40

1 Answer 1

Reset to default
0

Open command line and navigate to the folder in where your project is, and then run this command: python3 -m http.server

This may solve your problem as mentioned in the comments.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.