ajax是一种比较常用的页面技术,以其良好的交互效果已经被广泛应用,为了方便的使用ajax,市面上也出现的不少的ajax框架如dwr。为此springmvc借鉴了dwr的思想,可以使用ajax和springmvc交互,同时提供了java对象转换成json的机制。还是先一睹为快吧
1 如果需要springmvc进行java对象和json的转换需要增加如下配置
- <bean class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter">
- <property name="cacheSeconds" value="0" />
- <property name="messageConverters">
- <list>
- <bean class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter"></bean>
- </list>
- </property>
- </bean>
如果json数据不需要springmvc进行转换messageConverters的配置可以忽略
2 在控制器中的方法加上注解@ResponseBody,此时该方法就可以通过ajax直接访问了
- package com.sxt.action;
- import java.io.UnsupportedEncodingException;
- import java.util.ArrayList;
- import java.util.List;
- import org.springframework.stereotype.Controller;
- import org.springframework.web.bind.annotation.RequestBody;
- import org.springframework.web.bind.annotation.RequestMapping;
- import org.springframework.web.bind.annotation.RequestMethod;
- import org.springframework.web.bind.annotation.ResponseBody;
- import com.sxt.po.User;
- @Controller
- @RequestMapping("myajax.do")
- public class MyAjaxController {
- @RequestMapping(params="method=test1",method=RequestMethod.GET)
- public @ResponseBody List<User> test1(String uname) throws Exception{
- String uname2 = new String(uname.getBytes("iso8859-1"),"UTF-8");
- System.out.println(uname2);
- System.out.println("MyAjaxController.test1()");
- List<User> list = new ArrayList<User>();
- list.add(new User("潘玮柏","123"));
- list.add(new User("蔡依林","456"));
- return list;
- }
- }
3 使用ajax请求springmvc并取得返回值
- <%@ page language="java" import="java.util.*" pageEncoding="gbk"%>
- <%
- String path = request.getContextPath();
- String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
- %>
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
- <html>
- <head>
- <base href="<%=basePath%>">
- <title>My JSP 'index.jsp' starting page</title>
- <Meta http-equiv="pragma" content="no-cache">
- <Meta http-equiv="cache-control" content="no-cache">
- <Meta http-equiv="expires" content="0">
- <Meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
- <Meta http-equiv="description" content="This is my page">
- <script>
- function createAjaxObj(){
- var req;
- if(window.XMLHttpRequest){
- req = new XMLHttpRequest();
- }else{
- req = new ActiveXObject("Msxml2.XMLHTTP"); //ie
- }
- return req;
- }
- function sendAjaxReq(){
- var req = createAjaxObj();
- req.open("get","myajax.do?method=test1&a="+Math.random());
- req.setRequestHeader("accept","application/json");
- req.onreadystatechange = function(){
- alert(req.responseText);
- //eval("var result="+req.responseText);
- //document.getElementById("div1").innerHTML=result[0].uname;
- }
- req.send(null);
- }
- </script>
- </head>
- <body>
- <a href="javascript:void(0);" onclick="sendAjaxReq();">测试</a>
- <div id="div1"></div>
- </body>
- </html>
最后来看看运行效果:
是不是也特别简单呢,其中最要注意的是使用这种方式需要jackson的支持,因此下面的这两个jar包不能少