Envío de parámetros por POST utilizando XMLHttpRequest

Patxi Echarte, August 5th, 2005

Ayer por la tarde me pasé casi dos horas intentando resolver un problema que tenía con una aplicación que estoy desarrollando. Lo que necesitaba hacer era realizar una petición XMLHttpRequest desde el cliente a una url del servidor, pero enviando la información por POST. Pues bien, no importaba lo que hiciera, que no había forma de hacerlo funcionar correctamente. Si utilizaba GET en vez de POST todo perfecto, pero si lo hacía por POST no conseguía acceder a las variables enviadas.

Finalmente tras bastantes pruebas y ver multitud de páginas web que no aportaban demasiado a la resolución del problema, encontré una solución basada en enviar una cabecera Content-Type al servidor al hacer la petición, indicando cómo se envía la información de lo que sería el formulario en una petición normal.

El código resultante sería parecido al siguiente:

function loadContentsOnDemand(divname,fillingUrl){
   var xmlHttp = XmlHttp.create();
   xmlHttp.open("POST", fillingUrl, true);   // async
   xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=ISO-8859-1');
   xmlHttp.onreadystatechange = function () {
      if (xmlHttp.readyState == 4) {
         document.getElementById(divname).innerHTML = xmlHttp.responseText;
      }
   };
   document.getElementById(divname).innerHTML = '<span class="txtrojo10"><b>Cargando...</b></span>';
   // llamada en otro hilo para permitir actualizar el interfaz
   window.setTimeout(function () {
      xmlHttp.send('nid='+nid);
   }, 10);
}

Para que este código funcione es necesario utilizar incluir el archivo JavaScript XmlHttp.js con el código que suelo utilizar para las peticiones XMLHttpRequest.

Comparte esta información
Esta información fue creada el Friday, August 5th, 2005 a las 10:34 am y está clasificada en JavaScript. Puedes seguir los comentarios que se produzcan a traves de RSS 2.0. Puedes hacer un comentario, o trackback desde tu propio sitio.
« Patrón Singleton con C#
Un divertido juego matemático »

5 Comentarios para “Envío de parámetros por POST utilizando XMLHttpRequest”

  1. seiju dice:
    August 5th, 2005 a las 1:59 pm

    será que por definicion del metodo POST hay que enviar la cabecera correcta para que sea interpretado correctamente :P

  2. Suoko dice:
    September 29th, 2005 a las 12:14 am

    Hola

    En el codigo de muestra en la linea:
    document.getElementById(divname).innerHTML = ‘Cargando…‘;

    se ha colado un ‘ que produce un continuo error javascript, es necesario poner una comilla simple ‘

    Un saludo
    Suoko
    matiasalfaro.com

  3. Spud dice:
    November 30th, 2005 a las 7:58 am

    se te ha olvidado la funcion XmlHttp() ??
    en la red encontre esto:

    function XmlHttp() {}

    XmlHttp.create = function () {
    try {
    if (window.XMLHttpRequest) {
    var req = new XMLHttpRequest();

    // some older versions of Moz did not support the readyState property
    // and the onreadystate event so we patch it!
    if (req.readyState == null) {
    req.readyState = 1;
    req.addEventListener(”load”, function () {
    req.readyState = 4;
    if (typeof req.onreadystatechange == “function”)
    req.onreadystatechange();
    }, false);
    }

    return req;
    }
    if (window.ActiveXObject) {
    return new ActiveXObject(getControlPrefix() + “.XmlHttp”);
    }
    }
    catch (ex) {}
    // fell through
    throw new Error(”Your browser does not support XmlHttp objects”);
    };

  4. Patxi dice:
    November 30th, 2005 a las 7:59 pm

    Tienes razón Spud, he subido un archivo javascript con el código que suelo utilizar para las peticiones XMLHttpRequest

  5. RRomero dice:
    July 21st, 2006 a las 4:03 am

    Gracias, pregunte en google enviar parametros… y ahorre mas de 2 horas.

Deja un comentario