最近小程序开发过程遇到一个问题,就是我在调后端接口时传的数组对象居然不能正常解析,会变成
[object Object]这样的字符串。自然,后端也不能用这样的数据。如图:
这是我的数据:
然后,这是我的请求数据
我的mater_arr数据打印出来是一个正常的数组,可是传过去的确实是一个[object Object]这样的字符串,我找了很久的文章,得到一个解决方案,就是使用JSON序列化,即使用JSON.stringify来把对象解析成字符串。
这个,我觉得也是一个比较好的方案,但是需要后端配合,再把这个对象字符串解析出来;奈何,我的后端同志不肯帮这个忙,于是我又再去搜索资料。
找了很久,终于找到一个办法,不过挺麻烦的,就是使用如下的数据结构来上传:
const data = {
id: 1,
title: '测试'
}
// 上面是我们要正常上传的数据, 下面来组装数据
// 例如mater_arr是一个[{id: 1, title: '石头'}, {id: 2, title: '钻石'}]这样的数据
this.mater_arr.forEach((item, idx) => {
for (const key in item) {
const _data = mater_arr[idx][key] = item[key]
data.push(_data)
}
})
这样,传递过去的数据结构其实就成了:
{
id: 1,
title: '测试',
mater_arr[0][id]: 1,
mater_arr[0][title]: 石头,
...
}
个人认为,这应该是和后端的接收方式有关系,绕了一个圈子后端总算成功拿到了mater_arr这个数组对象。
其实,我做到这里时想用FormData对象试试能不能传的,结果发现小程序没有这个对象,无语了。。。
总结
其实这应该是属于传输过程中的协议问题吧?因为我们后端要求我们传的过程Content-Type必须为x-www-form-urlencoded,然而这个类型的数据似乎是不能嵌套对象的,所以就造成了显示[object Object]的问题。
这里顺便列几个常用格式的区别:
| 格式 | 作用 | | ---- | ---- | --- | | application/x-www-form-urlencoded | 默认的传输格式,通过key,value,&的方式拼接而成 | | multipart/form-data | 即可以上传键值对,也可以传输文件 | | application/json | 传递的数据是json字符串,需要后端处理 |
解决方法我当然觉得JSON.stringify比较不错,现在后端框架处理这些请求的似乎很简单就能自动转的。
另一个解决方案,就是如我上述那样传参,当然这只在我这里用过,是可行的,说不定还与后端取值有关。后端取值方式好像是$_POST['xx']直接取的,我也不是很清楚。
言而总之,总而言之。以前,都没太注意这些请求的格式区别,用着工具默认的格式就开始用了,碰到问题都不知道咋回事,这次总算懂一点了额。