能否通过该AJAX代码将表单数据传递至PHP脚本？

结论 #

当前写法下，vals数组无法按现有逻辑成功传递给PHP脚本并正确解析，核心问题出在数组的编码和传递方式上。

问题原因 #

• 当直接把JS数组vals传入encodeURIComponent时，JavaScript会自动将数组转换为逗号分隔的字符串（例如"123,项目描述,2024-01-01,2024-02-01,10000"），编码后拼接到URL中。
• PHP端接收到的$_GET['variables']是这个逗号分隔的字符串，而非数组。如果某个表单字段本身包含逗号，还会直接导致数据分割错乱，无法正确还原原始输入。

可行的修改方案 #

方案1：将数组转为JSON字符串传递

修改AJAX函数中构造请求参数的代码：

ajax: function (task, callback, variables) {
    let xhr = new XMLHttpRequest();
    // 把数组转为JSON字符串再编码
    let send = "&variables=" + encodeURIComponent(JSON.stringify(variables));
    xhr.open("GET", "db_data.php?task=" + encodeURIComponent(task) + send, true);
    xhr.onreadystatechange = () => {
        if (xhr.readyState === XMLHttpRequest.DONE){
            let json = JSON.parse(xhr.responseText);
            callback(json);
            console.log(json);
        }
    }
    xhr.send(null);
}

PHP端解析代码：

// 解析JSON字符串为PHP数组
$variables = json_decode($_GET['variables'], true);
// 按索引获取对应值
$projektnummer = $variables[0];
$beschreibung = $variables[1];
// ...其他字段

方案2：拆分为独立的URL参数（更符合GET请求规范）

将数组中的每个元素作为独立的URL参数传递：

ajax: function (task, callback, variables) {
    let xhr = new XMLHttpRequest();
    // 将数组转为多个键值对参数
    let paramStr = variables.map((val, idx) => `var${idx}=${encodeURIComponent(val)}`).join('&');
    let url = `db_data.php?task=${encodeURIComponent(task)}&${paramStr}`;
    xhr.open("GET", url, true);
    xhr.onreadystatechange = () => {
        if (xhr.readyState === XMLHttpRequest.DONE){
            let json = JSON.parse(xhr.responseText);
            callback(json);
            console.log(json);
        }
    }
    xhr.send(null);
}

PHP端直接通过对应参数名获取：

$projektnummer = $_GET['var0'];
$beschreibung = $_GET['var1'];
$startdatum = $_GET['var2'];
// ...其他字段

方案3：改用POST请求（推荐用于表单数据）

如果表单数据包含特殊字符或数据量较大，POST请求比GET更合适：

ajax: function (task, callback, variables) {
    let xhr = new XMLHttpRequest();
    xhr.open("POST", "db_data.php", true);
    // 设置表单数据的Content-Type
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    // 构造POST表单数据，这里用JSON方式传递数组
    let formData = `task=${encodeURIComponent(task)}&variables=${encodeURIComponent(JSON.stringify(variables))}`;
    xhr.onreadystatechange = () => {
        if (xhr.readyState === XMLHttpRequest.DONE){
            let json = JSON.parse(xhr.responseText);
            callback(json);
            console.log(json);
        }
    }
    // 发送表单数据
    xhr.send(formData);
}

PHP端通过$_POST获取并解析：

$task = $_POST['task'];
$variables = json_decode($_POST['variables'], true);

内容的提问来源于stack exchange，提问作者grotivanhelden