如何使用隐藏数据创建地图布局？答案

【问题标题】：How to create a map layout with hidden data?如何使用隐藏数据创建地图布局？
【发布时间】：2020-02-03 09:27:30
【问题描述】：

我为个人项目创建了一个 API，它返回一些 GeoJSON 数据。

目前，这些数据基本上是返回给客户端显示在地图上。但是，客户端（显然）可以完全访问返回的数据，并且它必须自己实现必要的 Javascript 才能显示它。

类似：

$.ajax({
    url: "url/to/my/api",
    type: "POST",
    data: JSON.stringify({ /* some parameters */ }),
    contentType: 'application/json',
}).done(function(data) {
    data.addTo(map); 
    //data contains all the geo-coordinates, visible in browser console, that I'd like to hide
});

问题：有没有什么办法可以“混淆”数据，让客户在地图上显示，但剥夺他查看数据的权利？

例如，Google Maps API 实现了一些traffic layer，我们无法查看构成地铁线路的数据，只需显示即可：

var transitLayer = new google.maps.TransitLayer();
transitLayer.setMap(map);

如何实现类似的东西，将返回的数据“隐藏”给客户端，让他可以在地图上显示它？

谢谢

【问题讨论】：

地图需要哪些属性（或属性类型），而您不想与客户端共享？
实际上，我只是希望我的客户在他们的地图上添加一个包含我的数据的图层，但我不希望他们可以访问（即使在浏览器的控制台中）这些数据。我的 API 返回的数据是一堆 lat/lng，我想将它们保密。与我在原始问题中引用的 Google 传输层完全相同。

标签： javascript api maps geojson data-layers

【解决方案1】：

Gmaps 不会将任何交通数据“返回”给客户端 - 只要您将 transitLayer 设置为地图实例，它就会重新生成图像图块：

对比

有很多（地理）JSON uglifiers/obfuscators，其中最简单的可能是后端的 base64 编码（技术上只是一个微不足道的视觉混淆器），然后在前端使用 atob 解码。

示例： {"type":"FeatureCollection","features":[]} b64 编码为 eyJ0eXBlIjoiRmVhdHVyZUNvbGxlY3Rpb24iLCJmZWF0dXJlcyI6W119。但请注意，周围的每个人都会看穿这个......

在您考虑混淆之前，请确保您的 API 端点是安全的并具有正确的 CORS 标头。其次，您可能想要跟踪谁访问了您的 API 以及何时访问。

之后，这变成了一个密码问题，而不是 geojson 问题！

【讨论】：

嘿，谢谢你的回答，我不知道谷歌地图在设置transitLayer 时会重新生成图像图块，我现在不明白为什么我无法访问他们的地铁线路数据。我认为我的 API 端点是安全的，并且我有适当的 CORS 标头。我还跟踪谁访问了我的 API 以及何时访问，但似乎无论我实现什么，我的数据都可以在客户端解密......

【解决方案2】：

您无法实现浏览器和 JS 使用的任何内容的绝对安全性。不管你对数据的编码多么困难，它必须在 JS 地图渲染引擎能够使用它之前进行解码，这就是任何对它感兴趣的人都会截获它的地方。

可能唯一可靠的方法是让您的 API 为您的客户放置在其地图上的预制图像叠加层提供服务。如果是 GMap，他们可以使用 custom overlays。

【讨论】：

这就是我担心的......我不知道自定义叠加层，我要看看它，谢谢你的信息