如何使用 openlayers 的本地路径添加 geojson 文件？答案

【问题标题】：How can i add a geojson file using it's local path with openlayers?如何使用 openlayers 的本地路径添加 geojson 文件？
【发布时间】：2019-01-04 14:38:14
【问题描述】：

我想使用 openlayers 将本地 geojson 加载到我的地图。

这是我目前拥有的：

var gjsonFile = new ol.layer.Vector({
source: new ol.source.Vector({
format: new ol.format.GeoJSON({
}),
url: './data/geojson/plan.geojson'
})
});

map.addLayer(gjsonFile);

但是什么都没有显示，我得到这个错误：

Uncaught SyntaxError: Unexpected token < in JSON at position 2

有人有解决办法吗？

注意。我试过这个网址： https://c.data.osmbuildings.org/0.2/anonymous/tile/15/17607/10743.json 它有效，所以我的本地路径有问题。

【问题讨论】：

可能错误出在您本地 json 的内容中，而不是由于路径。如果您下载 10743.json 的副本然后将其复制到本地路径并使用 url: './data/geojson/10743.json' 会发生什么？
是的，我已经这样做了，但是我在我的问题中遇到了上面提到的相同错误。
将 10743.json 的副本复制到我的本地主机上，然后读取它对我有用，因此您的服务器上可能存在 MIME 类型配置问题。您可以直接从浏览器地址栏访问您的数据吗？例如http://yourdomain/data/geojson/plan.geojson
是的，我认为这是问题所在，因为我无法通过浏览器访问我的数据。
如果您使用的是 Windows localhost，请转到计算机管理、服务和应用程序、IIS，然后从选项中选择 MIME 类型并添加扩展名 .geojson 类型 application/json 其他服务器类型我已经使用不需要任何特殊设置。

标签： geojson openlayers-3

【解决方案1】：

你可以使用require从你的localhost目录读取一个json文件，使用(new GeoJSON()).readFeatures读取json对象。在这里参考答案https://stackoverflow.com/a/61948057/13594097

【讨论】：