Array.map 的結果在 Ajax 請求中未定義

Question

我在 javascript 中有非常令人困惑的行為。 HTTP 請求的主體是undefined=&undefined= 。

var data = [1, 2].map(function(item) {
    return {
        Id: item,
        Quantity: 1
    }
});

$.ajax({
    url: "someUrl",
    type: "POST",
    dataType: "json",
    data: data
});

如何防止數據丟失？ 請指教。

Answer 1

問題是您使用Content-Type:application/x-www-form-urlencoded標頭發布data 。 檢查$.ajax 的文檔。 在這種情況下，傳遞的數據將使用$.param方法進行序列化，如果您檢查文檔，則會執行以下操作：

創建適用於 URL 查詢字符串或 Ajax 請求的數組、普通對象或 jQuery 對象的序列化表示。 如果傳遞了 jQuery 對象，它應該包含具有名稱/值屬性的輸入元素。

現在你知道為什么數據被發布為

未定義=未定義&未定義=未定義

最后，如果你想發布一個 JSON 負載，你可以自己對數據進行字符串化並添加application/json內容類型：

$.ajax({
    url: "someUrl",
    type: "POST",
    dataType: "json",
    data: JSON.stringify(data),
    contentType: "application/json; charset=utf-8"
});

Answer 2

ajax函數中的data屬性不是ajax執行返回的數據。 它是發送給它的數據。

使用success回調函數操作返回的數據

$.ajax({
    url: "someUrl",
    type: "POST",
    dataType: "json",
    data: data,
    success: function(dataReturned) {
       // Do something with dataReturned
    }
});

看一下文檔

Answer 3

您需要對data對象進行字符串化，以便在目的地通過$_POST檢索它。

var data = [1, 2].map(function(item) {
    return {
        Id: item,
        Quantity: 1
    }
});
$.ajax({
    async: false,
    url: 'someUrl',
    method: 'post',
    dataType: 'json',
    data: 'data=' + JSON.stringify(data) /** <---- here; add a to retrieve on other end; in this case 'data=' */
});

然后要在您的someUrl訪問它，您可以使用json_decode()對其進行解碼：

$json = json_decode($_POST['data']);

變成：

$json = Array
(
    [0] => stdClass Object
        (
            [Id] => 1
            [Quantity] => 1
        )

    [1] => stdClass Object
        (
            [Id] => 2
            [Quantity] => 1
        )

)

echo $json[0]->Id; // 1