一、问题描述
最近做项目遇到了一个问题,前端利用封装好的axios发一个请求给后端,请求可以发送成功,但拿不到正确的数据,在swagger上测试接口拿到的数据和在chorme控制台测试拿到的数据不一样,通过仔细比较,发现控制台payload下一个是Form Data,另一个是Request Payload,所以我想问题就在这里。
如下图,正确的方式
错误的方式
再看一下有问题的代码,只列举主要地方
看一下封装的接口请求函数
看一下,请求时传的参数
二、问题解决
那么既然知道了问题所在,现在就是想办法将Request Payload转换为Form Data格式
解决办法就是加一个headers: { "content-type": "application/x-www-form-urlencoded" },
然后现在看一下,控制台payload显示什么
好了,已经变成Form Data格式了,但是仔细观察,现在这样的情况,传的参数使用对象包裹着的,而正确的做法是不用对象包裹,如图
那么接受下来就是想办法,不用对象包裹,解决办法是,不能常规的封装成一个对象作为参数传进去,而是必须要Form Data格式的数据了,使用formData包裹数据
正确的代码如下
现在再看一下payload下的内容
现在这样的结果就和swagger上测试的一模一样了,并且拿到的数据也是正确的