Search code examples
javascriptrazor-pagesazure-maps

can't load geojson file into azure maps using javascript, but gives 404 error


I am attempting to load a geojson file in azure maps, I am building a standard razor pages web app in visual studio. The geojson files are in a folder called 'data', but when I try to load the files I get a 404 error, but I can't seem to figure out how I can figure out where the files are put when building and running the server. According to the error it's trying to load 'https://localhost:7128/data/file0.geojson' I have attached some screenshots to show my current setupfile structurefunction loads file into maps

I have tried to move the folder to different locations, tried different syntaxes for the file url, all with the same result, a 404 error. I also tried to load the file using the full local folder and file name, but that gave me an error saying that it's not allowed to load local files


Solution

  • Aside from possibly not having the right path, I suspect the issue may be with the .geojson extension. Try changing it to .json and see if it works. If it does, then the issue is that you need to allow the .geojson extension to be served from your app. You can do this:

    // Set up custom content types - associating file extension to MIME type
    var provider = new FileExtensionContentTypeProvider();
    
    // Add new mappings
    provider.Mappings[".geojson"] = "application/json";
    
    app.UseStaticFiles(new StaticFileOptions
    {
        ContentTypeProvider = provider
    });
    

    If changing to .json didn't work, then you either have an incorrect path or need to allow your app to serve static files: https://learn.microsoft.com/en-us/aspnet/core/fundamentals/static-files?view=aspnetcore-7.0