openlayers - OpenLayers 6：示例框选择错误

Question

完全按照以下 openlayers 站点的示例：

https://openlayers.org/en/latest/examples/box-selection.html?q=feature

在本地我有以下错误：

Uncaught SyntaxError: Unexpected token <in JSON at position 0
    at JSON.parse (<anonymous>)
    at getObject (JSONFeature.js: 197)
    at GeoJSON.JSONFeature.readFeatures (JSONFeature.js: 53)
    at VectorSource. <anonymous> (featureloader.js: 94)

我相信错误来自尝试在本地加载 geojson 文件。

var vectorSource = new VectorSource ({
  url: 'data/geojson/countries.geojson',
  format: new GeoJSON ()
});

country.geojson: https://r68tk.csb.app/data/geojson/countries.geojson

怎么解决？

Answer 1

我找到了解决方案。

在 OpenLayers 中开发应用程序的过程中，不幸的是，由于CORS在本地加载文件（geojson、png 等）存在问题。

问题：

关于这个主题的优秀文章在这里。

为了解决这个问题，我使用了名为“ moesif CORS 扩展”的 Chrome 扩展。

启用它后，我可以轻松加载 .geojson 文件。

这是成功的！

在此地址还有更多方法可以为您的开发环境停止 CORS：https ://medium.com/@dtkatz/3-ways-to-fix-the-cors-error-and-how-access-control-allow -origin-works-d97d55946d9

我希望对这些信息有所帮助！