将数据从geojson文件加载到mapbox映射时出现问题

Question

我使用此代码将geojson文件中的数据加载到此mapbox地图：

var mapTooltips = L.mapbox.map('map-tooltips', 'mapbox.streets')
  .setView([54.00366,-2.547855], 6);

  var featureLayer = L.mapbox.featureLayer()
    .loadURL('https://www.mapbox.com/mapbox.js/assets/data/stations.geojson')
    .addTo(mapTooltips);

问题：

将地图框中的此网址用作测试，标记会完美地显示在地图上

https://www.mapbox.com/mapbox.js/assets/data/stations.geojson

但是当我使用相同的文件但是来自另一台服务器时，例如：

https://s3.amazonaws.com/web-app-cdata/MapaFel/stations.geojson

标记不显示，不起作用。

使用地图框链接：

使用S3链接：

我想提一下，S3链接有完全访问权限。理论上可以访问任何人

有什么想法吗？

Answer 1

默认情况下，不允许从外部域加载资源（例如geojson文件）。这被称为制作cross-origin HTTP request。

因此，当mapbox-gl尝试从S3实例加载geojson文件（jsfiddle）时，会出现错误：

  

XMLHttpRequest无法加载https://s3.amazonaws.com/web-app-cdata/MapaFel/stations.geojson。没有   请求中存在“Access-Control-Allow-Origin”标头   资源。

您可以从地图箱服务器加载相同的geojson，因为Mapbox已明确允许此类跨源请求，方法是指定响应标头：Access-Control-Allow-Origin: *

作为explained here：

  

“服务器以Access-Control-Allow-Origin响应：*表示   跨站点中的任何域都可以访问该资源   方式。 “