JQuery:读取服务器的JSON响应

Question

好吧，我有一段代码，

var record = new Object(); //var aData = {};でもOK  
record["deviceID"] = "123456"; //aData["name"] = "hoge"でもoK  
$.getJSON("http://192.168.2.10:8080/commapi/comaction/init", {record: JSON.stringify(record)},
function(objRes){  
    alert(objRes["response"]); //objRes["country"]でもok  
}); 

我只是做了一个简单的servlet，它简单地回复了我所放的deviceID。但我的问题是有一个错误

XMLHttpRequest cannot load http://192.168.2.10:8080/commapi/comaction/init?record=%7B%22deviceID%22%3A%22123456%22%7D. Origin file:// is not allowed by Access-Control-Allow-Origin.

我怎么才能解决这个问题？谢谢!

更新后的脚本我尝试使用JSONP，我得到的脚本如下所示

$(document).ready(function() {
  $("#ui-2").click(function(){
      getJSON("http://192.168.2.143:8080/commapi/comaction/init?record=%7B%  22deviceID%22%3A%22123456%22%7D&callback=loaded"); 
  });
};


function getJSON(url){
var s = document.createElement('script');
  s.setAttribute('src',url);
  document.getElementsByTagName('head')[0].appendChild(s);

  // Loading ..
  $("results").innerHTML = '<p>Loading &hellip;</p>'; 
};


function loaded(data) { 

var res = data.query.results.item;
var html = "";
var i =  0;
var y = res.length;

for(i; i<y; i++) { 
    alert(data.deviceID);
} 

};

但这是新的错误资源，被解释为脚本，但使用MIME类型的application/json传输。

Answer 1

我们不允许从Cross-site HTTP requests进行JavaScript操作。也就是说，您只允许向您自己的请求域发出AJAX请求。

只有在AJAX调用来自与http://192.168.2.10:8080/commapi/comaction/init相同的域时，才能成功地调用AJAX。

作为一种解决办法，这通常是由JSONP完成的，它将JavaScript callback function传递给位于页面上的JavaScript函数，并请求服务器用回调函数包装JSON数据的服务器。这是通过创建一个具有<script></script>属性的src标记作为AJAX url并附加到HTML来执行的。

PS:您的服务器必须有能力包装您的输出数据，这将需要更改您的http://192.168.2.10:8080/commapi/comaction/init代码。

Answer 2

这是由于同一原产地政策，换句话说，主机和端口应该是相同的。

要解决这个问题，请看一下JSONP。

这里有一个资源可以让你开始。