axios使用post提交json数据,嵌套对象不字符串化如何传递?能否传递?

巴谢尔托夫斯基
  • 278

题目描述

后端提供的一个上传图片集合的接口,传递寄送数据结构如下:

{
    "typeCode": "00010002",
    "libType": "1",
    "mainPicUrl": "http://img.redocn.com/sheying/20140731/qinghaihuyuanjing_2820969.jpg",
    "mainPicPath": "路径1",
    "libTitle": "标题1",
    "libDesc": "描述1",
    "uploadUserId": "UID000000004",
    "points": 0,
    "details": [
        {
            "picUrl": "url2",
            "picPath": "path2",
            "picDesc": "图片描述2",
            "points": 0
        },
        {
           
            "picUrl": "url1",
            "picPath": "path1",
            "picDesc": "图片描述",
            "points": 0
        }
    ]
}

请求依赖库:axios
请求方式:post
请求头格式:application/json

我原本请求接口的时候会将上面json里面的details进行字符串化,即JSON.stringify(...),确保对象数组能够传递到后端,但是现在后端跟我说,他需要直接接受到数组类型的参数,即上面json中的details不做别的操作,直接以对象数组的形式往后端传递,这时候传递过程中,对象数组被强制字符串化变成如下图:

clipboard.png

导致请求失败!

你期待的结果是什么?实际看到的错误信息又是什么?

请问各位道友,json格式数据内部属性是对象或者数组的情况下是否可以直接传递?如果可以的话,应该怎么做呢?望赐教,不胜感激!

回复
阅读 5.3k
3 个回答

亲测并不会出现这种情况。
前端代码:

function TEST() {
    axios.post("/api/simple/test", {
        a: "abc",
        b: [{
            c: "c1",
            d: "d1"
        }, {
            c: "c2",
            d: "d2"
        }, {
            c: "c3",
            d: "d3"
        },]
    }).then(function () {
        console.log("1")
    }).catch(function () {
        console.log("2")
    });
}

后端debug效果:

后端接口

Chrome包信息:

Chrome包信息

如果可以,请提供一下 js 代码。

本题既然只是问数组元素怎样才能阻止序列化,那么其实后端是否成功接收到值并不重要了(毕竟题主根本不关心后端)。所以,此时只要看一下 chrome 的包信息即可。因此,可以看出,数组内的元素,并不会被自动序列化,更不会被直接toString()[object]

如果后端使用的是 Node.js ,让后端自己写这段前端代码;
如果后端使用的是其他语言,那么贵司可能需要换个后端,因为跨语言的键值对实现方法还没有问世。

设置 content-type 头?
最暴力的办法就是你自己先 stringily 了之后再发呗

宣传栏