SpringMVC環境Ajax非同步請求JSON的方法

這次帶給大家SpringMVC環境Ajax非同步請求JSON的方法，SpringMVC環境Ajax非同步請求JSON的注意事項有哪些，下面就是實戰案例，一起來看一下。

一環境搭建

首先是常規的spring mvc環境搭建，不用多說，需要注意的是，這裡需要引入jackson相關jar包，然後在spring設定檔「springmvc-servlet.xml」中加入json解析相關配置，我這裡的完整程式碼如下：

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

專案結構：

註：我這裡測試使用的完整jar套件：http://pan.baidu.com/s/1dEUwdmL

二測試實例

（1）在WEB-INF/jsp目錄下新建了一個index.jsp文件，包含了簡單的jQuery的ajax請求，請求資料的格式是JSON，具體程式碼如下：

<meta>
<base>">
<script></script>
<script></script>
<script></script>
<script></script>
<script></script>
<script></script>
<title>jQuery i18n</title>
<script>
$().ready(
function() {
$("#sub").click(
function() {
var name = $("#username").val();
var age = 18;
var user = {"username":name,"age":age};
$.ajax({
url : &#39;hello.json&#39;,
type : &#39;POST&#39;,
data : JSON.stringify(user), // Request body 
contentType : &#39;application/json; charset=utf-8&#39;,
dataType : &#39;json&#39;,
success : function(response) {
//请求成功
alert("你好" + response.username + "[" + response.age + "]，当前时间是：" + response.time + "，欢迎访问：http://www.zifangsky.cn");
},
error : function(msg) {
alert(msg);
}
});
});
});
</script>


<input style="width: 100px; height: 30px; font-size: 20px; font-weight: bold;">
<input style="height: 40px; height: 30px;">
<br>

（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：

package cn.zifangsky.controller;
import java.text.Format;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.HashMap;
import java.util.Map;
import org.springframework.context.annotation.Scope;
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 org.springframework.web.servlet.ModelAndView;
@Controller
@Scope("prototype")
public class TestController {
/**
* 转到页面
*/
@RequestMapping(value = "/hello.html")
public ModelAndView list() {
ModelAndView view = new ModelAndView("index");
return view;
}
/**
* ajax异步请求， 请求格式是json
*/
@RequestMapping(value = "/hello.json", method = { RequestMethod.POST })
@ResponseBody
public Map<string> hello(@RequestBody User user) {
// 返回数据的Map集合
Map<string> result = new HashMap<string>();
Format format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
// 返回请求的username
result.put("username", user.getUsername());
// 返回年龄
result.put("age", String.valueOf(user.getAge()));
// 返回当前时间
result.put("time", format.format(new Date()));
return result;
}
}</string></string></string>

關於具體的執行步驟我簡單說一下：

i）專案啟動後，在瀏覽器中訪問：http://localhost:8089/SpringDemo/hello.html，然後轉到執行controller中的list方法，接著會轉到/WEB-INF/jsp/index.jsp（PS：在controller中返回的是邏輯視圖，跟在springmvc-servlet.xml檔案中定義的路徑前綴和後綴進行拼接後合成檔案的真正路徑）

ii）在index.jsp頁面輸入文字然後點選按鈕，將會觸發ajax請求，這個請求會取得輸入框中的資料和預設的「age」參數拼接成json格式字串最後提交到「hello.json」這個請求，也就是執行controller中的hello方法

iii）hello方法執行完畢後會回傳一系列資料最後在頁面中顯示出來

（4 ）效果如下：

相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

推薦閱讀：

怎麼用ajax傳遞多個參數

建構AJAX實作表單JSON轉換的方法

以上是SpringMVC環境Ajax非同步請求JSON的方法的詳細內容。更多資訊請關注PHP中文網其他相關文章！