SpringMVC中處理Ajax請求的示例
更新時間：2023年11月02日 10:04:11 作者：Javaer1995
本篇文章給大家介紹SpringMVC中處理Ajax請求的示例,本文通過示例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友參考下吧
創(chuàng)建名為spring_mvc_ajax的新module，過程參考9.1節(jié)和9.5節(jié)
10.1、SpringMVC處理Ajax請求
10.1.1、頁面請求示例
<input type="button" value="測試SpringMVC處理Ajax請求" onclick="testAjax()">
<script type="text/javascript">
function testAjax() {
// 實(shí)例化 XMLHttpRequest 對象
var xhr = new XMLHttpRequest()
// 設(shè)置請求方式和請求路徑
// 因?yàn)閠hymeleaf語法只能應(yīng)用于html的屬性，所以在js中的請求要包含上下文信息
xhr.open("post","/spring_mvc_ajax/test/ajax?id=1001")
// 設(shè)置請求頭
// 一般 get 不需要設(shè)置，而 post 必須設(shè)置請求頭
// 必須寫在在open（）和send（）之間
xhr.setRequestHeader("Content-Type", "application/json")
// 發(fā)送請求
// JSON.stringify() 是用來將合法的JSON數(shù)據(jù)字符串化的
xhr.send( JSON.stringify( {"username":"admin","password":123} ) )
// 設(shè)置 XMLHttpRequest 對象狀態(tài)變化事件的處理函數(shù)
xhr.onreadystatechange = function () {
// readyState的值為4時，表示已獲取到服務(wù)器的響應(yīng)
if (xhr.readyState == 4){
// 在瀏覽器控制臺輸出服務(wù)器響應(yīng)的內(nèi)容
console.log(xhr.responseText)
}
}
}
</script>10.1.2、控制器方法示例
@RequestMapping("/test/ajax")
public void testAajx(Integer id , HttpServletResponse response) throws IOException {
// 通過形參獲取 url 中的請求參數(shù)
System.out.println("id："+id);
// 通過 HttpServletResponse 對象為 Ajax 請求響應(yīng)（字符串）數(shù)據(jù)
response.getWriter().write("hello,ajax");
}10.1.3、測試效果
10.2、@RequestBody注解的基礎(chǔ)示例
10.2.1、作用
@RequestBody 注解用于將請求體中的內(nèi)容和控制器方法中的形參進(jìn)行綁定
10.2.2、控制器方法示例
頁面請求示例，見10.1.1節(jié)
@RequestMapping("/test/ajax")
public void testAajx(Integer id ,@RequestBody String requestBody ,HttpServletResponse response) throws IOException {
// 通過形參獲取 url 中的請求參數(shù)
System.out.println("id："+id);
// 通過 @RequestBody 注解后的形參，獲取請求體中的內(nèi)容
System.out.println("requestBody："+requestBody);
// 通過 HttpServletResponse 對象為 Ajax 請求響應(yīng)（字符串）數(shù)據(jù)
response.getWriter().write("hello,ajax");
}10.2.3、測試效果
10.3、@RequestBody注解的進(jìn)階示例
10.3.1、前提條件一(引入jackson依賴)
<!--jackson-->
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.12.1</version>
</dependency>10.3.2、前提條件二(開啟mvc的注解驅(qū)動)
mvc的注解驅(qū)動，在配置視圖控制器和默認(rèn)的servlet處理器的時候，已經(jīng)開啟；其重要性不言而喻
<!--開啟mvc的注解驅(qū)動-->
<mvc:annotation-driven></mvc:annotation-driven>10.3.3、前提條件三(一個匹配json格式的Java類型)
匹配json格式的Java類型，一般是自定義實(shí)體類或map類型
package online.liaojy.pojo;
import java.io.Serializable;
/**
* @author liaojy
* @date 2023/10/30 - 0:02
*/
public class User implements Serializable {
private Integer id;
private String username;
private String password;
private Integer age;
private String gender;
public User() {
}
public User(Integer id, String username, String password, Integer age, String gender) {
this.id = id;
this.username = username;
this.password = password;
this.age = age;
this.gender = gender;
}
public Integer getId() {
return id;
}
public void setId(Integer id) {
this.id = id;
}
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
public Integer getAge() {
return age;
}
public void setAge(Integer age) {
this.age = age;
}
public String getGender() {
return gender;
}
public void setGender(String gender) {
this.gender = gender;
}
@Override
public String toString() {
return "User{" +
"id=" + id +
", username='" + username + '\'' +
", password='" + password + '\'' +
", age=" + age +
", gender='" + gender + '\'' +
'}';
}
}10.3.4、頁面請求示例
<input type="button" value="測試使用@RequestBody注解處理json格式的請求參數(shù)" onclick="testRequestBody()">
<script type="text/javascript">
function testRequestBody() {
// 實(shí)例化 XMLHttpRequest 對象
var xhr = new XMLHttpRequest()
// 設(shè)置請求方式和請求路徑
// 因?yàn)閠hymeleaf語法只能應(yīng)用于html的屬性，所以在js中的請求要包含上下文信息
xhr.open("post","/spring_mvc_ajax/test/RequestBody/json")
// 設(shè)置請求頭
// 一般 get 不需要設(shè)置，而 post 必須設(shè)置請求頭
// 必須寫在在open（）和send（）之間
xhr.setRequestHeader("Content-Type", "application/json")
// 發(fā)送請求
// JSON.stringify() 是用來將合法的JSON數(shù)據(jù)字符串化的
xhr.send( JSON.stringify( {"username":"admin","password":"123","age":18,"gender":"男"} ) )
// 設(shè)置 XMLHttpRequest 對象狀態(tài)變化事件的處理函數(shù)
xhr.onreadystatechange = function () {
// readyState的值為4時，表示已獲取到服務(wù)器的響應(yīng)
if (xhr.readyState == 4){
// 在瀏覽器控制臺輸出服務(wù)器響應(yīng)的內(nèi)容
console.log(xhr.responseText)
}
}
}
</script>10.3.5、控制器方法示例(自定義實(shí)體類)
// 通過 @RequestBody 注解形參，將json格式的請求參數(shù)轉(zhuǎn)換為Java對象(自定義實(shí)體類)
@RequestMapping("/test/RequestBody/json")
public void testRequestBody(@RequestBody User user,HttpServletResponse response) throws IOException {
System.out.println("user："+user);
response.getWriter().write("hello,RequestBody");
}10.3.6、測試效果(自定義實(shí)體類)
因?yàn)閖son格式的請求參數(shù)中，沒有包含id的鍵值對，所以轉(zhuǎn)換后的Java實(shí)體類對象的id值為null
10.3.7、控制器方法示例(map集合)
// 通過 @RequestBody 注解形參，將json格式的請求參數(shù)轉(zhuǎn)換為Java對象(map集合)
@RequestMapping("/test/RequestBody/json")
public void testRequestBody(@RequestBody Map<String,Object> map, HttpServletResponse response) throws IOException {
System.out.println("map："+map);
response.getWriter().write("hello,RequestBody");
}10.3.8、測試效果(map集合)
10.4、@ResponseBody注解的基礎(chǔ)示例
10.4.1、作用
@ResponseBody 注解用于將控制器方法的返回值，作為響應(yīng)報(bào)文的響應(yīng)體，響應(yīng)到瀏覽器
10.4.2、頁面請求示例
<a th:href="@{/test/ResponseBody}" rel="external nofollow" >測試通過@ResponseBody注解響應(yīng)瀏覽器數(shù)據(jù)</a>10.4.3、控制器方法示例(沒使用@ResponseBody注解)
@RequestMapping("/test/ResponseBody")
public String testResponseBody(){
return "success";
}10.4.4、測試效果(沒使用@ResponseBody注解)
沒使用@ResponseBody注解時，return "success"響應(yīng)的是success邏輯視圖所對應(yīng)的頁面
10.4.5、控制器方法示例(有使用@ResponseBody注解)
@RequestMapping("/test/ResponseBody")
@ResponseBody
public String testResponseBody(){
return "success";
}10.4.6、測試效果(有使用@ResponseBody注解)
有使用@ResponseBody注解時，return "success"響應(yīng)的是success字符串
10.5、@ResponseBody注解的進(jìn)階示例
10.5.1、前提條件
- 引入jackson依賴，參考10.3.1節(jié)
- 開啟mvc的注解驅(qū)動，參考10.3.2節(jié)
- 一個匹配json格式的Java類型，參考10.3.3節(jié)
10.5.2、頁面請求示例
<input type="button" value="測試使用@ResponseBody注解響應(yīng)瀏覽器json格式的數(shù)據(jù)" onclick="testResponseBody()">
<script type="text/javascript">
function testResponseBody() {
// 實(shí)例化 XMLHttpRequest 對象
var xhr = new XMLHttpRequest()
// 設(shè)置請求方式和請求路徑
// 因?yàn)閠hymeleaf語法只能應(yīng)用于html的屬性，所以在js中的請求要包含上下文信息
xhr.open("get","/spring_mvc_ajax/test/ResponseBody/json")
// 設(shè)置請求頭
// 一般 get 不需要設(shè)置，而 post 必須設(shè)置請求頭
// 發(fā)送請求
xhr.send()
// 設(shè)置 XMLHttpRequest 對象狀態(tài)變化事件的處理函數(shù)
xhr.onreadystatechange = function () {
// readyState的值為4時，表示已獲取到服務(wù)器的響應(yīng)
if (xhr.readyState == 4){
// 在瀏覽器控制臺輸出服務(wù)器響應(yīng)的內(nèi)容
// JSON.parse()用來將JSON字符串，解析成字符串描述的JavaScript值或?qū)ο?
console.log(JSON.parse(xhr.responseText))
}
}
}
</script>10.5.3、Java對象與Json數(shù)據(jù)的轉(zhuǎn)換關(guān)系
| Java對象 | Json數(shù)據(jù) |
|---|---|
| 實(shí)體類 | Json對象 |
| map集合 | Json對象 |
| list集合 | Json數(shù)組 |
10.5.4、控制器方法示例(實(shí)體類)
使用@ResponseBody注解，可以取代將Java對象通過第三方類庫轉(zhuǎn)換為Json字符串的繁瑣過程
@RequestMapping("/test/ResponseBody/json")
@ResponseBody
public User testResponseBodyjson(){
User user = new User(1001, "admin", "123456", 28, "男");
return user;
}10.5.5、測試效果(實(shí)體類)
10.5.6、控制器方法示例(map集合)
@RequestMapping("/test/ResponseBody/json")
@ResponseBody
public Map<String,Object> testResponseBodyjson(){
User user1 = new User(1001, "admin1", "123456", 28, "男");
User user2 = new User(1002, "admin2", "123456", 28, "男");
User user3 = new User(1003, "admin3", "123456", 28, "男");
Map<String, Object> map = new HashMap<String, Object>();
map.put("1001",user1);
map.put("1002",user2);
map.put("1003",user3);
return map;
}10.5.7、測試效果(map集合)
10.5.8、控制器方法示例(list集合)
@RequestMapping("/test/ResponseBody/json")
@ResponseBody
public List<User> testResponseBodyjson(){
User user1 = new User(1001, "admin1", "123456", 28, "男");
User user2 = new User(1002, "admin2", "123456", 28, "男");
User user3 = new User(1003, "admin3", "123456", 28, "男");
LinkedList<User> users = new LinkedList<User>();
users.add(user1);
users.add(user2);
users.add(user3);
return users;
}10.5.9、測試效果(list集合)
與map集合轉(zhuǎn)換后的json相比，list集合轉(zhuǎn)換后的json外面用的是中括號（數(shù)組的符號），而且還有長度
10.6、@RestController注解
- @RestController 注解是springMVC提供的一個復(fù)合注解；
- 其標(biāo)識的位置是在類上面；
- 其效果相當(dāng)于為類添加了 @Controller 注解，并且為其中的所有方法都添加了 @ResponseBody 注解
@Controller
public class TestAjaxController {
@RequestMapping("/test/ResponseBody")
@ResponseBody
public String testResponseBody(){
return "success";
}
@RequestMapping("/test/ResponseBody/json")
@ResponseBody
public User testResponseBodyjson(){
User user = new User(1001, "admin", "123456", 28, "男");
return user;
}
}@RestController
public class TestAjaxController {
@RequestMapping("/test/ResponseBody")
public String testResponseBody(){
return "success";
}
@RequestMapping("/test/ResponseBody/json")
public User testResponseBodyjson(){
User user = new User(1001, "admin", "123456", 28, "男");
return user;
}
}到此這篇關(guān)于SpringMVC之處理Ajax請求的文章就介紹到這了,更多相關(guān)SpringMVC處理Ajax請求內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要介紹了Java 實(shí)現(xiàn)協(xié)程的方法，幫助大家更好的理解和學(xué)習(xí)Java，感興趣的朋友可以了解下2020-10-10
這篇文章主要介紹了Java基于注解的Excel導(dǎo)出方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-01-01
一篇文章帶你入門java算術(shù)運(yùn)算符(加減乘除余,字符連接)
這篇文章主要介紹了Java基本數(shù)據(jù)類型和運(yùn)算符,結(jié)合實(shí)例形式詳細(xì)分析了java基本數(shù)據(jù)類型、數(shù)據(jù)類型轉(zhuǎn)換、算術(shù)運(yùn)算符、邏輯運(yùn)算符等相關(guān)原理與操作技巧,需要的朋友可以參考下2021-08-08
前端如何傳遞Array、Map類型數(shù)據(jù)到Java后端
這篇文章主要給大家介紹了關(guān)于前端如何傳遞Array、Map類型數(shù)據(jù)到Java后端的相關(guān)資料,文中通過圖文介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考借鑒價值,需要的朋友可以參考下2024-01-01
dom4j創(chuàng)建和解析xml文檔的實(shí)現(xiàn)方法
下面小編就為大家?guī)硪黄猟om4j創(chuàng)建和解析xml文檔的實(shí)現(xiàn)方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-06-06
淺析JDBC與數(shù)據(jù)庫如何進(jìn)行數(shù)據(jù)交互及類型轉(zhuǎn)換
本文主要介紹了JDBC在Java應(yīng)用程序與數(shù)據(jù)庫交互中的關(guān)鍵作用,詳細(xì)解釋了數(shù)據(jù)交互流程和數(shù)據(jù)類型轉(zhuǎn)換機(jī)制,并提供了高級數(shù)據(jù)交互機(jī)制、優(yōu)化建議及實(shí)際驅(qū)動示例,希望對大家有所幫助2026-04-04
SpringBoot獲取yml和properties配置文件的內(nèi)容
這篇文章主要為大家詳細(xì)介紹了SpringBoot獲取yml和properties配置文件的內(nèi)容，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-04-04
SpringBoot實(shí)現(xiàn)國密SM4加密解密的使用示例
在商用密碼體系中,SM4主要用于數(shù)據(jù)加密,本文就來介紹一下SpringBoot實(shí)現(xiàn)國密SM4加密解密的使用示例,具有一定的參考價值,感興趣的可以了解一下2023-10-10
這篇文章主要介紹了解決IDEA中快捷鍵Alt+Enter不能使用的問題,本文通過圖文并茂的形式給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2020-12-12
淺談springboot項(xiàng)目中定時任務(wù)如何優(yōu)雅退出
這篇文章主要介紹了淺談springboot項(xiàng)目中定時任務(wù)如何優(yōu)雅退出？具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-09-09