通过jsonp获取json数据实现AJAX跨域请求

  AJAX (

<代码>异步的JavaScript和XML> XMLHttpRequest> HTTP>   

  

但是,由于受到浏览器的限制,这种方法不可以进行跨域访问,如果使用这种方法进行跨域访问则会出现安全问题。不过,我们可以发现,在web页面跨域调用js文件时,不会受到浏览器的限制,所以我们可以利用将远程服务器端的数据装入js格式的文件,然后再用来供客户端进行调用。
  

  <代码>

JSON (JavaScript对象表示法> JavaScript代码进行解析,JSON数据可使用AJAX <代码> 进行传输。

  

JSON实例:

        {   “员工”:(   {“firstName”:“比尔”,“姓”:“盖茨”},   {“firstName”:“乔治”,“姓”:“布什”},   {“firstName”:“托马斯”,“姓”:“卡特”}   ]   }      

JSON语法是JavaScript对象表示法语法的子集:
  

  

数据在<代码>名称/值> 逗号> 花括号保存对象,<代码>方括号保存<代码>数组>   

  

JSON的特性

  
      <李>纯文本,易于跨平台传递李   <李> Javascript原生支持,后台语言几乎全部支持   <李>使用轻量级的文本数据交换格式,适合在互联网中传递李   <李>比XML更小,更快,更易解析。   
  

基于<代码> JSON代码的这些特性,可以通过使服务器动态生成JSON <代码> 文件,然后将客户端需要的数据装入这个文件,再将该文件调回客户端供客户端使用。为了便于客户端使用数据,逐渐形成了一种非正式传输协议<代码> JSONP> <代码>参数给服务端,然后服务端返回数据时会将这个 <代码>回调参数作为函数名来装入<代码> JSON>   

<>强如何使用JSONP
  

  

一种简单的方式就是使用jQuery来实现:

        & lt; !DOCTYPE html>   & lt; html>   & lt; head>   & lt;元http-equiv=? type”内容=" text/html; charset=utf - 8”比;   & lt; title> test   & lt;脚本type=" text/javascript " src=" http://apps.bdimg.com/libs/jquery/2.1.1/jquery.js "祝辞& lt;/script>   & lt;脚本type=" text/javascript祝辞   $(文档)时函数(){      . ajax({美元   类型:“获得”,   异步:假的,   url: http://encounter.christmas023.space/json.php& # 63; name=mavis&年龄=18”,   数据类型:“jsonp”,   jsonp:“回调”,//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(一般默认为:回调)   jsonpCallback:“信息”,//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写“& # 63;”,jQuery会自动为你处理数据   成功:函数(json) {   alert('你的名字:‘+ json.name +“年龄:' + json.age);      },   错误:函数(){   alert('失败');   }   });      });   & lt;/script>   & lt;/head>   & lt; body>      & lt;/body>   & lt;/html>      之前      
      <李> <代码> 类型:请求类型,GET或POST、默认为得到;李   <李> <代码>异步>   <李> <代码> url>   <李> <代码>数据类型>   <李> <代码> jsonpCallback>   <李> <代码> 成功:请求成功后回调函数;李   <李> :<代码>错误请求失败时调用此方法。   
  

运行结果:

  

通过jsonp获取json数据实现AJAX跨域请求

  

服务器返回的数据类型:

  

通过jsonp获取json数据实现AJAX跨域请求