¿Cómo enviar JSON en lugar de una cadena de consulta con $.ajax?

Resuelto Redsandro asked hace 11 años • 4 respuestas

¿Alguien puede explicar de forma sencilla cómo hacer que jQuery envíe JSON real en lugar de una cadena de consulta?

$.ajax({
    url      : url,
    dataType : 'json', // I was pretty sure this would do the trick
    data     : data,
    type     : 'POST',
    complete : callback // etc
});

De hecho, esto convertirá su JSON cuidadosamente preparado en una cadena de consulta. Una de las cosas molestas es que cualquier contenido array: []de su objeto se convertirá a array[]: [], probablemente debido a las limitaciones de la consulta.

Redsandro avatar Oct 02 '12 23:10 Redsandro
Aceptado

Debe usar JSON.stringifypara serializar primero su objeto en JSON y luego especificarlo contentTypepara que su servidor entienda que es JSON. Esto debería funcionar:

$.ajax({
    url: url,
    type: "POST",
    data: JSON.stringify(data),
    contentType: "application/json",
    complete: callback
});

Tenga en cuenta que el JSONobjeto está disponible de forma nativa en navegadores que admiten JavaScript 1.7/ECMAScript 5 o posterior. Si necesita soporte heredado, puede usar json2 .

mekwall avatar Oct 02 '2012 16:10 mekwall

No, la dataTypeopción es para analizar los datos recibidos.

Para publicar JSON, deberá codificarlo usted mismo JSON.stringifyy configurar la processDataopción en false.

$.ajax({
    url: url,
    type: "POST",
    data: JSON.stringify(data),
    processData: false,
    contentType: "application/json; charset=UTF-8",
    complete: callback
});

Tenga en cuenta que no todos los navegadores admiten el JSONobjeto y, aunque jQuery lo tiene .parseJSON, no incluye ningún stringificador; Necesitará otra biblioteca Polyfill.

Bergi avatar Oct 02 '2012 16:10 Bergi

Si bien sé que muchas arquitecturas como ASP.NET MVC tienen una funcionalidad incorporada para manejar JSON.stringify como contentType, mi situación es un poco diferente, por lo que tal vez esto pueda ayudar a alguien en el futuro. ¡Sé que me habría ahorrado horas!

Dado que mis solicitudes http están siendo manejadas por una API CGI de IBM (entorno AS400) en un subdominio diferente, estas solicitudes son de origen cruzado, de ahí el jsonp. De hecho, envío mi ajax a través de objetos javascript. Aquí hay un ejemplo de mi POST ajax:

 var data = {USER : localProfile,  
        INSTANCE : "HTHACKNEY",  
        PAGE : $('select[name="PAGE"]').val(), 
        TITLE : $("input[name='TITLE']").val(), 
        HTML : html,
        STARTDATE : $("input[name='STARTDATE']").val(), 
        ENDDATE : $("input[name='ENDDATE']").val(),
        ARCHIVE : $("input[name='ARCHIVE']").val(), 
        ACTIVE : $("input[name='ACTIVE']").val(), 
        URGENT : $("input[name='URGENT']").val(), 
        AUTHLST :  authStr};
        //console.log(data);
       $.ajax({
            type: "POST",
           url:   "http://www.domian.com/webservicepgm?callback=?",
           data:  data,
           dataType:'jsonp'
       }).
       done(function(data){
         //handle data.WHATEVER
       });
yardpenalty.com avatar Sep 03 '2016 19:09 yardpenalty.com

Si va a enviar esto de vuelta a asp.net y necesita los datos en request.form[], deberá configurar el tipo de contenido en "application/x-www-form-urlencoded; charset=utf-8"

Publicación original aquí

En segundo lugar, elimine el tipo de datos; si no espera una devolución, la POST esperará unos 4 minutos antes de fallar. Mira aquí

Tod avatar Nov 21 '2013 13:11 Tod