通过Ajax转入数组,后端通过@RequestBody接收

1、前端代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>清风</title>
<link type="text/css" href="css/css.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/js.js"></script>
<script type="text/javascript" src="js/restfull.js"></script>
</head>

<body style="background: #FFF;">

	<button id="btn1">Send [5,8,12] One</button>

	<!--  页面结束-->
	
	<script type="text/javascript">

			$("#btn1").click(function(){
				// 准备好要发送到服务器端的数组
				var array = [5, 8, 12];		
				// 将JSON数组转换为JSON字符串
				var requestBody = JSON.stringify(array);
				var url = restapi.url_api_e17+"user/array";
				$.ajax({
					"url": url,					  // 请求目标资源的地址
					"type": "post",					  // 请求方式
					"data": requestBody,				  // 请求的参数
					"contentType": "application/json;charset=UTF-8",  // 设置请求体的内容类型,告诉服务器端本次请求的请求体是JSON数据
					"dataType": "json",			    	   // 如服务器端返回的数据类型json
					"success": function(response) {		       // 服务器端成功处理请求后调用的回调函数,response是响应体数据
						if(response.status == 200){
							alert("请求成功");
						}else{
							alert("请求失败");
						}
					},
					"error":function(response) {		       // 服务器端处理请求失败后调用的回调函数,response是响应体数据
						alert(response);
					}
				});
			});

		}
		</script>
	
	
</body>
</html>

  

 

2、后端代码

    @ApiOperation("接收参数数组")
    @PostMapping("/array")
    public Result array( @RequestBody List<Integer> array){
        for (Integer arr : array) {
            log.info("遍历的数组:"+arr);
        }
        return Result.ok();
    }

  

3、输出结果

 

posted @ 2021-07-13 23:34  Amy清风  阅读(389)  评论(0编辑  收藏  举报