Question

我目前正在尝试使用Mapbox示例，尤其是this one。当示例尝试从以下代码中获取GeoJSON点时：

map.addSource("earthquakes", {
    type: "geojson",
    // Point to GeoJSON data. This example visualizes all M1.0+ earthquakes
    // from 12/22/15 to 1/21/16 as logged by USGS' Earthquake hazards program.
    data: "https://www.mapbox.com/mapbox-gl-js/assets/earthquakes.geojson",
    cluster: true,
    clusterMaxZoom: 15, // Max zoom to cluster points on
    clusterRadius: 20 // Use small cluster radius for the heatmap look
});

我收到以下错误：

阻止跨源请求：＆＃34;同源＆＃34;政策没有允许您查看位于的远程资源 https://www.mapbox.com/mapbox-gl-js/assets/earthquakes.geojson。原因：CORS＆＃34; Access-Control-Allow-Origin＆＃34;标头丢失了。

我在http header中看到了类似的问题，但是如何在这里添加？

Answer 1

这取决于mapbox。他们的服务器说政策不允许您查询的来源（选项请求中的检查标题）。由于他们的政策不支持Access-Control-Allow-Origin标头，因此XHR向mapbox.com 发出的任何请求必须来自mapbox.com。

现在你可以想象通过在本地虚拟机上使用代理服务器来假装你在mapbox.com上 - 使用HaProxy container，例如， Virtual Box - 在其配置中设置ACL，将某些请求指向mapbox.com到您的代码，其余请求指向mapbox.com的IP地址。然后，您将使用/ etc / hosts将请求传递到您的VM，然后从那里处理它。这不是一个简单的解决方案，我只是认为值得指出它是可能的。

Mapbox：如何解决map.addSource（）中的CORS问题

1 个答案: