Jquery Ajax Posting json ke layanan web

238

Saya mencoba memposting objek JSON ke layanan web asp.net.

Json saya terlihat seperti ini:

var markers = { "markers": [
  { "position": "128.3657142857143", "markerPosition": "7" },
  { "position": "235.1944023323615", "markerPosition": "19" },
  { "position": "42.5978231292517", "markerPosition": "-3" }
]};

Saya menggunakan json2.js untuk merangkai objek json saya.

dan saya menggunakan jquery untuk mempostingnya ke layanan web saya.

  $.ajax({
        type: "POST",
        url: "/webservices/PodcastService.asmx/CreateMarkers",
        data: markers,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(data){alert(data);},
        failure: function(errMsg) {
            alert(errMsg);
        }
  });

Saya mendapatkan kesalahan berikut:

"Primitif JSON tidak valid:

Saya telah menemukan banyak posting yang berkaitan dengan ini dan tampaknya menjadi masalah yang sangat umum tetapi tidak ada yang saya coba perbaiki masalah ini.

Ketika firebug apa yang sedang diposting ke server terlihat seperti ini:

spidol% 5B0% 5D% 5Bosisi% 5D = 128.3657142857143 & spidol 5B0% 5D% 5ParkmarkPosisi% 5D = 7 & spidol 5B1% 5D% 5Bposisi% 5D = 235.1944023323615 & spiders% 5B% 5B%%% 5% 5% 5%%% 5%% 5%% 5%% 5%%% 5%%%% 5%%% 5%%%% 5%%%% 5%% 5%%%% 5%% 5%% 5%% 5%% 5%% 5%% 5%% 5%% 5%% 5%% 5%% 5%% 5%% 5%% 5%% 5%% 5%% 5%% 5%%% 5%%% 5% per%% per%% per% 5% per% per% per%%% 10 %s% %b %dipperpisikawan 5D = 42.5978231292517 & marker% 5B2% 5D% 5BmarkerPosisi% 5D = -3

Fungsi layanan web saya yang dipanggil adalah:

[WebMethod]
public string CreateMarkers(string markerArray)
{
    return "received markers";
}
Kode Firaun
sumber
'kegagalan' tidak disediakan sebagai pengaturan yang mungkin di antara yang terdaftar di api.jquery.com/jQuery.ajax ... mungkin Anda salah mengartikannya dengan 'kesalahan'?
danicotra

Jawaban:

390

Anda sebutkan menggunakan json2.js untuk merangkai data Anda, tetapi data POSTed tampaknya URLEkodekan JSON Anda mungkin sudah melihatnya, tetapi posting ini tentang JSON primitif mencakup mengapa JSON sedang di-URLEkode.

Saya menyarankan agar Anda tidak melewatkan string JSON mentah yang diserialisasi secara manual ke dalam metode Anda . ASP.NET akan secara otomatis JSON membatalkan deserialisasi data POST permintaan, jadi jika Anda membuat serial secara manual dan mengirim string JSON ke ASP.NET, Anda akan benar-benar harus membuat JSON membuat serialisasi string seri JSON Anda.

Saya menyarankan sesuatu yang lebih seperti ini:

var markers = [{ "position": "128.3657142857143", "markerPosition": "7" },
               { "position": "235.1944023323615", "markerPosition": "19" },
               { "position": "42.5978231292517", "markerPosition": "-3" }];

$.ajax({
    type: "POST",
    url: "/webservices/PodcastService.asmx/CreateMarkers",
    // The key needs to match your method's input parameter (case-sensitive).
    data: JSON.stringify({ Markers: markers }),
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(data){alert(data);},
    failure: function(errMsg) {
        alert(errMsg);
    }
});

Kunci untuk menghindari masalah primitif JSON yang tidak valid adalah dengan mengirimkan jQuery string JSON untuk dataparameter, bukan objek JavaScript, sehingga jQuery tidak berusaha untuk meng-URLEkode data Anda.

Di sisi server, sesuaikan parameter input metode Anda dengan bentuk data yang Anda lewati:

public class Marker
{
  public decimal position { get; set; }
  public int markerPosition { get; set; }
}

[WebMethod]
public string CreateMarkers(List<Marker> Markers)
{
  return "Received " + Markers.Count + " markers.";
}

Anda juga dapat menerima array, seperti Marker[] Markers, jika Anda mau. Deserializer yang digunakan ASMX ScriptServices (JavaScriptSerializer) cukup fleksibel, dan akan melakukan apa yang dapat dilakukan untuk mengubah data input Anda menjadi tipe sisi server yang Anda tentukan.

Dave Ward
sumber
4
Anda menulis "agar jQuery tidak berusaha meng-URLEncode data Anda.", Tetapi itu tidak benar. Untuk menghentikan jquery dari urlencoding data Anda, Anda harus mengatur processData ke false.
Softlion
8
Melewati sebuah string sudah cukup untuk mencegah jQuery dari URLEncoding parameter data. Anda dapat mengatur processData ke false, tetapi berlebihan (dan melakukannya sendiri, tanpa mengirimkan string JSON untuk data, tidak cukup).
Dave Ward
1
Masalah yang sama (dan jawaban) ini berlaku untuk Rails juga.
Greg,
2
@DaveWard Apakah contentTypedipertimbangkan jika kita menggunakan GET dan bukan POST?
Royi Namir
@RoyiNamir Jika Anda menggunakan ASMX ScriptServices atau ASPX WebMethods, Anda perlu menggunakan POST agar mereka mengembalikan JSON. Jika Anda MENDAPATKAN, Tipe-Konten benar atau tidak, Anda akan mendapatkan XML.
Dave Ward
19
  1. markersbukan objek JSON. Ini adalah objek JavaScript normal.
  2. Baca tentang data:opsi :

    Data yang akan dikirim ke server. Itu dikonversi ke string kueri , jika belum menjadi string.

Jika Anda ingin mengirim data sebagai JSON, Anda harus menyandikannya terlebih dahulu:

data: {markers: JSON.stringify(markers)}

jQuery tidak mengonversi objek atau array ke JSON secara otomatis.


Tapi saya menganggap pesan kesalahan berasal dari menafsirkan respons layanan. Teks yang Anda kirim kembali bukan JSON. String JSON harus dilampirkan dalam tanda kutip ganda. Jadi, Anda harus melakukan:

return "\"received markers\"";

Saya tidak yakin apakah masalah Anda yang sebenarnya adalah mengirim atau menerima data.

Felix Kling
sumber
Terima kasih atas bantuan Anda pada Felix, saya berpikir bahwa dengan menjalankan marker melalui metode JSON.stringyfy saya mengonversinya menjadi string kueri, saya telah melakukan seperti yang Anda sarankan tetapi sayangnya tidak berfungsi, saya tidak memposting yang berikut.
Kode Firaun
marker =% 7B% 22 penanda% 22% 3A% 5B% 7B% 22 posisi% 22% 3A% 22128.3657142857143% 22% 2C% 22 markerPosisi% 22% 3A% 227% 22% 7D% 2C% 7B% 22 posisi% 22% 3A% 22235.19440233215 % 22% 2C% 22markerPosisi% 22% 3A% 2219% 22% 7D% 2C% 7B% 22posisi% 22% 3A% 2242.5978231292517% 22% 2C% 22markerPosisi% 22% 3A% 22-3% 22D 7D% 5D% 7D
Kode Firaun
@ Dreamguts: Agak tidak jelas bagi saya apa yang Anda inginkan. Apakah Anda ingin mengirim markerssebagai string JSON?
Felix Kling
Hai Felix, ya saya ingin mengirim objek penanda sebagai string JSON sehingga saya dapat menggunakannya di layanan web saya.
Kode Firaun
@ Dreamguts: Maka harusnya bekerja seperti ini. Juga "kode" yang Anda poskan di komentar terlihat ok. Tentu saja Anda harus mendekode dengan benar di sisi server dan mungkin Anda harus mengubah nama parameter, saya tidak tahu.
Felix Kling
3

Saya mencoba solusi Dave Ward. Bagian data tidak dikirim dari browser di bagian payload dari permintaan posting karena contentType diatur ke "application/json". Setelah saya menghapus baris ini semuanya bekerja dengan baik.

var markers = [{ "position": "128.3657142857143", "markerPosition": "7" },

               { "position": "235.1944023323615", "markerPosition": "19" },

               { "position": "42.5978231292517", "markerPosition": "-3" }];

$.ajax({

    type: "POST",
    url: "/webservices/PodcastService.asmx/CreateMarkers",
    // The key needs to match your method's input parameter (case-sensitive).
    data: JSON.stringify({ Markers: markers }),
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(data){alert(data);},
    failure: function(errMsg) {
        alert(errMsg);
    }
});
Usha
sumber
2

Saya telah menemukan yang satu ini juga dan ini adalah solusi saya.

Jika Anda menjumpai pengecualian objek json yang tidak valid saat mem-parsing data, meskipun Anda tahu bahwa string json Anda benar, tegaskan data yang Anda terima dalam kode ajax Anda sebelum mem-parsingnya ke JSON:

$.post(CONTEXT+"servlet/capture",{
        yesTransactionId : yesTransactionId, 
        productOfferId : productOfferId
        },
        function(data){
            try{
                var trimData = $.trim(JSON.stringify(data));
                var obj      = $.parseJSON(trimData);
                if(obj.success == 'true'){ 
                    //some codes ...
Clare Panganoron
sumber
1

Saya punya pertanyaan,

$("#login-button").click(function(e){ alert("hiii");

        var username = $("#username-field").val();
        var password = $("#username-field").val();

        alert(username);
        alert("password" + password);



        var markers = { "userName" : "admin","password" : "admin123"};
        $.ajax({
            type: "POST",
            url: url,
            // The key needs to match your method's input parameter (case-sensitive).
            data: JSON.stringify(markers),
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(data){alert("got the data"+data);},
            failure: function(errMsg) {
                alert(errMsg);
            }
        });

    });

Saya memposting detail login di json dan mendapatkan string sebagai "Success", tapi saya tidak mendapatkan respons.

Priya B
sumber
1
Ini bukan jawaban untuk pertanyaan itu. Jika Anda ingin mengajukan Pertanyaan, buka menu "Pertanyaan" dan klik "Ajukan Pertanyaan", dan jika pertanyaan Anda terkait dengan pertanyaan ini maka berikan tautan referensi dalam pertanyaan Anda.
Mittal Patel
-2

Silakan ikuti ini dengan panggilan ajax ke layanan web java var param = {feildName: feildValue}; JSON.stringify ({data: param})

$.ajax({
            dataType    : 'json',
            type        : 'POST',
            contentType : 'application/json',
            url         : '<%=request.getContextPath()%>/rest/priceGroups',
            data        : JSON.stringify({data : param}),
            success     : function(res) {
                if(res.success == true){
                    $('#alertMessage').html('Successfully price group created.').addClass('alert alert-success fade in');
                    $('#alertMessage').removeClass('alert-danger alert-info');
                    initPriceGroupsList();
                    priceGroupId = 0;
                    resetForm();                                                                    
                }else{                          
                    $('#alertMessage').html(res.message).addClass('alert alert-danger fade in');
                }
                $('#alertMessage').alert();         
                window.setTimeout(function() { 
                    $('#alertMessage').removeClass('in');
                    document.getElementById('message').style.display = 'none';
                }, 5000);
            }
        });
Ravi Panchal
sumber
di sini cara daftar objek diteruskan ke json ke panggilan ajax dari layanan web java.
Ravi Panchal