SpringMVC接收Json数据

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_34802416/article/details/81780741

目录

文章目录


#SpringMVC接收Json数据

之前学习使用SSM框架来开发程序前端使用的是JSP,使用JSP虽然开发方便,但实在太不优雅了!还是通过Json来实现前后端的数据交互更爽!所以这就涉及到两个问题:

  • 如何通过前端页面发送Json数据?
  • 如何通过SpringMVC来接收并处理Json数据?

带着以上两个问题阅读下面的部分,你应该很快就能理解并掌握最基本的Json数据交互。

本文中使用的FastJson来处理Json数据

##1 前端页面

前端页面通过三个按钮触发点击事件,调用js代码,向后台分别发送字符串、数字、List数据。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title></title>
        <!-- 引用jquery文件 -->
		<script src="js/JQuery3.3.1.js"></script>
	</head>
	<body>
		<input type="button" onclick="ajaxString()" value="send String"></input>
		<input type="button" onclick="ajaxInteger()" value="send Integer"></input>
		<input type="button" onclick="ajaxList()" value="send List"></input>
	</body>
	<script type="text/javascript">
		//发送字符串
		function ajaxString(){
			$.post("ajax/String",
			{
				str1:'Hello', 
				str2:'World'
			}, 
			function(data){
				alert("success");
			});
		}
		
        //发送数值
		function ajaxInteger(){			
			$.post("ajax/Integer",
			{
				val1:2018, 
				val2:2019
			}, 
			function(data){
				alert("success");
			});
		}
		
        //发送List,使用Json数据格式
		function ajaxList(){
			var myList = new Array('hello','ajax');
			var myMap = {
				'a':'1',
				'b':'2'
			}
			$.ajax({
				type:"post",
				url:"ajax/List",
				contentType:'application/json;charset=UTF-8',	//发送信息至服务器时内容编码类型
				traditional:true,	//传统的方式来序列化数据
				data:JSON.stringify({uid:233, myList: myList, myMap: myMap}),
				success:function(data){
					alert("success");
				}
			});
		}
	</script>
</html>

ajax方法的属性(了解更多)很多,这里不细说。

了解$.post、$.get与$.ajax的区别

2 后台代码

package com.rhine.studySSM.controller;

import java.util.ArrayList;
import java.util.Iterator;
import java.util.List;
import java.util.Map;
import java.util.Set;

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.ResponseBody;

import com.alibaba.fastjson.JSON;
import com.alibaba.fastjson.JSONObject;
import com.rhine.studySSM.domain.User;

@Controller
@RequestMapping("/ajax")
public class AjaxController {
	
	@RequestMapping("/String")
	@ResponseBody
	public void getString(String str1, String str2) {
		System.out.println(str1+" "+str2);
	}
	
	@RequestMapping("/Integer")
	@ResponseBody
	public void getInteger(int val1, String val2) {
		System.out.println(val1+" "+val2);
	}
	
	//接收json数据格式,注意@RequestBody注解的使用
	@RequestMapping("/List")
	@ResponseBody
	public void getList(@RequestBody JSONObject json) {
		//去除字符串
		String uid = json.getString("uid");
		System.out.println("uid:" + uid);
		
		//转换成List
		List<String> myList = json.getObject("myList", List.class);
		for(String str : myList) {
			System.out.println(str);
		}
		
		//转换成Map类型
        Map<String, String> myMap = json.getObject("myMap", Map.class);
        Set<String> myMapKeySet = myMap.keySet();
        for(Iterator<String> iter = myMapKeySet.iterator(); iter.hasNext(); ){
            String index = iter.next();
            System.out.println("key: " + index + " value: " + myMap.get(index));
        }
	}
}

用到的注解:

  • @ResponseBody注解
    • 表示该方法的返回值直接写入HTTP response body中,而不是将返回值作为跳转路径(在以后利用SpringMvc向前端发送数据时,它就能派上大用场了!)。
    • 你可以尝试去掉ResponseBody注解后,观察前端页面是否还会在按钮点击后,弹出success的消息框。并且此时打开浏览器F12后台调试页面,可以在console中找到页面404的错误。
  • @RequestBody注解
    • 常用于处理Content-Type
    • 由于application/json,application/xml都不是application/x-www-form-urlencoded字符编码的内容,所以需要使用这个注解来进行处理。

##3 效果

最后还是放个图,看看效果。
这里写图片描述
##4 最后

回答文章开始的两个问题:

  • 如何通过前端页面发送Json数据?
    • jQuery
    • ajax
  • 如何通过SpringMVC来接收并处理Json数据?
    • 使用@ResponseBody、@RequestBody注解

下一篇:[《SpringMVC发送Json数据》](https://blog.csdn.net/qq_34802416/article/details/81783280)

猜你喜欢

转载自blog.csdn.net/qq_34802416/article/details/81780741