Codificar y decodificar una URL

Cómo funciona

Pegue el texto en el panel de la izquierda; cada línea se trata por separado, así que una lista de direcciones pasa de una sola vez. Elija primero el sentido y después el alcance — es esta segunda decisión la que hace que el resultado sirva o no. El modo componente codifica un valor suelto: los dos puntos, la barra, el signo de interrogación, el ampersand y el igual se codifican también, porque dentro de un valor una barra es contenido y no un separador de ruta. El modo dirección completa da por hecho que el texto ya es una URL y deja esos separadores intactos; solo se transforman los caracteres inseguros, sobre todo el espacio y las letras con tilde o con ñ. Al decodificar se mantiene la misma distinción. Si aparece una secuencia porcentual rota —por ejemplo %ZZ, o un %A cortado al final de la línea— se le indica en qué línea y en qué posición está; y una secuencia formalmente válida que no compone ningún carácter UTF-8 aceptable se avisa aparte, porque la causa es distinta. El resultado se copia con un clic o se descarga como archivo de texto.

Esta herramienta también se busca como codificar url, decodificar url, codificacion porcentual, url encode en espanol, caracteres especiales en una url.

¿Qué es Codificación porcentual?

La codificación porcentual representa los caracteres que no pueden ir tal cual en una dirección mediante un signo de porcentaje y dos dígitos hexadecimales: un espacio pasa a %20 y un signo de interrogación a %3F. La norma de direcciones solo admite un repertorio reducido de caracteres, porque los demás o cumplen función de separador (/, ?, &, =) o se interpretan de forma distinta según el sistema. Lo que se codifica no son caracteres sino bytes: el texto pasa primero a UTF-8 y cada byte recibe su secuencia. Por eso una ñ da dos secuencias y la dirección codificada parece más larga que el texto de partida.

¿Qué es Cadena de consulta (query string)?

La cadena de consulta es la parte de una dirección que va después del signo de interrogación; lleva parámetros hasta el servidor con el patrón ?q=plan&pagina=2. El ampersand separa unos parámetros de otros y el igual separa el nombre del valor. Como esos dos signos cumplen un papel estructural, hay que codificarlos en cuanto aparecen dentro de un valor; si no, el servidor lee dos parámetros donde usted escribió uno y la búsqueda vuelve vacía. De ahí salen exactamente los dos alcances de esta herramienta: los valores van por el componente y una dirección completa por la dirección entera.

¿Qué diferencia hay entre codificar el componente y la dirección completa?

Los dos aplican la misma codificación porcentual; se separan en qué hacen con los separadores. El modo componente no sabe nada de direcciones: ve texto y codifica cualquier carácter inseguro, incluidos : / ? # & =, porque ese texto va a convertirse en una PARTE de una dirección y una barra dentro de él es contenido y no un separador de ruta. El modo dirección completa da por hecho que ya existe una dirección, trata los separadores como estructura y los conserva; solo transforma los caracteres inseguros, como el espacio, las tildes y la ñ. En la práctica: los valores de formulario y los parámetros de consulta van por el componente, y una dirección ya existente que hay que reparar va por la dirección completa. Confundirlos convierte una dirección en texto inservible o deja un separador en mitad de un valor y parte sus datos en dos.

El error más frecuente: codificar una dirección entera como componente

Si pasa una dirección completa por el modo componente, https://ejemplo.com/ruta se convierte en la cadena https%3A%2F%2Fejemplo.com%2Fruta. Esa salida no está rota — sencillamente ya no es una dirección, sino un valor que transporta una dirección en forma de texto. Pegada en la barra del navegador no abre nada.

La regla cabe en una pregunta: ¿está codificando una PARTE de la dirección o la dirección ENTERA? El término de búsqueda «diseño gráfico», destinado a un parámetro q, es un caso para el modo componente. Una dirección ya formada que trae espacios y hay que dejar válida es un caso para dirección completa.

Qué cambia y qué se queda igual

En los dos alcances, las letras, los dígitos y los signos - _ . ! ~ * ' ( ) se quedan tal cual, y un espacio siempre pasa a %20. Todo lo que sale del ASCII puro se parte primero en bytes UTF-8, y cada byte recibe su propia secuencia: la ñ se convierte en %C3%B1, la á en %C3%A1 y la ü en %C3%BC. Que una dirección codificada parezca más larga que el texto original es lo normal y no señala ningún fallo.

Hay dos signos muy nuestros que conviene tener en la cabeza: la apertura de interrogación y de exclamación no son ASCII y también se codifican, en dos bytes cada una. Por eso una dirección que arrastre un «¿» sin codificar llega rota a muchos servidores.

• Se codifican en el modo componente: : / ? # [ ] @ $ & + , ; = — es decir, casi todo
• Se conservan en dirección completa: : / ? # @ & = + $ , ;
• Si el valor de un parámetro contiene & o =, el modo componente es obligatorio; si no, el servidor lee dos parámetros donde había uno
• Un nombre de archivo con una barra dentro también va por el modo componente

Lo que el navegador muestra no es lo que envía

Los navegadores actuales deshacen las secuencias porcentuales en la barra de direcciones y las muestran legibles; por eso ejemplo.com/diseño-gráfico se ve limpio aunque la petición llegó codificada al servidor. Copie ese mismo enlace a un correo o a un mensaje y casi siempre reaparece la versión larga codificada — el enlace no ha cambiado, solo su presentación.

Para entender un enlace que parece roto, el sentido decodificar es el camino corto: pegue la dirección ilegible y lea qué parámetro lleva qué. El nombre de dominio sigue otras reglas: un dominio con ñ, como piñata.es, se representa mediante un procedimiento aparte llamado punycode, y esta herramienta no toca la parte del dominio.

Tabla de codificación porcentual: en qué se convierte cada carácter

Las equivalencias de abajo están en la norma de direcciones, la RFC 3986, y son iguales en todas partes: un carácter se escribe con un signo de porcentaje y dos dígitos hexadecimales que dan su valor UTF-8. Un espacio pasa a %20, porque en una dirección no cabe un espacio; los demás se codifican porque cargan con la estructura — un ampersand suelto dentro del valor de un parámetro le dice al servidor que ahí empieza un parámetro nuevo.

La lista muestra lo que produce el alcance «componente». En «dirección completa» los separadores se quedan intactos, porque ahí forman el armazón de la dirección en lugar de estar encerrados en un valor; cuál de los dos alcances va en cada sitio lo explica la sección anterior. Las letras, los dígitos y cuatro signos —guion, punto, guion bajo y virgulilla— se consideran «no reservados» en la norma y no se codifican en ningún alcance.

Dicho de otro modo, esta tabla no es un ejercicio de memoria sino una lista de comprobación: cuando un enlace llega roto, aquí encuentra el carácter que se quedó en bruto o que se decodificó mal.

• espacio → %20
• " (comilla recta) → %22
• # → %23
• $ → %24
• % (el propio signo de porcentaje) → %25
• & → %26
• + → %2B
• , (coma) → %2C
• / → %2F
• : → %3A
• ; → %3B
• = → %3D
• ? → %3F
• @ → %40
• [ → %5B y ] → %5D
• salto de línea → %0A, tabulación → %09
• Nunca se codifican: A-Z, a-z, 0-9 y cuatro signos — guion ( - ), punto ( . ), guion bajo ( _ ), virgulilla ( ~ )
• Otros cinco signos se quedan tal cual en los dos alcances de esta herramienta: ! ' ( ) * — el estándar los cuenta entre los reservados, pero la función de codificación del navegador no los toca; si un sistema pide la forma codificada, es %21, %27, %28, %29 y %2A
• Las letras con tilde y la ñ ocupan dos bytes y dan dos secuencias: á → %C3%A1, é → %C3%A9, í → %C3%AD, ó → %C3%B3, ú → %C3%BA, ü → %C3%BC, ñ → %C3%B1
• Los signos de apertura también: ¿ → %C2%BF, ¡ → %C2%A1

Preguntas frecuentes

¿Un espacio pasa a %20 o a un signo más?

En la parte de la ruta de una dirección, un espacio siempre pasa a %20. El signo más solo vale como espacio en la cadena de consulta que envía un formulario HTML; es un acuerdo antiguo propio de ese único contexto. Esta herramienta produce %20 en los dos alcances, porque %20 se lee bien en todas partes.

¿Puede una dirección llevar tildes o la ñ?

En la ruta y en la consulta, sí: viajan como bytes UTF-8 dentro de secuencias porcentuales, y la ñ se convierte en %C3%B1. El nombre de dominio sigue otras reglas, las del punycode, y esta herramienta deja la parte del dominio tal como está.

¿Qué pasa si codifico una dirección dos veces?

Entonces se codifica el propio signo de porcentaje y %20 pasa a %2520. Es la causa clásica de un enlace roto. Si tiene dudas, lance primero el sentido decodificar: si la salida sigue trayendo secuencias porcentuales, el texto estaba codificado dos veces.

¿Las direcciones que pego se envían a alguna parte?

No. Codificar y decodificar ocurren dentro de su navegador: ni siquiera una dirección con una clave de sesión o con parámetros personales sale de esta página.

¿Cómo se escribe el propio signo de porcentaje?

Como %25. No es una excepción sino el centro de la regla: el signo de porcentaje abre una secuencia de escape, así que tiene que codificarse allí donde aparece como texto normal; si no, los dos caracteres siguientes se toman por dígitos hexadecimales. Al decodificar pasa lo contrario y una secuencia %25 vuelve a ser un único signo de porcentaje.