MiServe DevTools

Tus pegatinas

Fija aquí tus herramientas. Se guardan en este navegador.

Codificador, decodificador y analizador de URL

Codifica o decodifica por porcentaje un valor, una URL completa o datos de formulario, y desglosa cualquier URL en sus partes y sus parámetros de consulta.

Funciona en tu navegador. Nada de lo que pegas se sube.

Acerca de esta herramienta

Qué es la codificación por porcentaje

Una URL solo puede contener un conjunto limitado de caracteres ASCII, y algunos de ellos tienen una función: ? inicia la consulta, & separa los parámetros y # inicia el fragmento. Cualquier otro carácter, y cualquier carácter reservado que se use como simple dato, se escribe como un signo de porcentaje seguido de dos dígitos hexadecimales por cada uno de sus bytes. Un espacio se convierte en %20, y é, que en UTF-8 ocupa dos bytes, se convierte en %C3%A9. Las reglas están en el RFC 3986.

La decodificación hace lo contrario. Falla cuando un signo de porcentaje no va seguido de dos dígitos hexadecimales, o cuando los bytes escapados no son UTF-8 válido; la herramienta te indica qué secuencia es y dónde está.

Qué modo usar

Componente es el adecuado para una sola parte de una URL: un valor de consulta, un segmento de ruta o una URL de redirección pasada como parámetro. Escapa /, ?, & y =, para que el valor no se confunda con la estructura.

URL completa sirve para una dirección completa a la que solo hay que corregirle los espacios y los caracteres no ASCII. Deja intactos los caracteres estructurales, lo que también significa que no puede proteger un valor que los contenga. Además escapa %, así que, si lo aplicas a una URL que ya está codificada, la codifica dos veces, y escapa los corchetes que rodean una dirección IPv6 en el host. Al decodificar, este modo deja tal cual las secuencias de escape de los caracteres estructurales, como %2F y %26.

Formulario es el formato application/x-www-form-urlencoded que usan los navegadores al enviar un formulario HTML, en la cadena de consulta o en el cuerpo de la petición, y en él un espacio se escribe como +. Al decodificar, un + se lee como un espacio solo en este modo.

Cómo se analiza la URL

Cuando la entrada, o si no la salida, es una URL absoluta, la herramienta la lee con el propio analizador URL del navegador, el mismo que procesa los enlaces y fetch. La tabla muestra el esquema, las credenciales, el host, el puerto, la ruta y el fragmento, y cada parámetro de consulta con su clave y su valor decodificados. El analizador normaliza lo que lee. En una URL web, por ejemplo, pasa a minúsculas el esquema y el host, resuelve los segmentos . y .. de la ruta y codifica por porcentaje caracteres como los espacios, así que las partes pueden diferir un poco de lo que se escribió. Un nombre de host internacionalizado en una URL http o https se muestra en su forma ASCII (Punycode), tal como lo guarda el analizador.

Si la URL no indica un puerto y la herramienta conoce el predeterminado de su esquema, muestra ese valor, por ejemplo 443 para https.

Preguntas

¿Qué diferencia hay entre encodeURI y encodeURIComponent?

encodeURI está pensado para una URL completa y deja intactos caracteres como : / ? # & y =. encodeURIComponent está pensado para un valor dentro de una URL y también escapa esos caracteres. Usa encodeURIComponent para los valores de consulta; si no, un & o un = dentro del valor rompe la cadena de consulta.

¿Un espacio se codifica como %20 o como +?

%20 es válido en cualquier parte de una URL. El signo + significa un espacio solo en los datos application/x-www-form-urlencoded, el formato con el que un formulario HTML envía sus campos en la cadena de consulta o en el cuerpo de la petición. En una ruta, + es un signo más literal.

¿Por qué me da un error al decodificar un valor que contiene un signo de porcentaje?

Un signo de porcentaje siempre inicia una secuencia de escape, así que uno literal debe escribirse como %25. Un texto como «100% gratis» no es una entrada válida codificada por porcentaje, porque el signo de porcentaje no va seguido de dos dígitos hexadecimales.

¿La URL que pego se envía a un servidor?

No. La codificación, la decodificación y el análisis los hace JavaScript en la pestaña de tu navegador. La herramienta no hace ninguna petición de red con lo que escribes.

Más herramientas de Codificación