Axios和SpringBoot传递get请求参数是多维数组时后台无法解析问题解决

本文链接：https://blog.csdn.net/fwhdzh/article/details/105671234

需求

做网上书店课程设计，需要实现一个多维搜索的功能。
在这里插入图片描述
初始接口文档如上。

问题

前端生成的参数数据结构如下
在这里插入图片描述
调用axios，生成的get请求如下
http://188.131.217.222:8080/mall/search?type[]=1&type[]=2&type[]=3&type[]=4&type[]=5&type[]=6&type[]=7&type[]=8&type[]=9&type[]=10&type[]=11&type[]=12&type[]=13&nation[]=%E7%BE%8E%E5%9B%BD&nation[]=%E4%B8%AD%E5%9B%BD&nation[]=%E6%97%A5%E6%9C%AC&nation[]=%E6%84%8F%E5%A4%A7%E5%88%A9&nation[]=%E9%9F%A9%E5%9B%BD&price[]=[0,200]&score[]=[6,7]&score[]=[7,8]&score[]=[8,9]&score[]=[9,10]&name=
虽然很乱，但是可以看出对于每一个数组，都是“数组名[]=该数组中出现的每一个值”的循环。
后台同学写的接口无法正确解析请求，报400错误。

问题分析

后台同学首先发现，SpringBoot无法接受多维数组参数。
在这里插入图片描述
于是我们将二维数组的第二维改为了字符串的形式，即原来的[[1,2],[2,3]被修改为了[“1a2”,“2a3”]。经过测试仍然不行。

问题解决

后台同学发现了可以接受的正确格式
在这里插入图片描述

对于前端，这个格式意味着传入get请求的各个参数是字符串而不是数组，使用js的join方法将原来的各个数组转换成字符串。

经过这般处理，后台可以正常接收处理该get请求。

问题反思与深入

最后的解决方式非常奇怪！在前端，我们每一个参数传入的都是字符串类型。而在后台，我们写的处理函数接受的参数却被声明是int[], String[]这些数组类型。而且在这样的情况下，前后端程序却能正常交互！
基于此，查阅了Restful的相关资料。
Restful对于uri有着非常好的规范建议，但是经过查找，并没有任何资料说明restful不支持[]格式的数组参数传递。事实上，从暂时找到的信息来看，restful理念上对于uri的支持是包罗万象的，不应该出现对于某一格式不支持的情况。更何况，其是一个风格，不应该出现不遵循导致错误的情况。关于Restful的具体介绍可以参见参考内容。
一个可能的解释是后台同学的服务器对该格式的uri解析支持度不够，stackoverflow上的一个评论如下。
在这里插入图片描述

参考内容

其他

Restful基于HTTP，也承接了SOA的理念。作为新兴的被广泛使用的软件架构风格，其和我们之前的思想有很多不同之处。比如在uri中不应出现动词，应以HTTP请求的GET、POST、PUT、DELETE作为规定具体动作的方式，这和我们原来对这些请求方式的固有印象是不同的，也不同于我们或许已经习惯的全部用post的编程方式。但是它确实值得我们去深入了解和勇敢使用。关于SOA和Restful的相关介绍网上有很多，此处不再赘述。
接口设计上，我作为前端和后台的同学产生过一段争执。我想要的接口大多是基于页面的，往往请求参数格式和返回数据格式都很复杂。她想给的接口是基于数据库的，大多数是实体类的增删改查，少量是带有条件的单一实体类查询。从某种方面来说她的接口是更符合SOA一切皆服务的设计理念的，正是我基于界面的接口如果之后开发新的程序，这些接口就大多不能使用，而她提供的却都能使用。但是我觉得如果后台只提供基础的数据库服务的话后台的存在就是没有意义的，它如果将数据整合、筛选都放到前端，一个下订单需要发送几十个orderitem/add的HTTP请求是不可想象的。最后我们达成的最终结果是，一方面她会提供各个实体类基础的增删改查接口，另一方面也会实现一些我根据页面设计的接口。这也是为什么会出现文中所说的多维搜索接口的原因。
本文作者只是一个前端和Web开发的初学者，文中想必有不少遗漏和错误，还望大家能指出帮他改正。