使用 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()函數的第一個參數中，您可以指定要拆分字符串的位置。 在這里閱讀更多。