En esta tercera parte (sexta de la serie) dedicada a los problemas/desafíos relacionados con AJAX vamos a tratar el envío de datos al servidor.

Normalmente cuando pensamos en AJAX, es decir, en llamadas asíncronas a servicios, lo hacemos desde el punto de vista de obtener información: llamo a una página que me devuelve unos valores y los muestro en la interfaz de usuario. Aunque este es el uso más común de AJAX lo cierto es que también es muy útil usarlo en el sentido inverso, para enviar datos al servidor. Las utilidades y necesidades que cubre son múltiples y de hecho hay muchos sistemas. Por ejemplo, las plataformas de teleformación como nuestro SELF, lo usan para la parte de comunicación entre contenidos y plataforma de la especificación SCORM.

la forma más sencilla y directa de enviar datos simples al servidor es incluirlos en la URL a la que llamamos como parámetros GET:

urldestino.aspx?Parametro1=1234&Parametro2=5

Aunque esto puede servirnos para cosas muy sencillas no es a lo que me refería al principio de este post.

Lo habitual es que la información haya que enviarla con el método POST. La principal diferencia entre GET y POST estriba en que el método GET hace una llamada al servidor solicitando una página y enviando algunos parámetros de datos en la propia petición. El método POST por el contrario envía los datos en el cuerpo de la propia conexión de petición encriptados con el formato que se haya indicado en el formulario. A través de GET lo máximo que se puede enviar son 2 kB de información, mientras que por POST no existe esta limitación.

Para enviar datos al servidor mediante POST nuestro código AJAX sería similar al siguiente:

http = getHttpRequest()
http.onreadystatechange = finCarga;
http.open("POST", "http://www.miserv.com/misdatos.aspx", true)
http.send('Parametro1=1234&Parametro2=5');

Con esto no hemos ganado demasiado. Ahora se envían  los datos por POST (sólo cambia elprimer parámetro de open) pero los hemos tenido que introducir en el método send en lugar de en la propia URL. Esto sólo simularía el envío de parámetros meidante POST desde un formulario HTML (que por otro lado en ocasiones puede ser lo que queramos).

Lo habitual sin embargo es que en lugar de enviar parámetros querramoe enviar información pura y dura, del tamaño que queramos, que es para lo que suele usarse POST. Esto se puede conseguir modificando ligeramente el código anterior para incluir una cabecera que indique al servidor que lo que le llega son, precisamente, datos:

http = getHttpRequest()
http.onreadystatechange = finCarga;
http.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
http.open("POST", "http://www.miserv.com/misdatos.aspx", true)
http.send('Aquí ahora mando la información que quiera al servidor');

Con esto nuestro problema queda resuelto.

💪🏻 ¿Este post te ha ayudado?, ¿has aprendido algo nuevo?
Pues NO te pido que me invites a un café... Te pido algo más fácil y mucho mejor