Comprensión de la codificación de formularios HTML: formularios con codificación URL y de varias partes

Los formularios HTML contienen dos codificaciones, los formularios codificados con URL y los formularios de varias partes . La codificación en un formulario HTML está determinada por un atributo llamado ‘enctype ‘. Este atributo puede tener tres valores:

  • application/x-www-form-urlencoded: este valor representa un formulario codificado de URL (localizador uniforme de recursos). Por defecto, se asigna al atributo enctype .
  • multipart/form-data: este valor representa un formulario de varias partes. Se utiliza para cargar archivos por parte del usuario.
  • text/plain: este valor representa un formulario que se introdujo recientemente en el último HTML5 que se utiliza para enviar los datos sin ningún tipo de codificación.

Formularios codificados en URL: los datos que se envían mediante este tipo de codificación de formulario están codificados en URL, como se desprende claramente de su nombre.

Ejemplo:

HTML

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>URL Encoded Forms</title>
  </head>
  <body>
    <form
      action="/urlencoded?firstname=Geeks&lastname=forGeeks"
      method="POST"
      enctype="application/x-www-form-urlencoded">
      <input type="text" name="username" value="GeeksforGeeks" />
      <input type="text" name="password" value="GFG@123" />
      <input type="submit" value="Submit" />
    </form>
  </body>
</html>

El formulario anterior se envía al servidor mediante la solicitud POST , lo que sugiere que es un cuerpo y que el cuerpo de este formulario está codificado como URL. Es creado por una string extendida de (nombre, valor) pares. Cada par de estas strings está separado por un signo & (ampersand) y el nombre está separado por un signo = (igual ) del ‘valor’.

  • Para el formulario anterior, los pares (nombre, valor) son los siguientes.

    username=GeeksforGeeks&password=GFG@123
  • Algunos parámetros de la consulta que se pasan en la acción URL son los siguientes.

    /urlencoded?firstname=Geeks&lastname=forGeeks

Es claramente visible que el cuerpo codificado de URL y los parámetros de consulta son similares. De hecho, son similares.

Formularios de varias partes: este tipo de formularios se utilizan cuando el usuario carga algunos archivos en el servidor.

Ejemplo:

HTML

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Multipart Forms</title>
  </head>
  <body>
    <form
      action="/multipart?firstname=Geeks for&lastname=Geeks"
      method="POST"
      enctype="multipart/form-data">
      <input type="text" name="username" value="Geeks for Geeks" />
      <input type="text" name="password" value="GFG@123" />
      <input type="submit" value="Submit" />
    </form>
  </body>
</html>

En el formulario anterior, se introducen algunos espacios en el valor del nombre de usuario y el valor de la acción en el formulario se cambia a ‘ multipart/form-data ‘ para usar la funcionalidad de los formularios de varias partes .

  • Para el formulario anterior, los pares (nombre, valor) son los siguientes

    username=Geeks%20for%20Geeks&password=GFG@123
  • Algunos parámetros de la consulta que se pasan en la acción URL son los siguientes.

    /multipart?firstname=Geeks%20for%20&lastname=Geeks

Se puede ver claramente desde arriba en los parámetros de consulta y el cuerpo del formulario que los espacios se reemplazan por ‘%20’.

Publicación traducida automáticamente

Artículo escrito por ayushraghuwanshi80 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *