SpringMVC环境下实现的Ajax异步请求JSON格式数据

首先是常规的spring mvc环境搭建,不用多说,需要注意的是,这里需要引入jackson相关jar包,然后在spring配置文件“springmvc-servlet.xml”中添加json解析相关配置,我这里的完整代码如下:

<?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:context="http://www.springframework.org/schema/context" xmlns:mvc="http://www.springframework.org/schema/mvc" xsi:schemaLocation="http://www.springframework.org/schema/beans "> <!-- 避免IE执行AJAX时,返回JSON出现下载文件 --> <bean> <property> <list> <value>text/html;charset=UTF-8</value> <value>application/json;charset=UTF-8</value> </list> </property> <property> <bean> <property> <bean> <constructor-arg type="java.lang.String" value="yyyy-MM-dd HH:mm:ss"></constructor-arg> </bean> </property> </bean> </property> </bean> <!-- 启动Spring MVC的注解功能,完成请求和注解POJO的映射 --> <bean> <property> <list> <ref bean="mappingJacksonHttpMessageConverter" /><!-- json转换器 --> </list> </property> </bean> <mvc:annotation-driven content-negotiation-manager="contentNegotiationManager" /> <bean> <!-- true,开启扩展名支持,false关闭支持 --> <property value="false" /> <!-- 用于开启 /userinfo/123?format=json的支持 --> <property value="true" /> <!-- 设置为true以忽略对Accept Header的支持 --> <property value="false" /> <property> <value> atom=application/atom+xml html=text/html json=application/json xml=application/xml *=*/* </value> </property> </bean> <context:annotation-config /> <!-- 启动自动扫描该包下所有的Bean(例如@Controller) --> <context:component-scan base-package="cn.zifangsky.controller" /> <mvc:default-servlet-handler /> <!-- 定义视图解析器 --> <bean> <property value="rc" /> <property value="org.springframework.web.servlet.view.JstlView" /> <property value="/WEB-INF/jsp/" /> <property value=".jsp" /> <property value="1"></property> </bean> </beans>

项目结构:

SpringMVC环境下实现的Ajax异步请求JSON格式数据

注:我这里测试使用的完整jar包:

二 测试实例

(1)在WEB-INF/jsp目录下新建了一个index.jsp文件,包含了简单的jQuery的ajax请求,请求数据的格式是JSON,具体代码如下:

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "https://www.jb51.net/"; %> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <base href="https://www.jb51.net/<%=basePath%>"> <script type="text/javascript" src="https://www.jb51.net/scripts/jquery/jquery-1.6.2.min.js"></script> <script type="text/javascript" src="https://www.jb51.net/scripts/jquery/jquery.i18n.properties-min-1.0.9.js"></script> <script type="text/javascript" src="https://www.jb51.net/scripts/jquery/jquery.autocomplete.js"></script> <script type="text/javascript" src="https://www.jb51.net/scripts/jquery/jquery.loadmask.js"></script> <script type="text/javascript" src="https://www.jb51.net/scripts/jquery/jquery.form.js"></script> <script type="text/javascript" src="https://www.jb51.net/scripts/jquery/jquery.timers.js"></script> <title>jQuery i18n</title> <script type="text/javascript"> $().ready( function() { $("#sub").click( function() { var name = $("#username").val(); var age = 18; var user = {"username":name,"age":age}; $.ajax({ url : 'hello.json', type : 'POST', data : JSON.stringify(user), // Request body contentType : 'application/json; charset=utf-8', dataType : 'json', success : function(response) { //请求成功 alert("你好" + response.username + "[" + response.age + "],当前时间是:" + response.time + ",欢迎访问:"); }, error : function(msg) { alert(msg); } }); }); }); </script> </head> <body> <input type="text"> <input type="button" value="Go"> <br> </body> </html>

(2)一个简单的model类User,代码如下:

package cn.zifangsky.controller; public class User { private String username; private int age; public String getUsername() { return username; } public void setUsername(String username) { this.username = username; } public int getAge() { return age; } public void setAge(int age) { this.age = age; } }

(3)controller类TestController.java:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wjppsf.html