JSON對象轉成form

當contentType: 'application/x-www-form-urlencoded'方式提交時,提交的數據中為復雜的json,在簽名驗證時,會很麻煩,在網上搜索都沒有找到合適的代碼,都是只支持第一層轉化,並且都是復制的,就寫了一個不限層的轉換方法給需要的朋友參考一下,本人並非js開發

轉換方法

                /**
                 * JSON對象轉為Form提交數據
                 * @param data Json數據
                 * @param key key
                 * @param type 1.數組或對象,-1.值
                 */
                var JsonToFormParmas = function (data, key = '', type = -1) {
                    var params = [];
                    for (var key1 in data) {
                        var val1 = data[key1];
                        if (Array.isArray(val1) == true) {
                            for (var key2 in val1) {
                                var val2 = val1[key2];
                                if (Array.isArray(val2) == true) {
                                    if (type == 1)
                                        params = params.concat(JsonToFormParmas(val2, `${key}[${key1}][${key2}]`, 1));
                                    else
                                        params = params.concat(JsonToFormParmas(val2, `${key}${key1}[${key2}]`, 1));
                                }
                                else if (typeof val2 === 'object') {
                                    if (type == 1)
                                        params = params.concat(JsonToFormParmas(val2, `${key}[${key1}][${key2}]`, 1));
                                    else
                                        params = params.concat(JsonToFormParmas(val2, `${key}${key1}[${key2}]`, 1));
                                }
                                else {
                                    if (type == 1) {
                                        params.push({ key: `${key}[${key1}][]`, val: val1[key2] });
                                    }
                                    else {
                                        params.push({ key: `${key}${key1}[]`, val: val1[key2] });
                                    }
                                }
                            }
                        }
                        else if (typeof val1 === 'object') {
                            if (type == 1)
                                params = params.concat(JsonToFormParmas(val1, `${key}[${key1}]`, 1));
                            else
                                params = params.concat(JsonToFormParmas(val1, `${key}${key1}`, 1));
                        }
                        else {
                            if (type == 1) {
                                params.push({ key: key + `[${key1}]`, val: val1 });
                            }
                            else {
                                params.push({ key: key1, val: val1 });
                            }
                        }
                    }
                    return params;
                }

測試代碼如下

                var data = {
                    name: 'name0',
                    isb: true,
                    list1: [1, 2],
                    list2: [
                        {
                            name: 'name1',
                            value: 'value1'
                        },
                        {
                            name: 'name2',
                            value: 'value2'
                        }],
                    data1: {
                        name: 'name3',
                        list3: [1, 2],
                        list4: [{
                            name: 'name1',
                            value: 'value1'
                        }],
                        data2: {
                            name: 'name4'
                        }
                    }
                };var params = JsonToFormParmas(data);

測試結果

[
    {
        "key": "name",
        "val": "name0"
    },
    {
        "key": "isb",
        "val": true
    },
    {
        "key": "list1[]",
        "val": 1
    },
    {
        "key": "list1[]",
        "val": 2
    },
    {
        "key": "list2[0][name]",
        "val": "name1"
    },
    {
        "key": "list2[0][value]",
        "val": "value1"
    },
    {
        "key": "list2[1][name]",
        "val": "name2"
    },
    {
        "key": "list2[1][value]",
        "val": "value2"
    },
    {
        "key": "data1[name]",
        "val": "name3"
    },
    {
        "key": "data1[list3][]",
        "val": 1
    },
    {
        "key": "data1[list3][]",
        "val": 2
    },
    {
        "key": "data1[list4][0][name]",
        "val": "name1"
    },
    {
        "key": "data1[list4][0][value]",
        "val": "value1"
    },
    {
        "key": "data1[data2][name]",
        "val": "name4"
    }
]

 

新建一個index.html頁面測試

<script>
    var data = {
        name: 'name',
        isb: true,
        list: [,],
        list: [
            {
                name: 'name',
                value: 'value'
            },
            {
                name: 'name',
                value: 'value'
            }],
        data: {
            name: 'name',
            list: [,],
            list: [{
                name: 'name',
                value: 'value'
            }],
            data: {
                name: 'name'
            }
        }
    };
    layui.$.ajax({
        url: 'https://www.baidu.com',
        data: data,
        async: false,
        contentType: 'application/x-www-form-urlencoded'
    })
</script>

 

瀏覽器驗證結果