Jquery-服務器無法讀取從Ajax發送的資料

我目前使用 ajax 從我的 Web 應用程式向 api 服務器發送資料。但這就像服務器無法讀取我的資料，因為我的資料的 typeData 與郵遞員發送的 typeData 不同。

我正在測驗從郵遞員發送資料并且作業正常。這是通過郵遞員發送資料的捕獲。

這是我的ajax代碼

data = {
    nama_lengkap: "user name",
    nama_panggilan: "user",
    ttl: "new york, 10 april 1999",
    jenis_kelamin: "male",
    agama: "-",
    email: "[email protected]",
    no_telp: "1234567",
    nama_ayah: "Johnson",
    nama_ibu: "Kadita",
    pendidikan_terakhir: "S1",
    organisasi: "-",
    kejuaraan: "-",
};

obj = JSON.stringify(data);
t = Cookies.get("user");

$.ajaxSetup({
    headers: {
        "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
        accept: "application/json",
    },
});
$.ajax({
    type: "POST",
    timeout: 0,
    headers: {
        Accept: "application/json",
    },
    beforeSend: function (xhr) {
        xhr.setRequestHeader("Authorization", "Bearer "   t);
    },
    url: "http://localhost:8000/api/anggota/store",
    contentType: "application/json",
    data: obj,
    dataType: "json",
    processData: false,
    contentType: false,
    success: function (response) {
        console.log(response);
    },
    error: function (xhr, status, err) {
        console.error(JSON.parse(xhr.responseText));
    },
});

但我收到這樣的錯誤回應文本

{
    "success": false,
    "code": 500,
    "message": "Gagal",
    "errors": [
        {
            "nama_lengkap": [
                "The nama lengkap field is required."
            ],
            "nama_panggilan": [
                "The nama panggilan field is required."
            ],
            "ttl": [
                "The ttl field is required."
            ],
            "jenis_kelamin": [
                "The jenis kelamin field is required."
            ],
            "agama": [
                "The agama field is required."
            ],
            "email": [
                "The email field is required."
            ],
            "no_telp": [
                "The no telp field is required."
            ],
            "nama_ayah": [
                "The nama ayah field is required."
            ],
            "nama_ibu": [
                "The nama ibu field is required."
            ],
            "pendidikan_terakhir": [
                "The pendidikan terakhir field is required."
            ]
        }
    ]
}

嗯，我的代碼有什么問題？任何線索都有幫助。

謝謝

uj5u.com熱心網友回復：

你不應該使用Json.Stringify()！

直接使用資料物件即可。

試試這個：

data = {
    nama_lengkap: "user name",
    nama_panggilan: "user",
    ttl: "new york, 10 april 1999",
    jenis_kelamin: "male",
    agama: "-",
    email: "[email protected]",
    no_telp: "1234567",
    nama_ayah: "Johnson",
    nama_ibu: "Kadita",
    pendidikan_terakhir: "S1",
    organisasi: "-",
    kejuaraan: "-",
};

t = Cookies.get("user");

$.ajaxSetup({
    headers: {
        "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
        accept: "application/json",
    },
});
$.ajax({
    type: "POST",
    timeout: 0,
    headers: {
        Accept: "application/json",
    },
    beforeSend: function (xhr) {
        xhr.setRequestHeader("Authorization", "Bearer "   t);
    },
    url: "http://localhost:8000/api/anggota/store",
    contentType: "application/json",
    data,
    dataType: "json",
    processData: false,
    contentType: false,
    success: function (response) {
        console.log(response);
    },
    error: function (xhr, status, err) {
        console.error(JSON.parse(xhr.responseText));
    },
});

uj5u.com熱心網友回復：

見字串化：

它的結果是JSON string。

摘自官方檔案：

data 選項可以包含 key1=value1&key2=value2 形式的查詢字串，或 {key1: 'value1', key2: 'value2'} 形式的物件。

所以我建議你object在發送到服務器時使用該格式。

uj5u.com熱心網友回復：

我的代碼中的 typeData 沒有錯。主要問題是因為我 ContentType: false在代碼末尾宣告。

它應該像這樣

$.ajax({
            beforeSend: function (xhr) {
                xhr.setRequestHeader("Authorization", "Bearer "   t);
            },   
            url: "http://localhost:8000/api/anggota/store",
            method: "POST",
            timeout: 0,
            data: form_anggota,
            contentType: "application/json",
            dataType: "json",
            success: function (response) {
                console.log(response);
            },
            error: function(xhr){
                console.log(JSON.parse(xhr.responseText))
            }
        });

標籤：jQuery 阿贾克斯 邮差

上一篇：LaravelAjax獲取資料一對多關系

下一篇：使用DataTable按組對表進行排序