1

我浏览了大多数 CORS 和 JSON 请求主题,无法理解为什么第一个脚本有效,而第二个则不行。我很想接受有关 CORS 和 Javascript 以及 XMLHTTPRequest2 和 AJAX 的教育。

这有效:

function wfs() {
 var url = 'http://routes.cloudmade.com/8ee2a50541944fb9bcedded5165f09d9/api/0.3/51.22545,4.40730,%5B51.22,4.41,51.2,4.41%5D,51.23,4.42/car.js?lang=de&units=miles&callback=getRoute';
 var script = document.createElement('script');
 script.type="text/javascript";
 script.src=url;
 document.getElementsByTagName('head')[0].appendChild(script);
}

function getRoute(response) {
 console.log(response);
}

这不起作用:

function wfs() {
 var url = 'http://routes.cloudmade.com/8ee2a50541944fb9bcedded5165f09d9/api/0.3/51.22545,4.40730,%5B51.22,4.41,51.2,4.41%5D,51.23,4.42/car.js?lang=de&units=miles';
 var xhr = new XMLHttpRequest();
 xhr.open('GET', url, true);
 xhr.onload = function(e) {
  if (this.status == 200) {
    var json = this.response;
    console.log(json);
  }
 };

 xhr.send();
}

Firebug 显示红色 200 空响应。

但是,当我使用不同的 url 时,第二个脚本确实有效:

var url = 'http://ip.jsontest.com/?mime=2';
4

1 回答 1

2

第一个域http://routes.cloudmade.com/8ee2a50541944fb9bcedded5165f09d9/api/0.3/51.22545,4.40730,%5B51.22,4.41,51.2,4.41%5D,51.23,4.42/car.js?lang=de&units=miles没有实现 CORS(即不发送可用的Access-Control-Allow-Origin标头)。 http://ip.jsontest.com/?mime=2做。您对此无能为力——这取决于服务器。

第一个代码块使用 JSONP。这实际上是在文档中注入一个脚本标签。脚本标签可以有外部来源(如果它们不是相同的方案,出于安全原因,它们可能会被阻止)。这允许服务器基本上向您发送您插入到<script>立即运行的 JavaScript 代码。

于 2013-11-06T19:46:40.207 回答