通过POST向Django发送文本数组，无法获取为数组仅得到字符串

问题详情 #

我从多个CKEditor获取文本组成数组，前端通过以下代码发送请求给Django：

chk_vals = ["Some text","Other text"];
const data = new URLSearchParams();
data.append("csrfmiddlewaretoken", "{{csrf_token}}");
data.append("tmplData", JSON.stringify(chk_vals));

fetch(uri, {
        method: 'post',
        body: data,
    })
    .then(response => response.json())
    .then(data => {
        // 后续处理逻辑
    });

Chrome网络请求显示tmplData的参数值是["Some text","Other text"]。

后端Django处理代码：

data = request.POST
templateArr = data.getlist('tmplData')
templateList = list(templateArr)

但实际得到的templateList长度为1，是整个JSON格式的字符串；而且文本里可能包含逗号，没法用拆分的方式转成数组。试过用data.getlist('tmplData[]')，或者不做JSON.stringify直接发送数组，结果templateArr为空，问题依旧。

两种可行解决方案 #

方案1：后端解析JSON字符串 #

前端已经把数组序列化为JSON字符串，后端直接取出该字符串并解析成数组即可，不用getlist：

import json

data = request.POST
# 获取前端传来的JSON字符串
template_json_str = data.get('tmplData')
# 解析为Python列表
templateList = json.loads(template_json_str)

这种方法能完美保留原始文本内容，不受逗号等特殊字符影响。

方案2：前端调整数组传递方式 #

如果想让后端用getlist直接拿到数组，前端需要遍历数组，逐个将元素添加到URLSearchParams中：

chk_vals = ["Some text","Other text"];
const data = new URLSearchParams();
data.append("csrfmiddlewaretoken", "{{csrf_token}}");
// 遍历数组，每个元素单独append
chk_vals.forEach(text => {
    data.append("tmplData", text);
});

fetch(uri, {
        method: 'post',
        body: data,
    })
    .then(response => response.json())
    .then(data => {
        // 后续处理逻辑
    });

此时后端用data.getlist('tmplData')就能拿到长度为2的列表，每个元素对应CKEditor的文本内容。

注意：不要直接把数组传给append，URLSearchParams会把数组转成逗号分隔的字符串，后端依旧拿不到数组结构，必须逐个添加元素。

内容的提问来源于stack exchange，提问作者Habbo's Dreams