jsonp的作用,jsonp用法

  jsonp的作用,jsonp用法

  一、跨域请求的概念

  为了JavaScript的安全性,不允许跨域调用其他页面的对象。

  二。JSON和jsonp

  JSON是一种基于文本的数据交换方式(不支持跨域),而JSONP是一种非官方的跨域数据交换协议。

  使用json格式传输数据的客户端代码如下:

  content type: application/JSON;charset=utf-8 ,

  数据类型: json ,//json不支持跨域请求,只能使用jsonp。

  数据:{

  用户:JSON.stringify(用户)

  成功:函数(数据){

  $( #用户名)[0]。innerHTML=data.user _ name

  $(#user_teleNum)[0]。innerHTML=data.user _ teleNum

  $(#user_ID)[0]。innerHTML=data.user _ ID

  错误:函数(){

  Alert(“请求超时错误!”);

  但是,单纯使用json无法支持跨域的资源请求。为了解决这个问题,我们需要采用jsonp数据交互协议。众所周知,js文件的调用不受是否跨域的限制,所以如果想通过纯web跨域访问数据,只能尝试在远程服务器上将json数据封装成js格式文件,供客户端调用和进一步处理。这就是jsonp协议的原理。该协议的一个关键点是允许用户向服务器传递一个回调参数,然后服务器在返回数据时将这个回调参数作为函数名包装JSON数据,这样客户端就可以随意定制自己的函数来自动处理返回的数据。

  简单来说,json不支持跨域,但是js可以跨域。所以json数据在服务器端被客户端提供的JS函数封装,然后函数提供给客户端调用,从而获得jsON数据。

  在开发过程中,如果出现类似“access-control-allow-origin不允许origin * * * * *的错误。”,可能是json数据不支持跨域造成的,要考虑jsonp协议。

  如果出现类似“语法错误:意外标记:的错误。parseerror。可能是返回的json数据没有被“回调”传递的函数名封装。

  客户端代码如下:

  $(function () {

  var用户={

  用户名“:”HelloWorld

  $.ajax({

  网址: http://localhost:8080/Changyou/UserInfo ,

  类型: POST ,

  content type: application/JSON;charset=utf-8 ,

  数据类型: jsonp ,//json不支持跨域请求,只能使用jsonp。

  数据:{

  用户:JSON.stringify(用户)

  Jsonp: callback ,//传递给请求处理程序或页面以获取Jsonp回调函数名称的参数名,默认为callback。

  JsonpCallback: userHandler ,//用户定义的jsonp回调函数的名称。默认是jQuery自动生成的随机函数名,也可以写“?”,jQuery会自动为您处理数据

  成功:函数(数据){

  $( #用户名)[0]。innerHTML=data.user _ name

  $(#user_teleNum)[0]。innerHTML=data.user _ teleNum

  $(#user_ID)[0]。innerHTML=data.user _ ID

  错误:函数(){

  Alert(“请求超时错误!”);

  受保护的void doPost(HttpServletRequest请求,HttpServletResponse响应)引发ServletException,IOException {

  response . set content type( application/JSON;charset=utf-8 );

  String username=新字符串(request.getParameter(user )。getBytes(ISO-8859-1 ), utf-8 )。

  String callback=新字符串(request.getParameter(callback )。getBytes(ISO-8859-1 ), utf-8 )。

  System.out.println(接收数据:用户名);

  system . out . println( callback: callback 的值);

  JSON object user=JSON object . from object(用户名);

  System.out.println(收到的用户名: user . get( username ));

  JSON object userinfo=new JSON object();

  Userinfo.put(用户名,张);

  userinfo.put(user_teleNum , 18810011111 );

  userinfo.put(user_ID , 123456789098765432 );

  PrintWriter out=response . getwriter();

  string backInfo=callback ( userinfo . tostring());//将json数据封装在回调函数中,提供给客户端。

  out . print(backInfo);

  out . close();

  虽然客户端没有实现userHandler函数,但是它可以成功运行。原因是jquery在处理jsonp类型的ajax时,会自动为你生成一个回调函数,并取出数据供success属性方法调用。

  Json是一种数据格式。

  Jsonp是一种数据调用方式。

  你可以简单理解为带回调的json就是jsonp。

jsonp的作用,jsonp用法