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

时间:2015-10-05 10:36:49

标签: javascript jquery xmlhttprequest cors same-origin-policy

我对所有这些同源政策的事情感到疯狂。

当我尝试向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){...}
}
  

请求的资源上没有“Access-Control-Allow-Origin”标头。因此,不允许原点“http://localhost”访问。

有人认为我不明白的是,如果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一起使用。

了解发生了什么?

1 个答案:

答案 0 :(得分:3)

由于本地运行的两个项目(Angular App和Node.JS Webservices)的交互引起的CORS问题,我一直在努力工作太长时间

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

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

只需将单选按钮从红色切换为绿色,不再阻止请求,错误或警告! 我希望它能与你的API一起使用,当然它不是一个永久性的解决方案,但这是避免在那些烦人的经常性问题上浪费时间的好方法。