前台ajax与SpringMVC数据交互

最新推荐文章于 2022-05-10 09:26:15 发布

超超的记事本

最新推荐文章于 2022-05-10 09:26:15 发布

阅读量495

点赞数 2

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/weixin_43951020/article/details/93466051

博客介绍了前后端数据传递的方式，包括text数据传递、json数据传输，还讲解了后台使用@RequestBody接收数据的情况。强调@RequestBody用于接收前端传来的json字符串数据，前端需用POST方式提交，且在同一接收方法里，它与@RequestParam()可同时使用，前者最多一个，后者可多个。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.text数据传递
前端：

$.ajax({
          url:'',//请求地址
          type:'post',//请求类型
          data:{loginName:$("#loginName").val()},//传入后台数据
          dataType:'text',//后台返回数据类型
          success : function(data) {
　　　　　　　　　alert("成功！");
 　　　　　 },
          error:function(data){
            　　alert("服务器异常！");
          }
　　　　})

后端：

@RequestMapping("")
    public void existLoginName(HttpServletRequest request,HttpServletResponse response){
        String zh = request.getParameter("loginName");
        User u = userService.selectUserByLoginName(zh);
        try {
            if(u!=null){
                response.getWriter().write("exist");
            }else{
                response.getWriter().write("ok");
            }
        } catch (IOException e) {
                e.printStackTrace();
        }    
    }

2.json数据传输
前端：

$.ajax({
         url:'',
         type:'post',
         dataType:'json',
         data:{loginName:$("#loginName").val()},
         success:function(data){
          　　alert(data.msg);
          }
　　 //注意：这里不能加下面这行
        //contentType:'application/json;charset=UTF-8',
       　})

后台：

@RequestMapping("")
 @ResponseBody
 public Map<String, String> searchUser(String loginName){
 　　 User u= userService.selectUserByLoginName(loginName);
     Map<String,String> map = new HashMap<String,String>();
     if(u!=null){
       map.put("msg", "no");
  　　}else{
  　　  map.put("msg", "ok");
  　　}
 　　 return map;
 }

3.后台@RequestBody接收数据
前端：

$.ajax({
        url:'',
        type:'post',
        contentType:'application/json;charset=UTF-8',//必须有
        dataType:'json',
        data:{loginName:$("#loginName").val()},
        success:function(data){
             alert(data.msg);
             }
        })

后台：

@RequestMapping("")
    @ResponseBody
    public String searchUser(@RequestBody String loginName){
        User u= userService.selectUserByLoginName(loginName);
        JSONObject jo = new JSONObject();
        if(u!=null){
            jo.put("msg", "no");
        }else{
            jo.put("msg", "ok");
        }
        return jo.toString();
    }

在这里要注意一点
@RequestBody主要用来接收前端传递给后端的json字符串中的数据的(请求体中的数据的)；GET方式无请求体，所以使用@RequestBody接收数据时，前端不能使用GET方式提交数据，而是用POST方式进行提交。在后端的同一个接收方法里，@RequestBody与@RequestParam()可以同时使用，@RequestBody最多只能有一个，而@RequestParam()可以有多个。