javascript - 当 API 不允许 Access-Control-Allow-Origin 时该怎么办

Question

我对所有这些同源策略都快发疯了。

当我尝试向 Google Maps API 发出请求时，我没有遇到任何问题:

var jsonData = $.ajax({
        url:"http://maps.googleapis.com/maps/api/geocode/json?address=",
        dataType:"json",
        async:true,
        success: function(json){...}
}

我认为这是因为 Google Maps API 允许 Access-Control-Allow-Origin。但是，当我尝试使用 openls.geog.uni-heidelberg.de API 时，出现跨域错误:

var xmlData = $.ajax({
              type: "GET",
              url:"http://openls.geog.uni-heidelberg.de/route?"
              //dataType:"jsonp xml",
              dataType: "xml",
              async:true,
              crossDomain : true,
              success: function(xml){...}
}

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not allowed access.

我想我不明白的是，如果 openls API 不允许跨域，为什么可以直接从我的浏览器发出请求，只需键入 url，如:

http://openls.geog.uni-heidelberg.de/route?start=9.256506,49.240011&end=8.72083,49.7606&via=&lang=de&distunit=KM&routepref=Bicycle&weighting=Shortest&avoidAreas=&useTMC=false&noMotorways=false&noTollways=false&noUnpavedroads=false&noSteps=false&noFerries=false&instructions=false

但是我不能用 jquery 来做。我也尝试过 jsonp 解决方案，但它不适用于 xml。

知道发生了什么事吗？

Answer 1

我在本地运行的两个项目(Angular 应用程序和 Node.JS Web 服务)的交互引起的 CORS 问题上苦苦挣扎了太久

看看简短的简单解决方法:Chrome 的插件 AllowControlAllowOrigin。

https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi

只需将单选按钮从红色切换为绿色，就不会再有阻塞的请求、错误或警告! 我希望它能与您的 API 一起使用，当然它不是永久性解决方案，但这是避免在那些烦人的反复出现的问题上浪费时间的好方法。