Codificar una búsqueda
En bruto
hello world & more
Codificado
hello%20world%20%26%20more
Los espacios pasan a %20, y el & se convierte en %26 para que no se confunda con un separador de parámetros.
Codificador / Decodificador de URL
Codifica y decodifica componentes de URL de forma segura.
Última actualización
DecodificadoPega texto para empezar
Codificado
La salida codificada o decodificada aparece aquí — con soporte Unicode.
¿Qué es un codificador de URL?
Un codificador de URL (también llamado percent-encoder o codificador URI) reemplaza los caracteres reservados o no seguros en URLs por % seguido de dos dígitos hexadecimales. Lo usamos al construir query strings, escapar segmentos de ruta, compartir URLs con espacios o caracteres no ASCII, y al depurar redirecciones.
Las URLs solo admiten un conjunto reducido de caracteres ASCII. Todo lo que quede fuera —espacios, tildes, emojis o símbolos reservados como ?, #, &, = cuando se usan como datos— tiene que codificarse en porcentaje para que llegue intacto del navegador al servidor.
JavaScript trae dos funciones de codificación: encodeURI (respeta la estructura de la URL: /, ?, #, &) y encodeURIComponent (codifica todo lo reservado). Usa encodeURIComponent para los *valores* que metes en una query string, y encodeURI para *URLs completas* que quieras conservar funcionales.
Lo que aprenderás codificando URLs
- La codificación porcentual reemplaza un byte por
%más dos dígitos hexadecimales — por ejemplo, un espacio se convierte en%20. - Los caracteres reservados (
:/?#&=+) tienen un significado dentro de la estructura de una URL. Hay que codificarlos cuando se usan como datos, no como separadores. - El texto no ASCII (tildes, emojis, cirílico, CJK) se transforma primero a bytes UTF-8 y luego cada byte se codifica en porcentaje.
Cómo codificar y decodificar URLs paso a paso
Elige la dirección
Pulsa Codificar si tienes texto en bruto y lo quieres dejar URL-safe. Pulsa Decodificar si tienes una cadena con
%y quieres recuperar el texto original.Elige el modo de codificación
Selecciona
encodeURIComponent(codifica todo lo reservado) para valores de query string; seleccionaencodeURI(mantiene la estructura) para URLs completas.Pega tu entrada
Pega el texto en bruto o la URL ya codificada. Admite varias líneas, así que puedes decodificar en lote.
Copia el resultado
Copia el valor codificado o decodificado. La conversión se ejecuta localmente en tu navegador, así que cualquier dato sensible que vaya en la URL se queda en tu máquina.
Referencia rápida de codificaciones de URL más habituales
Los caracteres que verás codificados con más frecuencia, junto con su forma en porcentaje. La semántica de los caracteres reservados viene del RFC 3986.
| Carácter | Codificado | Por qué |
|---|---|---|
| espacio | %20 | Los espacios no se permiten en URLs |
! | %21 | Algunos servidores lo reservan |
# | %23 | Marca el inicio del fragmento |
$ | %24 | Carácter reservado |
& | %26 | Separa parámetros de la query |
+ | %2B | Significa espacio en cuerpos form-encoded |
/ | %2F | Separador de rutas |
: | %3A | Separa esquema y host |
= | %3D | Separa clave de valor en la query string |
? | %3F | Marca el inicio de la query string |
@ | %40 | Separa userinfo y host |
| byte UTF-8 | %C3%A9 | Cada byte no ASCII se codifica por separado |
Ejemplos de codificación de URL para probar
Codificar caracteres no ASCII
En bruto
café
Codificado
caf%C3%A9
La é en UTF-8 son los bytes 0xC3 0xA9, así que el resultado lleva *dos* grupos %XX para ese único carácter.
encodeURI vs encodeURIComponent
En bruto
https://example.com/path?q=hello world
encodeURI
https://example.com/path?q=hello%20world
encodeURIComponent
https%3A%2F%2Fexample.com%2Fpath%3Fq%3Dhello%20world
encodeURI deja intacta la estructura de la URL (las barras, ?, =). encodeURIComponent codifica todo lo reservado — úsala en los valores que metes dentro de una query string, nunca sobre una URL entera.
Errores frecuentes al codificar URLs
- Usar
encodeURIpara valores de query string — el&y el=sobreviven a la codificación y rompen el parseo de parámetros. - Codificar una URL dos veces. Ver
%2520en lugar de%20es la señal clásica de un bug de doble codificación. - Olvidar que
+significa espacio en cuerposapplication/x-www-form-urlencoded, pero es un+literal en la ruta o en la query string.
Preguntas frecuentes sobre codificación de URLs
¿Qué es la codificación de URL?
La codificación de URL (también llamada percent-encoding o codificación porcentual) es una forma de representar caracteres que tienen un significado especial en las URLs, o que no es seguro transmitir, reemplazándolos por
% seguido de dos dígitos hexadecimales.¿Cuál es la diferencia entre encodeURI y encodeURIComponent?
encodeURI respeta los caracteres estructurales de la URL (/, ?, #, &, =, +). encodeURIComponent los codifica todos, que es justo lo que quieres para los *valores* individuales que vas a meter dentro de una URL — valores de parámetros de query, segmentos de ruta o fragmentos. Consulta las referencias de MDN para encodeURI y encodeURIComponent.¿Por qué un espacio se convierte en %20?
Los espacios no están permitidos en URLs, así que se reemplazan por
%20, la codificación porcentual del carácter espacio en ASCII (0x20 en hexadecimal).¿Cuándo debería codificar en URL?
Codifica cualquier valor dinámico o introducido por el usuario antes de meterlo en una URL — valores de query string, segmentos de ruta, destinos de redirección, parámetros de OAuth. Nunca des por hecho que la entrada en bruto es URL-safe.
¿Se puede revertir la codificación de URL?
Sí, eso es decodificar la URL.
decodeURI, decodeURIComponent o cualquier decodificador de URL deshacen la codificación porcentual y devuelven los caracteres originales.