Enviar datos de un formulario

Enviar datos de un formulario

Acción »form method=post»

Una vez que los datos del formulario han sido validados en el lado del cliente, está bien enviar el formulario. Y, ya que hemos cubierto la validación en el artículo anterior, ¡estamos listos para enviarlo! Este artículo examina lo que ocurre cuando un usuario envía un formulario: ¿a dónde van los datos y cómo los manejamos cuando llegan allí? También veremos algunos de los problemas de seguridad asociados con el envío de los datos del formulario.
En primer lugar, hablaremos de lo que ocurre con los datos cuando se envía un formulario.Arquitectura cliente/servidorEn su forma más básica, la web utiliza una arquitectura cliente/servidor que puede resumirse de la siguiente manera: un cliente (normalmente un navegador web) envía una solicitud a un servidor (la mayoría de las veces un servidor web como Apache, Nginx, IIS, Tomcat, etc.), utilizando el protocolo HTTP. El servidor responde a la solicitud utilizando el mismo protocolo.
Un formulario HTML en una página web no es más que una forma cómoda de configurar una petición HTTP para enviar datos a un servidor. Esto permite al usuario proporcionar la información que se entregará en la petición HTTP.

Multipart/form-data

Una vez que los datos del formulario han sido validados en el lado del cliente, está bien enviar el formulario. Y, ya que hemos cubierto la validación en el artículo anterior, ¡estamos listos para enviarlo! Este artículo examina lo que ocurre cuando un usuario envía un formulario: ¿a dónde van los datos y cómo los manejamos cuando llegan allí? También veremos algunos de los problemas de seguridad asociados con el envío de los datos del formulario.
En primer lugar, hablaremos de lo que ocurre con los datos cuando se envía un formulario.Arquitectura cliente/servidorEn su forma más básica, la web utiliza una arquitectura cliente/servidor que puede resumirse de la siguiente manera: un cliente (normalmente un navegador web) envía una solicitud a un servidor (la mayoría de las veces un servidor web como Apache, Nginx, IIS, Tomcat, etc.), utilizando el protocolo HTTP. El servidor responde a la solicitud utilizando el mismo protocolo.
Un formulario HTML en una página web no es más que una forma cómoda de configurar una petición HTTP para enviar datos a un servidor. Esto permite al usuario proporcionar la información que se entregará en la petición HTTP.

Ejemplos de métodos get y post en html

Muchas UIs modernas sólo utilizan formularios HTML para recoger entradas del usuario, y no para el envío de datos. Cuando el usuario intenta enviar los datos, la aplicación toma el control y transmite los datos de forma asíncrona en segundo plano, actualizando sólo las partes de la UI que requieren cambios.
Nota: La API Fetch se utiliza a menudo en lugar de XHR en estos días – es una versión moderna y actualizada de XHR, que funciona de manera similar, pero tiene algunas ventajas. La mayor parte del código XHR que verás en este artículo podría cambiarse por Fetch.
Vamos a verlos en detalle.Construir un XMLHttpRequest manualmenteXMLHttpRequest es la forma más segura y fiable de hacer peticiones HTTP. Para enviar datos de formularios con XMLHttpRequest, hay que preparar los datos codificándolos en la URL, y obedecer las especificaciones de las solicitudes de datos de formularios.
Usando XMLHttpRequest y el objeto FormDataConstruir una petición HTTP a mano puede ser abrumador. Afortunadamente, la especificación XMLHttpRequest proporciona una forma más nueva y sencilla de manejar las solicitudes de datos de formularios con el objeto FormData.

Ejemplo de envío de formulario html

La interfaz FormData proporciona una forma de construir fácilmente un conjunto de pares clave/valor que representan los campos del formulario y sus valores, que luego pueden enviarse fácilmente utilizando el método XMLHttpRequest.send(). Utiliza el mismo formato que usaría un formulario si el tipo de codificación estuviera establecido como «multipart/form-data».
Si quiere enviar los datos como application/x-www-form-urlencoded tendrá que especificar el cuerpo como una cadena codificada como URL, o pasar un objeto URLSearchParams. Este último, desafortunadamente, no puede ser inicializado directamente desde un elemento de formulario. Si no quiere iterar a través de los elementos del formulario (lo que podría hacer usando HTMLFormElement.elements), también podría crear un objeto URLSearchParams a partir de un objeto FormData:

Esta web utiliza cookies propias para su correcto funcionamiento. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Configurar y más información
Privacidad