java

关注公众号 jb51net

关闭
首页 > 软件编程 > java > Spring MVC 处理Ajax请求

Spring MVC 处理Ajax请求的方式详解

作者:Miaow.Y.Hu

本文介绍了在SpringMVC中处理Ajax请求的方法,主要依赖于Controller和返回类型的配置,使用@RequestMapping注解处理Ajax的控制器方法,本文给大家介绍Spring MVC 处理Ajax请求的方式,感兴趣的朋友跟随小编一起看看吧

在Spring MVC中我们通常处理Ajax的方式主要依赖于控制器(Controller)和返回类型的配置。

使用@RequestMapping注解

在Spring MVC中,可以使用@RequestMapping中注解处理Ajax中的控制器方法。通常,Ajax 请求会使用 GET 或 POST 方法。

import org.springframework.web.bind.annotation.*;
@RestController
@RequestMapping("/api")
public class MyController {
    @GetMapping("/data")
    public ResponseEntity<MyData> getData() {
        MyData data = new MyData(); // 创建数据对象
        return ResponseEntity.ok(data); // 返回数据
    }
    @PostMapping("/data")
    public ResponseEntity<String> postData(@RequestBody MyData data) {
        // 处理接收到的数据
        return ResponseEntity.ok("Data received successfully");
    }
}

@RequestBody

@RequestBody可以获取请求体信息,使用@RequestBody注解标识控制器方法的形参,当前请求的请求体就会为当前注解所标识的形参赋值

<!--此时必须使用post请求方式,因为get请求没有请求体-->
<form th:action="@{/test/RequestBody}" method="post">
    用户名:<input type="text" name="username"><br>
    密码:<input type="password" name="password"><br>
    <input type="submit">
</form>
@RequestMapping("/test/RequestBody")
public String testRequestBody(@RequestBody String requestBody){
    System.out.println("requestBody:"+requestBody);
    return "success";
}

前端发送请求:

/* 方式一
axios({
    method: 'get',  // 请求方式,以name = value & name = value的形式传递参数不管传递的方式是get还是post,请求参数都会被拼接到请求地址后。
          此种方式的请求参数可以通过request.getParameter()获取
    url: ‘', //请求路径,
    params: {
       username: 'admin',  //以这种json方式发送的请求参数,请求参数被放在请求体中,并传输到服务器,这种方式传值,是没法被request.getParameter()获取的
       password: '123456'
       }
}).then(function (response) {
      console.log(response);
      vm.msg = response.data;
    }
*/
/* axios的请求格式
 * 请求方式:
* 1. axios.get()
* 2. axios.post()
* 3. axios.put()
* 4. axios.delete()
* 5. axios.head()
* 6. axios.options()
* 7. axios.patch()
* 8. axios.request()
//方式二
  axios.get("/test/RequestBody").then(function (response) {
      console.log(response);
      vm.msg = response.data;
      });
     },
*/
      /*
      * 请求体的格式
      * 1. 使用url传递参数
      * 2. 使用json传递参数
      */

RequestBody获取json格式的请求参数

在使用了axios发送ajax请求之后,浏览器发送到服务器的请求参数有两种格式:

1、name=value&name=value...,此时的请求参数可以通过request.getParameter()获取,对应SpringMVC中,可以直接通过控制器方法的形参获取此类请求参数

2、{key:value,key:value,...},此时无法通过request.getParameter()获取,之前我们使用操作json的相关jar包gson或jackson处理此类请求参数,可以将其转换为指定的实体类对象或map集合。在SpringMVC中,直接使用@RequestBody注解标识控制器方法的形参即可将此类请求参数转换为java对象

使用@RequestBody获取json格式的请求参数的条件:
导入jackson的依赖

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

Spring MVC的配置文件中设置开启MVC注解驱动

<!--开启mvc的注解驱动-->
<mvc:annotation-driven />

在控制器方法的形参位置,设置json格式的请求参数要转换成的java类型(实体类或map)的参数,并使用@RequestBody注解标识

<input type="button" value="测试@RequestBody获取json格式的请求参数"@click="testRequestBody()">
<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:{
            testRequestBody(){
                axios.post(
                    "/SpringMVC/test/RequestBody/json",
                    {username:"admin",password:"123456"}
                ).then(response=>{
                    console.log(response.data);
                });
            }
        }
    });
</script>
//将json格式的数据转换为map集合
@RequestMapping("/test/RequestBody/json")
public void testRequestBody(@RequestBody Map<String, Object> map,HttpServletResponse response) throws IOException {
    System.out.println(map);
    //{username=admin, password=123456}
    response.getWriter().print("hello,axios");
}
//将json格式的数据转换为实体类对象
@RequestMapping("/test/RequestBody/json")
public void testRequestBody(@RequestBody User user, HttpServletResponseresponse) throws IOException {
    System.out.println(user);
    //User{id=null, username='admin', password='123456', age=null,gender='null'}
	response.getWriter().print("hello,axios");
}

@RequestBody

@ResponseBody用于标识一个控制器方法,可以将该方法的返回值直接作为响应报文的响应体响应到浏览器

@RequestMapping("/testResponseBody")
public String testResponseBody(){
    //此时会跳转到逻辑视图success所对应的页面
    return "success";
}
@RequestMapping("/testResponseBody")
@ResponseBody
public String testResponseBody(){
    //此时响应浏览器数据success
    return "success";
}

RequestBody响应浏览器json数据

服务器处理ajax请求之后,大多数情况都需要向浏览器响应一个java对象,此时必须将java对象转换为json字符串才可以响应到浏览器,之前我们使用操作json数据的jar包gson或jackson将java对象转换为json字符串。在SpringMVC中,我们可以直接使用@ResponseBody注解实现此功能。

@ResponseBody响应浏览器json数据的条件:
1、导入jackson的依赖

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

2、SpringMVC的配置文件中设置开启mvc的注解驱动

<!--开启mvc的注解驱动-->
<mvc:annotation-driven />

3、使用@ResponseBody注解标识控制器方法,在方法中,将需要转换为json字符串并响应到浏览器的java对象作为控制器方法的返回值,此时SpringMVC就可以将此对象直接转换为json字符串并响应到浏览器。

<input type="button" value="测试@ResponseBody响应浏览器json格式的数据"@click="testResponseBody()"><br>
<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:{
            testResponseBody(){
                axios.post("/SpringMVC/test/ResponseBody/json").then(response=>{
                    console.log(response.data);
                });
            }
        }
    });
</script>
//响应浏览器list集合
@RequestMapping("/test/ResponseBody/json")
@ResponseBody
public List<User> testResponseBody(){
    User user1 = new User(1001,"admin1","123456",23,"男");
    User user2 = new User(1002,"admin2","123456",23,"男");
    User user3 = new User(1003,"admin3","123456",23,"男");
    List<User> list = Arrays.asList(user1, user2, user3);
    return list;
}
//响应浏览器map集合
@RequestMapping("/test/ResponseBody/json")
@ResponseBody
public Map<String, Object> testResponseBody(){
    User user1 = new User(1001,"admin1","123456",23,"男");
    User user2 = new User(1002,"admin2","123456",23,"男");
    User user3 = new User(1003,"admin3","123456",23,"男");
    Map<String, Object> map = new HashMap<>();
    map.put("1001", user1);
    map.put("1002", user2);
    map.put("1003", user3);
    return map;
}
//响应浏览器实体类对象
@RequestMapping("/test/ResponseBody/json")
@ResponseBody
public User testResponseBody(){
    return user;
}

使用 @RestController

使用 @RestController 注解可以简化控制器的定义。这个注解是 @Controller@ResponseBody 的组合,表示该控制器中的所有方法都返回 JSON 或 XML 格式的数据,而不是视图。

到此这篇关于Spring MVC 处理Ajax请求的方式的文章就介绍到这了,更多相关Spring MVC 处理Ajax请求内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

您可能感兴趣的文章:
阅读全文