Question

JQuery ajax json怎样获取外网url返回的数据

Answer 1

Jquery ajax在请求不同域名（外网）的URL时，由于浏览器安全限制（同源策略）是不允许请求的，将会发生错误。如果想要在这样的场景下获取返回的数据，可以参考下面的方法：

1、搭建服务器做代理捉取跨域请求返回的数据，本地应用页面的ajax请求建立的代理服务器就能间接的实现这样的需求。但是此种做法较为复杂，不建议使用；

2、使用jsonp跨域访问，这种方法是较为普遍的解决方案，其实现原理是：HTML的<script>标签是可以突破同源策略从其他来源获取数据，所以可以通过<script>标签引入jsonp文件，然后通过一系列JS操作获取数据。

具体实现步骤如下：

利用本地页面js创建一个<script>元素，地址指向第三方的API网址，形如：   

<script src="http://www.example.net/api?param1=1&param2=2"></script>

提供一个回调函数来接收数据（函数名可约定，或通过地址参数传递）， 第三方产生的响应为json数据的包装（故称之为jsonp，即json padding），形如：    

callback({"name":"hax","gender":"Male"})

这样浏览器会调用callback函数，并传递解析后json对象作为参数。本地脚本可在callback函数里处理所传入的数据。  

示例代码：

<script>  
 var url = "http://localhost:8080/crcp/rcp/t99eidt/testjson.do?jsonp=callbackfunction";   
 var script = document.createElement('script');   
 script.setAttribute('src', url);  //load javascript    
 document.getElementsByTagName('head')[0].appendChild(script);   
 //回调函数  
  function callbackfunction(data){  
   var html=JSON.stringify(data.RESULTSET);  
   alert(html);  
    } 
</script>

使用jsonp需要后端代码配合， 后台返回的json外面需要由回调函数包裹。