• u  最直接的Ajax处理
  • u  数据绑定@RequestBody/@ResponseBody
  • u  使用@RequestBody/@ResponseBody来支持Ajax
  • u  使用HttpEntity/ResponseEntity来支持Ajax
  • u  对Ajax返回xml的支持
  • u  HttpMessageConverter
  • u  内容协商

1      最直接的Ajax处理

只要在Controller的方法里面,直接使用response输出你要返回的的Ajax数据,然后return null就可以了,示例如下:

Controller示例

@RequestMapping(value = "/hello")

public ModelAndView handleRequest(UserModel um,HttpServletResponse response)throws IOException {

   response.setCharacterEncoding("utf-8");

   response.getWriter().println("{uuid:'"+um.getUuid()+"', name:'"+um.getName()+"'}");

   return null;

}

客户端示例,使用jQuery

<%@ page language="java" contentType="text/html; charset=UTF-8 " pageEncoding="UTF-8"%>

<head>

  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

</head>

<script language="javascript“ src="/mvcexample/static/js/jquery-1.3.2.min.js"></script>

<script language="javascript">

  $().ready(function(){

  $.getJSON('/mvcexample/hello',{uuid:'1',name:'test'},

     function(data){

     alert(data.uuid+" , "+data.name);

     });

   });

</script>

</html>

然后就可以启动服务器测试了。

2      数据绑定@RequestBody/@ResponseBody

@RequestBody

功能:用于将HttpServletRequest的getInputStream()内容绑定到入参

例子:

 @RequestMapping(value = "/hello")

  public byte[] handleRequest(@RequestBody String body)

@ResponseBody

功能:用于将ResponseBody方法的返回值作为响应体

例子:

@RequestMapping(value = “/hello")

@ResponseBody

public byte[] handleRequest(@RequestBody String body)

注意:他们都只能访问报文体,不能访问报文头

3      使用@RequestBody/@ResponseBody来支持Ajax

可以使用@RequestBody来自动获取Ajax上传的数据,同时也可以使用@ResponseBody,把要返回的对象自动拼成JSON的格式返回。当然,需要加入几个jackson的包,这里加入了:

jackson-core-2.1.2.jar、jackson-annotations-2.1.2.jar、jackson-databind-2.1.2.jar

测试使用的Controller的方法:

@RequestMapping(value = "/hello")

@ResponseBody

public UserModel handleRequest(@RequestBody String reqBody, UserModel um){

    System.out.println("the reqBody="+reqBody);

    um.setName(um.getName()+",server");

    return um;

}

测试使用的页面

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

  <html>

    <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

   </head>

<script language="javascript"src="/mvcexample/static/js/jquery-

1.3.2.min.js">

</script>

<script language="javascript">

  $().ready(function(){

  $.getJSON('/mvcexample/hello',{uuid:'1',name:'test'},

    function(data){

    alert(data.uuid+" , "+data.name);

    });

  });

</script>

去测试看看吧,可以看到Controller的方法直接返回一个um对象,但是@ResponseBody会把这个对象自动变成json格式的,再传回客户端,非常方便。

当然,@ResponseBody也支持集合对象自动变成json格式,比如:

测试使用的Controller方法

@RequestMapping(value = "/hello")

@ResponseBody

public List<UserModel> handleRequest(@RequestBody String reqBody,UserModel um) {

    System.out.println("the reqBody="+reqBody);

    um.setName(um.getName()+",server");

    List<UserModel> list = new ArrayList<UserModel>();

    list.add(um);

    UserModel um2 = new UserModel();

    um2.setUuid("22");

    um2.setName("222");

    list.add(um2);

    return list;

}

测试使用的页面

<%@ page language="java" contentType="text/html; charset=UTF-8 " pageEncoding="UTF-8"%>

  <html>

     <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

     </head>

  <script  language="javascript“

      src="/mvcexample/static/js/jquery-1.3.2.min.js">

  </script>

<script language="javascript">

  $().ready(function(){

  $.getJSON('/mvcexample/hello',{uuid:'1',name:'test'},

  function(data){

  $.each(data,function(index,v){

  alert("tr="+v.uuid+",v="+v.name);

  });

 });

});

</script>

4      使用HttpEntity/ResponseEntity来支持Ajax

使用HttpEntity/ResponseEntity不但能访问到报文体,还可以访问报文头

示例,主要的变化在Controller的方法上,页面不用变化,如下:

@RequestMapping(value = "/hello")

public ResponseEntity<List<UserModel>> handleRequest(HttpEntity<String> req, UserModel um) {

  System.out.println("req headers="+req.getHeaders()+",    reqBody="+req.getBody());

um.setName(um.getName()+",server");

   List<UserModel> list = new ArrayList<UserModel>();

   list.add(um);

   UserModel um2 = new UserModel();

   um2.setUuid("22");

   um2.setName("222");

   list.add(um2);

   ResponseEntity<List<UserModel>> ret = new

      ResponseEntity<List<UserModel>>(list,HttpStatus.OK);

   return ret;

}

5      对Ajax返回xml的支持

前面的Ajax使用的是json格式,下面看看对xml的支持

要让Spring Web MVC支持xml格式,需要加入如下jar包:jaxb-api-2.2.5.jar,jaxb-impl-2.2.5.jar

在要返回的对象头上使用如下注解,例如:

@XmlRootElement(name = "testxml")

public class UserModel {

  • u  这表明返回的xml的根元素名称为testxml,注意:由于xml是单根的,所以只能返回一个对象,而不能返回一个list,如果要返回多条值,可以在这个对象中包含多个其他对象
  • u  返回的结果同样用@ResponseBody注解即可,这个注解会根据请求的类型,自动决定是返回json还是xml,当然默认是返回json格式的,如果要返回xml格式,那么请求的时候,要指定accept=application/xml
  • u  示例的Controller方法
@RequestMapping(value = "/hello")

@ResponseBody

public UserModel handleRequest(HttpEntity<String> req, UserModel um) {

   System.out.println("req headers="+req.getHeaders()+",     reqBody="+req.getBody());

   um.setName(um.getName()+",server");

   PhoneNumberModel pnm = new PhoneNumberModel("123","321");

   PhoneNumberModel pnm2 = new    

        PhoneNumberModel("2222","333");

   List<PhoneNumberModel> tempList = new 

      ArrayList<PhoneNumberModel>();

   tempList.add(pnm2);

   tempList.add(pnm);

   um.setPm(tempList);

  return um;

}

示例的页面

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<html>

   <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

   </head>

  <script language="javascript"

       src="/mvcexample/static/js/jquery-1.3.2.min.js">

  </script>

<script language="javascript">

   $().ready(function(){

   $.ajax({

         url:'/mvcexample/hello',

         type: 'POST',

         dataType: 'xml',

         data: {uuid:'1',name:'test'},

         timeout: 1000,

         error: function(){ alert('Error loading XMLdocument'); },

         success: function(xml){

$(xml).find("testxml").children("pm").each(function(i){

       var uuid=$(this).children("areaCode").text();

       var name=$(this).children("phoneNumber").text();

       alert("uuid="+uuid+",name="+name);

    });} });});

</script>

返回的xml形如

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>

<testxml>

   <age>0</age>

   <name>test,server</name>

   <pm>

      <areaCode>2222</areaCode>

      <phoneNumber>333</phoneNumber>

    </pm>

     <pm>

         <areaCode>123</areaCode>

         <phoneNumber>321</phoneNumber>

     </pm>

    <uuid>1</uuid>

</testxml>

6      HttpMessageConverter

其实前面的程序实现对json和xml的支持,之所以能正常运行,幕后英雄就是HttpMessageConverter,它负责对http传入和传出的内容进行格式转换。比如前面学的@RequestBody是将Http请求正文插入方法中,其实它就会使用适合的HttpMessageConverter将请求体写入某个对象。比如前面学的@ResponseBody是将内容或对象作为Http响应正文返回,使用@ResponseBody将会跳过视图处理部分,直接调用合适的HttpMessageConverter,将返回值写入输出流

现在只要你开启了<mvc:annotation-driven />,它会给AnnotationMethodHandlerAdapter初始化7个转换器,可以通过调用AnnotationMethodHandlerAdapter类的getMessageConverts()方法来获取转换器的一个集合List<HttpMessageConverter>,默认开启的有:

  • u  ByteArrayHttpMessageConverter
  • u  StringHttpMessageConverter
  • u  ResourceHttpMessageConverter
  • u  SourceHttpMessageConverter<T>
  • u  XmlAwareFormHttpMessageConverter
  • u  Jaxb2RootElementHttpMessageConverter
  • u  MappingJacksonHttpMessageConverter

Spring是如何寻找最佳的HttpMessageConverter呢?

最基本的方式就是通过请求的accept里面的格式来匹配,如果accept=application/json之类的,就使用json的HttpMessageConverter,如果accept=application/xml之类的,就使用xml的HttpMessageConverter。

7      内容协商

什么是内容协商?

简单点说,就是同一资源,可以有多种表现形式,比如xml、json等,具体使用哪种表现形式,是可以协商的。

这是RESTfull的一个重要特性,Spring Web MVC也支持这个功能。

09springMVC对ajax的支持的更多相关文章

  1. MVC4 5分页控件,支持Ajax AjaxOption支持

    MVC4 5分页控件,支持Ajax AjaxOption支持 /// <summary> /// MVC4 5分页控件,支持Ajax AjaxOption支持 beta 1.0 /// 用 ...

  2. Struts2对AJAX的支持

    一.简介        struts2确实一个非常棒的MVC框架.这里部分记述一下struts2对AJAX的支持.实现AJAX有两种方式,一种是使用原生的javascript代码实现,一种是使用第三方 ...

  3. Unit02: JSON 、 使用JSON实现数据交换 、 jQuery对AJAX的支持,编码问题

    Unit02: JSON . 使用JSON实现数据交换 . jQuery对AJAX的支持 1. 编码问题 (1)发送get请求 为什么会产生乱码? ie浏览器提供的ajax对象,对中文会使用gbk来编 ...

  4. IT兄弟连 JavaWeb教程 jQuery对AJAX的支持

    jQuery对AJAX的支持 jQuery对Ajax请求的创建.发送.响应.注册数据处理函数.JSON的解析和缓存以及传参等都进行了相应的封装,同时也考虑了浏览器的兼容性问题. jQuery中对AJA ...

  5. jquery ajax中支持哪些返回类型以及js中判断一个类型常用的方法?

    1 jquery ajax中支持哪些返回类型在JQuery中,AJAX有三种实现方式:$.ajax() , $.post , $.get(). 预期服务器返回的数据类型.如果不指定,jQuery 将自 ...

  6. 【JavaWeb】jQuery对Ajax的支持

    jQuery对Ajax的支持 jQuery对Ajax进行封装,提供了$.ajax()方法 语法:$.ajax(options) 常用设置项 说明 url 发送请求地址 type 请求类型get|pos ...

  7. jquery.form.js官方插件介绍Form插件,支持Ajax,支持Ajax文件上传

    jquery.form.js官方插件介绍Form插件,支持Ajax,支持Ajax文件上传 http://www.malsup.com/jquery/form/#getting-started [JQu ...

  8. 微信支付之微信H5支付(坑,ajax不支持重定向跳转)

    这里讲的是  微信h5支付,    是微信以外的手机浏览器调用微信h5支付  h5支付: H5支付是指商户在微信客户端外的移动端网页展示商品或服务,用户在前述页面确认使用微信支付时,商户发起本服务呼起 ...

  9. MvcPager 概述 MvcPager 分页示例 — 标准Ajax分页 对SEO进行优化的ajax分页 (支持asp.net mvc)

    该示例演示如何使用MvcPager最基本的Ajax分页模式. 使用AjaxHelper的Pager扩展方法来实现Ajax分页,使用Ajax分页模式时,必须至少指定MvcAjaxOptions的Upda ...

随机推荐

  1. mysql sql执行错误#1436 Thread stack overrun

    1.mysql调用存储过程  call proc1() 时报错:Thread stack overrun: 6656 bytes used of a 8496 byte stack, and 1280 ...

  2. [Swift通天遁地]二、表格表单-(18)快速应用多种预定义格式的表单验证

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  3. [Swift通天遁地]三、手势与图表-(5)创建带有标题、图例、坐标轴的柱形图表

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  4. Python基础数据类型(五) dict字典

    字典dict{} 字典数字自动排序 enumerate 枚举 for i,k in enumerate(dic,1) #第二个参数默认不写就是0 ---枚举 print(i,k) dict,以{}来表 ...

  5. JavaScript--引用JS外部文件

    通过前面知识学习,我们知道使用<script>标签在HTML文件中添加JavaScript代码,如图: JavaScript代码只能写在HTML文件中吗?当然不是,我们可以把HTML文件和 ...

  6. 安卓UI自适应性

    出于安卓的碎片化原因,针对不同屏幕大小,最好是做到以下几点: 1.能用相对布局的就不用绝对布局,尽量使用权重,weight设置,相对布局和线性布局同条件情况下,优先选线性布局 2.在res目录下创建不 ...

  7. flask web 表单验证 WTForms

    简介 WTForms 是一个flask集成框架,或者说是库,用于处理浏览器表单提交的数据,它在flask-WTF的基础上扩展并添加了一些随手可得的精巧帮助函数,这些函数将会是在flask里使用表单更加 ...

  8. Recyclerview点击事件,更新item的UI+更新Recyclerview外的控件

    项目中用到了Recyclerview,在第一行代码中学到了一种相对来说简单的点击事件方法,可是这种点击事件是在adapter中写的,没有教怎么更新item的ui和更新Recyclerview之外的控件 ...

  9. 控制台——屏蔽Ctrl+C快捷键对窗体的关闭功能

    导入SetCtrlHandlerHandler API //定义处理程序委托 public delegate bool ConsoleCtrlDelegate(int ctrlType); //导入S ...

  10. [Windows Server 2012] Apache+PHP安全设置

    ★ 欢迎来到[护卫神·V课堂],网站地址:http://v.huweishen.com ★ 护卫神·V课堂 是护卫神旗下专业提供服务器教学视频的网站,每周更新视频. ★ 本节我们将带领大家:Win20 ...