¿Cómo enviar JSON en lugar de una cadena de consulta con $.ajax?
¿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.
Debe usar JSON.stringify
para serializar primero su objeto en JSON y luego especificarlo contentType
para 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 JSON
objeto está disponible de forma nativa en navegadores que admiten JavaScript 1.7/ECMAScript 5 o posterior. Si necesita soporte heredado, puede usar json2 .
No, la dataType
opción es para analizar los datos recibidos.
Para publicar JSON, deberá codificarlo usted mismo JSON.stringify
y configurar la processData
opció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 JSON
objeto y, aunque jQuery lo tiene .parseJSON
, no incluye ningún stringificador; Necesitará otra biblioteca Polyfill.
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
});
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í