[GIS] How to protect the loaded json file name and location using html5 and javascript

geojsonhtml5javascriptjsonleaflet

The data of markers (not the map) is stored in a json/csv/js file. We want to show all data as markers on the map. But how to protect the raw data file from public access?

Following the example on leaflet website, the name and location of the data file is currently visible as plain text in the index.html. Any people can download them after viewing the source code of the html.

Is there any way to secure our raw data from public access?

for example, by encoding the file name and location and there is no way to decode it?

Or use some authorization method, tokenization, oAuth, RestFul API?

Or using PHP instead of html?

Any tips and suggestions are greatly welcome!

Best Answer

Remember that JavaScript runs on the client's machine, under their control. They are allowed to set breakpoints and inspect variables at run time on their own machine. You can minify and obfuscate JavaScript, but Chrome DevTools has a one-click pretty-format button to partially undo the minification enough to make breakpoints work effectively.

Long story short, if you give the raw data to the client machine, then you've given away the raw data, and you've done so using the client's own network infrastructure.

One alternative is you can "bake" the data into rasterized symbols embedded in the imagery on the server. For example I recently saw a CartoDB Cesium demo where the points of interest were burned into the imagery layers, so the client does not handle the raw lat/lon data directly. Getting back the raw points requires much more effort, sifting through high-res image tiles and some sort of image recognition, so this might be a way to keep the exact numeric values more confidential.

Related Question