SpringMVC ajax請(qǐng)求的處理方法介紹

更新時(shí)間：2022年11月08日 09:28:33 作者：學(xué)習(xí)使我快樂(lè)T

Ajax即異步的 JavaScript和XML,是一種無(wú)需重新加載整個(gè)網(wǎng)頁(yè)的情況下,能夠更新部分模塊的網(wǎng)頁(yè)技術(shù),下面這篇文章主要給大家介紹了關(guān)于SpringMVC Ajax請(qǐng)求的處理,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下

準(zhǔn)備工作

①創(chuàng)建maven工程

②添加相關(guān)依賴(lài)，和添加web模塊

③配置web.xml，如配置處理1.編碼過(guò)濾器，2.請(qǐng)求方式的過(guò)濾器，3.前端控制器

④創(chuàng)建springmvc.xml，并進(jìn)行配置

⑤創(chuàng)建控制層controller

一、@RequestBody

index.html

      axios({
            url:"",//請(qǐng)求路徑
            method:"",//請(qǐng)求方式
            //以name=value&name=value的方式發(fā)送的請(qǐng)求參數(shù)
            //不管使用的請(qǐng)求方式是get或post，請(qǐng)求參數(shù)都會(huì)被拼接到請(qǐng)求地址后
            //此種方式的請(qǐng)求參數(shù)可以通過(guò)request.getParameter()獲取
            params:{},
            //以json格式發(fā)送的請(qǐng)求參數(shù)
            //請(qǐng)求參數(shù)會(huì)被保存到請(qǐng)求報(bào)文的請(qǐng)求體傳輸?shù)椒?wù)器
            //此種方式的請(qǐng)求參數(shù)不可以通過(guò)request.getParameter()獲取
            data:{}
       }).then(response=>{
            console.log(response.data);
       });

<div id="app">
    <h1>index.html</h1>
    <input type="button" value="測(cè)試SpringMVC處理ajax" @click="testAjax()">
</div>
<script type="text/javascript" th:src="@{/js/vue.js}"></script>
<script type="text/javascript" th:src="@{/js/axios.min.js}"></script>
<script type="text/javascript">
    var vue = new Vue({
        el:"#app",
        methods:{
            testAjax() {
                axios.post(
                    "/SpringMVC/test/ajax?id=1001",
                    {username:"admin",password:"123456"}
                ).then(response=>{
                    console.log(response.data);
                });
            }
        }
    });
</script>

沒(méi)有ajax就只能使用超鏈接和form表單跟后端交互數(shù)據(jù)，很不方便而且很多功能實(shí)現(xiàn)不了

@RequestBody可以獲取請(qǐng)求體信息，使用@RequestBody注解標(biāo)識(shí)控制器方法的形參，當(dāng)前請(qǐng)求的請(qǐng)求體就會(huì)為當(dāng)前注解所標(biāo)識(shí)的形參賦值

注：

1.@RequestBody:將請(qǐng)求體中的內(nèi)容和控制器方法的形參進(jìn)行綁定

    @RequestMapping("/test/ajax")
    public void testAjax(Integer id, @RequestBody String requestBody, HttpServletResponse response) throws IOException {
        System.out.println("requestBody:" + requestBody);
        System.out.println("id:" + id);
        response.getWriter().write("hello,axios");
    }

二、@RequestBody獲取json格式的請(qǐng)求參數(shù)

index.html

<input type="button" value="使用@RequestBody注解處理json格式的請(qǐng)求參數(shù)" @click="testRequestBody()">

在使用了axios發(fā)送ajax請(qǐng)求之后，瀏覽器發(fā)送到服務(wù)器的請(qǐng)求參數(shù)有兩種格式：

1、name=value&name=value...，此時(shí)的請(qǐng)求參數(shù)可以通過(guò)request.getParameter()獲取，對(duì)應(yīng) SpringMVC中，可以直接通過(guò)控制器方法的形參獲取此類(lèi)請(qǐng)求參數(shù)

2、{key:value,key:value,...}，此時(shí)無(wú)法通過(guò)request.getParameter()獲取，之前我們使用操作 json的相關(guān)jar包gson或jackson處理此類(lèi)請(qǐng)求參數(shù)，可以將其轉(zhuǎn)換為指定的實(shí)體類(lèi)對(duì)象或map集合。在SpringMVC中，直接使用@RequestBody注解標(biāo)識(shí)控制器方法的形參即可將此類(lèi)請(qǐng)求參數(shù) 轉(zhuǎn)換為java對(duì)象

            testRequestBody() {
                axios.post(
                    "/SpringMVC/test/RequestBody/json",
                    {username:"admin",password:"123456",age:23,gender:"男"}
                ).then(response=>{
                    console.log(response.data);
                });
            }

然后來(lái)控制層處理一下

注：使用@RequestBody獲取json格式的請(qǐng)求參數(shù)的條件：

使用@RequestBody注解將json格式的請(qǐng)求參數(shù)轉(zhuǎn)換為java對(duì)象

a>導(dǎo)入jackson的依賴(lài)

b>在SpringMVC的配置文件中設(shè)置<mvc:annotation-driven/>

c>在處理請(qǐng)求的控制器方法的形參位置，直接設(shè)置json格式的請(qǐng)求參數(shù)要轉(zhuǎn)換的java類(lèi)型的形參，使用@RequestBody注解標(biāo)識(shí)即可

jackson依賴(lài)

        <dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-databind</artifactId>
            <version>2.12.1</version>
        </dependency>

開(kāi)啟注解驅(qū)動(dòng)

<mvc:annotation-driven />

方式一：接收成實(shí)體類(lèi)

    @RequestMapping("/test/RequestBody/json")
    public void testRequestBody(@RequestBody User user, HttpServletResponse response) throws IOException {
        System.out.println(user);
        response.getWriter().write("hello,RequestBody");
    }

方式二：接收成map集合

    @RequestMapping("/test/RequestBody/json")
    public void testRequestBody(@RequestBody Map<String,Object> map, HttpServletResponse response) throws IOException {
        System.out.println(map);
        response.getWriter().write("hello,RequestBody");
    }

三、@ResponseBody

@ResponseBody用于標(biāo)識(shí)一個(gè)控制器方法，可以將該方法的返回值直接作為響應(yīng)報(bào)文的響應(yīng)體響應(yīng)到瀏覽器

<a th:href="@{/test/ResponseBody}" rel="external nofollow" >測(cè)試@ResponseBody注解響應(yīng)瀏覽器數(shù)據(jù)</a>

    @RequestMapping("/test/ResponseBody")
    @ResponseBody
    public String testResponseBody() {
        return "success";
    }

四、@ResponseBody響應(yīng)瀏覽器json數(shù)據(jù)

使用@ResponseBody注解響應(yīng)瀏覽器json格式的數(shù)據(jù)

a>導(dǎo)入jackson的依賴(lài)

b>在SpringMVC的配置文件中設(shè)置<mvc:annotation-driven/>

c>將需要轉(zhuǎn)換成json字符串的java對(duì)象直接作為控制器方法的返回值，使用@ResponseBody注解來(lái)標(biāo)識(shí)控制器方法就可以將java對(duì)象直接轉(zhuǎn)換為json字符串，并響應(yīng)到瀏覽器

實(shí)體類(lèi)-->json對(duì)象

    @RequestMapping("/test/ResponseBody/json")
    @ResponseBody
    public User testResponseBodyJson() {
        User user = new User(1001,"admin","123456",20,"男");
        return user;
    }

map-->json對(duì)象

    @RequestMapping("/test/ResponseBody/json")
    @ResponseBody
    public Map<String,Object> testResponseBodyJson() {
        User user1 = new User(1001,"admin1","123456",20,"男");
        User user2 = new User(1001,"admin2","123456",20,"男");
        User user3 = new User(1001,"admin3","123456",20,"男");
        Map<String,Object> map = new HashMap<>();
        map.put("1001",user1);
        map.put("1002",user2);
        map.put("1003",user3);
        return map;
    }

list-->json數(shù)組

    @RequestMapping("/test/ResponseBody/json")
    @ResponseBody
    public List<User> testResponseBodyJson() {
        User user1 = new User(1001,"admin1","123456",20,"男");
        User user2 = new User(1001,"admin2","123456",20,"男");
        User user3 = new User(1001,"admin3","123456",20,"男");
        List<User> list = Arrays.asList(user1, user2, user3);
        return list;
    }

常用的Java對(duì)象轉(zhuǎn)換為json的結(jié)果：

實(shí)體類(lèi)-->json對(duì)象

map-->json對(duì)象

list-->json數(shù)組