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

leer json javascript

Question

¿Puede alguien explicar de manera fácil 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, convertirá su JSON cuidadosamente preparado en una cadena de consulta. Una de las cosas molestas es que cualquier array: [] en su objeto se convertirá en array[]: [] , probablemente debido a las limitaciones de la picadura de la consulta.

Answer 1

Necesita usar JSON.stringify para serializar primero su objeto a JSON, y luego especifique el 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 objeto JSON está disponible de forma nativa en los navegadores compatibles con JavaScript 1.7 / ECMAScript 5 o posterior. Si necesita soporte heredado, puede usar json2 .

Estos detalles adicionales fueron originalmente incorrectamente incluidos en una revisión previa de la pregunta. Ellos han sido copiados en esta respuesta aceptada.

Tenga en cuenta que esto requiere encabezados CORS adecuados del lado del servidor y, contrariamente a algunos ejemplos en la red, Allow-Headers no puede usar comodines (mientras que Allow-Origin puede).

{
    Content-Type                 : ''application/json'', 
    Access-Control-Allow-Origin  : ''*'', 
    Access-Control-Allow-Headers : ''Content-Type'' // You cannot use ''*''
}

Además, tenga en cuenta que jQuery ahora enviará dos solicitudes, una para completar el protocolo de enlace y otra con el contenido real. Este es un comportamiento HTTP normal llamado pre-vuelo . La primera solicitud será un encabezado OPTIONS para determinar si el servidor es realmente compatible con la solicitud planificada.

Así que tenga en cuenta si desea que su servidor sea versátil, utilizando una cadena de consulta envía solo una solicitud. El uso de JSON verdadero envía al menos dos solicitudes, una para el protocolo de enlace.

Answer 2

No, la api.jquery.com/jQuery.ajax es para analizar los datos recibidos.

Para publicar JSON, deberá realizar la cadena usted mismo a través de JSON.stringify y establecer la opción processData 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 objeto JSON , y aunque jQuery tiene .parseJSON , no tiene ningún secuenciador incluido; necesitarás otra biblioteca de polyfill.

Answer 3

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

Como mis solicitudes http están siendo manejadas por una API CGI de IBM (entorno AS400) en un subdominio diferente, estas solicitudes son origen cruzado, de ahí el jsonp. De hecho, envío mi ajax a través de objeto (s) javascript. Aquí hay un ejemplo de mi POSTE 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
       });

Answer 4

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

Publicación original here

En segundo lugar, deshazte del tipo de datos, si no esperas una devolución, la POST esperará unos 4 minutos antes de fallar. Mira here