Cómo codificar y decodificar URL
Si alguna vez has visto %20 en una URL donde tenía que haber un espacio, o %C3%A9 donde correspondía un carácter acentuado, te has encontrado con la codificación de URL. Es un ladrillo fundamental de la web, y entenderla ayuda a depurar enlaces rotos, problemas de API y envíos de formularios.
Lo que hace la codificación de URL
Las URL solo pueden contener un conjunto restringido de caracteres seguros: letras (A-Z, a-z), cifras (0-9) y algunos caracteres especiales (-, _, ., ~). Todo lo demás — espacios, acentos, emoji, símbolos como &, =, #, ? — debe convertirse a un formato seguro.
La codificación de URL (también llamada percent-encoding) sustituye los caracteres no seguros por un % seguido de su valor hexadecimal en bytes:
| Carácter | Codificado |
|---|---|
| Espacio | %20 |
| & | %26 |
| = | %3D |
| # | %23 |
| ? | %3F |
| / | %2F |
| @ | %40 |
Cuándo es necesaria la codificación de URL
- Parámetros de consulta con caracteres especiales — una consulta como
precio > 100 & categoría = zapatosnecesita codificación para funcionar en una URL - Caracteres no latinos en las URL — nombres, ciudades o contenidos en otros idiomas deben codificarse
- Peticiones de API — al construir llamadas de API manualmente, los valores de los parámetros suelen necesitar codificación
- Depuración — cuando una URL no funciona, decodificarla revela los valores reales
Cómo codificar y decodificar
- Elige codificar o decodificar — selecciona la dirección. Usa encodeURIComponent para los parámetros de consulta o encodeURI para las URL completas.
- Pega tu entrada — introduce el texto o la URL. El resultado se actualiza al instante.
- Copia la salida — usa el resultado en tu código, tu petición de API o tu navegador.
Consejos
- Codifica los valores, no las URL enteras — si codificas una URL entera, las barras y los dos puntos que estructuran la URL también se codificarán, lo que la rompe. Codifica únicamente los valores dentro de los parámetros de consulta.
- Doble codificación — codificar una cadena ya codificada produce cosas como
%2520(el%pasa a ser%25). Si tu URL parece incorrecta, comprueba si algo está codificado dos veces. - Decodifica para depurar — cuando una petición de API falla o una URL parece ilegible, decodifícala para ver los valores reales. Eso revela el problema al instante con frecuencia.
- Usa las funciones integradas de tu lenguaje — en código de producción, usa siempre
encodeURIComponent()(JavaScript),urllib.parse.quote()(Python) oURLEncoder.encode()(Java) en lugar de codificar a mano.
Preguntas frecuentes
¿Cuál es la diferencia entre encodeURI y encodeURIComponent?
encodeURI preserva los caracteres válidos en una estructura de URL (barras, dos puntos, signos de interrogación). encodeURIComponent codifica todo salvo letras, cifras y algunos caracteres seguros. Usa encodeURIComponent para los valores de parámetros de consulta, encodeURI para las URL completas.
¿Por qué los espacios se convierten en %20 o +?
En la codificación de URL, los espacios se convierten en %20. En los datos de formulario (application/x-www-form-urlencoded), los espacios se convierten en +. Ambos son válidos en sus contextos, pero %20 es el estándar universal para las URL.
¿Tengo que codificar mis URL manualmente?
En la mayoría de los casos, tu lenguaje o framework se encarga de la codificación automáticamente. La codificación manual es útil al construir URL a mano, depurar peticiones de API o trabajar con cadenas de consulta que contienen caracteres especiales.
¿Se envían mis datos a un servidor?
No. Toda la codificación y decodificación se hace en tu navegador.