主頁 > 知識庫 > SpringMVC環(huán)境下實現(xiàn)的Ajax異步請求JSON格式數(shù)據(jù)

SpringMVC環(huán)境下實現(xiàn)的Ajax異步請求JSON格式數(shù)據(jù)

熱門標(biāo)簽:銀行業(yè)務(wù) 電子圍欄 Linux服務(wù)器 服務(wù)器配置 科大訊飛語音識別系統(tǒng) 阿里云 團購網(wǎng)站 Mysql連接數(shù)設(shè)置

一 環(huán)境搭建

首先是常規(guī)的spring mvc環(huán)境搭建,不用多說,需要注意的是,這里需要引入jackson相關(guān)jar包,然后在spring配置文件“springmvc-servlet.xml”中添加json解析相關(guān)配置,我這里的完整代碼如下:

?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 
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執(zhí)行AJAX時,返回JSON出現(xiàn)下載文件 -->
bean id="mappingJacksonHttpMessageConverter"
class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter">
property name="supportedMediaTypes">
list>
value>text/html;charset=UTF-8/value>
value>application/json;charset=UTF-8/value>
/list>
/property>
property name="objectMapper">
bean class="org.codehaus.jackson.map.ObjectMapper">
property name="dateFormat">
bean class="java.text.SimpleDateFormat">
constructor-arg type="java.lang.String" value="yyyy-MM-dd HH:mm:ss">/constructor-arg>
/bean>
/property>
/bean>
/property>
/bean>
!-- 啟動Spring MVC的注解功能,完成請求和注解POJO的映射 -->
bean
class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter">
property name="messageConverters">
list>
ref bean="mappingJacksonHttpMessageConverter" />!-- json轉(zhuǎn)換器 -->
/list>
/property>
/bean>
mvc:annotation-driven
content-negotiation-manager="contentNegotiationManager" />
bean id="contentNegotiationManager"
class="org.springframework.web.accept.ContentNegotiationManagerFactoryBean">
!-- true,開啟擴展名支持,false關(guān)閉支持 -->
property name="favorPathExtension" value="false" />
!-- 用于開啟 /userinfo/123?format=json的支持 -->
property name="favorParameter" value="true" />
!-- 設(shè)置為true以忽略對Accept Header的支持 -->
property name="ignoreAcceptHeader" value="false" />
property name="mediaTypes">
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 id="jspViewResolver"
class="org.springframework.web.servlet.view.InternalResourceViewResolver">
property name="requestContextAttribute" value="rc" />
property name="viewClass"
value="org.springframework.web.servlet.view.JstlView" />
property name="prefix" value="/WEB-INF/jsp/" />
property name="suffix" value=".jsp" />
property name="order" value="1">/property>
/bean>
/beans>

項目結(jié)構(gòu):

注:我這里測試使用的完整jar包:http://pan.baidu.com/s/1dEUwdmL

二 測試實例

(1)在WEB-INF/jsp目錄下新建了一個index.jsp文件,包含了簡單的jQuery的ajax請求,請求數(shù)據(jù)的格式是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 + "/";
%>
html>
head>
meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
base href="%=basePath%>">
script type="text/javascript" src="scripts/jquery/jquery-1.6.2.min.js">/script>
script type="text/javascript" src="scripts/jquery/jquery.i18n.properties-min-1.0.9.js">/script>
script type="text/javascript" src="scripts/jquery/jquery.autocomplete.js">/script>
script type="text/javascript" src="scripts/jquery/jquery.loadmask.js">/script>
script type="text/javascript" src="scripts/jquery/jquery.form.js">/script>
script type="text/javascript" src="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 + "],當(dāng)前時間是:" + response.time + ",歡迎訪問:http://www.zifangsky.cn");
},
error : function(msg) {
alert(msg);
}
});
});
});
/script>
/head>
body>
input type="text" id="username"
style="width: 100px; height: 30px; font-size: 20px; font-weight: bold;">
input type="button" id="sub" value="Go"
style="height: 40px; height: 30px;">
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:

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 {
/**
* 轉(zhuǎn)到頁面
*/
@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 MapString, String> hello(@RequestBody User user) {
// 返回數(shù)據(jù)的Map集合
MapString, String> result = new HashMapString, String>();
Format format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
// 返回請求的username
result.put("username", user.getUsername());
// 返回年齡
result.put("age", String.valueOf(user.getAge()));
// 返回當(dāng)前時間
result.put("time", format.format(new Date()));
return result;
}
}

關(guān)于具體的執(zhí)行步驟我簡單說一下:

i)項目啟動后,在瀏覽器中訪問:http://localhost:8089/SpringDemo/hello.html,然后會轉(zhuǎn)到執(zhí)行controller中的list方法,接著會轉(zhuǎn)到/WEB-INF/jsp/index.jsp(PS:在controller中返回的是邏輯視圖,跟在springmvc-servlet.xml文件中定義的路徑前綴和后綴進行拼接后合成文件的真正路徑)

ii)在index.jsp頁面輸入文字然后點擊按鈕,將會觸發(fā)ajax請求,這個請求會獲取輸入框中的數(shù)據(jù)和默認的“age”參數(shù)拼接成json格式字符串最后提交到“hello.json”這個請求,也就是執(zhí)行controller中的hello方法

iii)hello方法執(zhí)行完畢后會返回一系列數(shù)據(jù)最后在頁面中顯示出來

(4)效果如下:

以上所述是小編給大家介紹的SpringMVC環(huán)境下實現(xiàn)的Ajax異步請求JSON格式數(shù)據(jù)的相關(guān)內(nèi)容,希望對大家有所幫助!

您可能感興趣的文章:
  • 使用SpringBoot注解方式處理事務(wù)回滾實現(xiàn)
  • spring boot注解方式使用redis緩存操作示例
  • Spring AOP如何整合redis(注解方式)實現(xiàn)緩存統(tǒng)一管理詳解
  • Spring 使用注解方式進行事務(wù)管理配置方式
  • spring mvc整合freemarker基于注解方式
  • Spring-MVC異步請求之Servlet異步處理
  • springmvc處理異步請求的示例
  • 詳解spring mvc對異步請求的處理
  • Spring中注解方式的異步請求

標(biāo)簽:江蘇 衡水 衢州 棗莊 萍鄉(xiāng) 大理 廣元 蚌埠

巨人網(wǎng)絡(luò)通訊聲明:本文標(biāo)題《SpringMVC環(huán)境下實現(xiàn)的Ajax異步請求JSON格式數(shù)據(jù)》,本文關(guān)鍵詞  ;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問題,煩請?zhí)峁┫嚓P(guān)信息告之我們,我們將及時溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無關(guān)。
  • 相關(guān)文章
  • 收縮
    • 微信客服
    • 微信二維碼
    • 電話咨詢

    • 400-1100-266