使用 jquery ajax 将 javascript 数组变量发送到 php 脚本（获取字符串作为输出而不是数组）

Question

我正在尝试使用 Ajax 将 JavaScript 数组发送到 PHP 脚本，但是当我尝试 var_dump $_POST['file_paths']获取字符串而不是数组作为输出时，我希望以数组格式而不是字符串格式输出。 是不是因为我在contentType: false和processData: false 之类的代码中使用了 Ajax 设置。

我尝试了 JSON 解码和编码仍然将字符串作为输出，如果有人能指出我正确的方向。（需要以数组格式输出而不是字符串）

HTML 标记：（文件夹上传）

<form id='submit' action='' method="post">
            <div id="upload">
                <div class="fileContainer">

                    <input id="myfiles" type="file" name="myfiles[]" multiple="multiple" webkitdirectory multiple directory />
                </div>
            </div>
            <input id="directory_name" type="text" name="directory_name" placeholder="Directory Name" >
</form>

这是一个简单的 js 来获取所有表单数据，如父目录名称、文件数据和文件路径使用

webkit相对路径

获取所有数据后，发送两个数组第一个是文件数组，第二个是 file_paths 数组到 php 脚本，当我 console.log file_paths 数组获取数组时。

JS脚本：

            $(document).ready(function() {
                $('#myfiles').on("change", function() {

                    var myfiles = document.getElementById("myfiles");
                    var file_paths = [];
                    var files = myfiles.files;
                    var new_directory_name =$('#directory_name').val();
                    var data = new FormData();
                    data.append('new_directory_name',new_directory_name);
                    data.append('action', 'upload_folder_to_server');
                    data.append('data_room_id', 55);
                    data.append('username', 'saurabh');
                    for (i = 0; i < files.length; i++) {
                        data.append('file' + i, files[i]);
                        file_paths.push(files[i].webkitRelativePath);
                        console.log(files[i].webkitRelativePath);
                    }
                    //file_paths = JSON.stringify(file_paths);
                    console.log(file_paths);
                    data.append('file_paths', file_paths);
                    $.ajax({
                        method: "POST",
                        url: ajaxurl,
                        contentType: false,
                        data: data,
                        processData: false,
                        //cache: false
                    }).done(function(msg) {
                        $("#loadedfiles").append(msg);
                    });
                });
            });

javascript输出：

Array(3) [ "first folder/second folder/third folder/upload_groupmembers_additonal_login_sample(7).xlsx", "first folder/second folder/upload_groupmembers_additonal_login_sample(7).xlsx", "first folder/upload_groupmembers_additonal_login_sample(7).xlsx" ]

在 PHP 脚本中，当 var_dump file_paths 以字符串格式获取输出时。 PHP脚本：

function upload_folder_to_server()
{
    var_dump($_POST['file_paths']);
}
add_action('wp_ajax_upload_folder_to_server', 'upload_folder_to_server');
add_action('wp_ajax_nopriv_upload_folder_to_server', 'upload_folder_to_server');

输出：

string(232) "first folder/second folder/third folder/upload_groupmembers_additonal_login_sample(7).xlsx,first folder/second folder/upload_groupmembers_additonal_login_sample(7).xlsx,first folder/upload_groupmembers_additonal_login_sample(7).xlsx" 

有人可以解释一下为什么我在 PHP 中获取字符串而在 JavaScript 中获取数组

Answer 1

  var myfiles = document.getElementById("myfiles");
                    var file_paths = [];
                    var files = myfiles.files;
                    var new_directory_name =$('#directory_name').val();
                    var data = new FormData();
                    data.append('new_directory_name',new_directory_name);
                    data.append('action', 'upload_folder_to_server');
                    data.append('data_room_id', 55);
                    data.append('username', 'saurabh');
                    for (i = 0; i < files.length; i++) {
                        data.append('file' + i, files[i]);
                        file_paths.push(files[i].webkitRelativePath);
                        console.log(files[i].webkitRelativePath);
                    }
                    //file_paths = JSON.stringify(file_paths);
                    console.log(file_paths);
                    data.append('file_paths', file_paths);

用这个替换并尝试

var myfiles = document.getElementById("myfiles");
var file_paths = [];
var files = myfiles.files;
var new_directory_name =$('#directory_name').val();
var data = new FormData();
data.set('new_directory_name',new_directory_name);
data.set('action', 'upload_folder_to_server');
data.set('data_room_id', 55);
data.set('username', 'saurabh');
for (i = 0; i < files.length; i++) {
data.set('file' + i, files[i]);
file_paths.push(files[i].webkitRelativePath);
console.log(files[i].webkitRelativePath);
}
data.set('file_paths', file_paths);

Answer 2

您应该可以使用JSON.stringify()和json_decode()来做到这JSON.stringify() 。

在使用JS发送之前对其进行字符串化：

const jsonArr = JSON.stringify(data);

PHP端收到时解析：

$parsedArr = json_decode($_POST['file_paths']);

或者

您可以做的是在PHP端收到字符串时将字符串转换为数组。
您需要做的就是简单地添加以下内容：

$str = isset($_POST['file_paths']) ? $_POST['file_paths'] : ''; // Use condition to check if there is a post request with that name coming in
$arr = explode(",", $str);

在explode()函数的第一个参数中，您可以指定要拆分字符串的位置。 在这里阅读更多。