克服简单 web 地图站点中的访问控制允许来源

Question

我正在尝试建立一个简单的网页，该网页将使用一些 openstreetmap 数据绘制地图。我现在在本地机器的端口 8000 上使用（python）simpleHTTPserver 为该页面提供服务。

在我的页面中，我运行一个向 openstreetmap.org 发送 AJAX 请求的脚本：

$(document).ready(function() {
    console.log ("Document is loaded.");

    var map = L.mapbox.map('mapsection', 'examples.map-vyofok3q');

    $.ajax({
      url: "http://www.openstreetmap.org/api/0.6/way/252570871/full",
      dataType: "xml",
      success: function (xml) {
        var layer = new L.OSM.DataLayer(xml).addTo(map);
        map.fitBounds(layer.getBounds());
      }
    }); // end ajax
});

（L. 指的是我包含的 Leaflet javascript 库。）我遇到了同源策略错误的问题。 Chrome 说：“XMLHttpRequest 无法加载 http://www.openstreetmap.org/api/0.6/way/252570871/full。请求的资源上没有 'Access-Control-Allow-Origin' 标头。因此不允许访问 Origin 'null'。”

在本地提供 HTTP 服务时，我遵循了一个有希望的 SO 答案 Can I set a header with python's SimpleHTTPServer? 的建议，所以我运行了 $ python ajax-allower.py 其中 ajax-allower.py 包含以下代码。你能解释为什么我仍然会收到错误，并建议我如何解决它吗？

#!/usr/bin/env python
# runs the simple HTTP server while setting Access-Control-Allow-Origin
# so that AJAX requests can be made.
import SimpleHTTPServer

class MyHTTPRequestHandler(SimpleHTTPServer.SimpleHTTPRequestHandler):
    def end_headers(self):
        self.send_my_headers()

        SimpleHTTPServer.SimpleHTTPRequestHandler.end_headers(self)

    def send_my_headers(self):
        self.send_header("Access-Control-Allow-Origin", "http://www.openstreetmap.org")
        #self.send_header("Access-Control-Allow-Origin", "*")


if __name__ == '__main__':
    SimpleHTTPServer.test(HandlerClass=MyHTTPRequestHandler)

Answer 1

ajax 请求失败，因为有问题的对象是deleted。

如果您尝试使用仍然存在的对象（例如http://www.openstreetmap.org/api/0.6/way/666/full），您的 jQuery 代码应该可以完美运行。或者，如果您获取已删除对象的完整历史记录 (http://www.openstreetmap.org/api/0.6/way/252570871/history)，但我想这可能不是您真正想要的。

应该说，API 可能还应该为失败的（HTTP 410 Gone）请求发送 CORS 标头，以便您的客户端可以检测到错误代码。这看起来像是一个应该报告的错误on github。