Codificador / decodificador de URL
Codifica texto con codificación por porcentaje para que sea seguro en cadenas de consulta, rutas y fragmentos, o decodifica una URL codificada a texto legible.
Entrada
Resultado
Cómo usar el codificador y decodificador de URL
Pega tu texto o URL y elige un modo. Codificar un valor (encodeURIComponent) es el que necesitarás casi siempre, para los valores de los parámetros de consulta. Codificar una URL completa (encodeURI) deja intactos los caracteres de estructura / ? & #. Decodificar revierte cualquiera de los dos. El resultado se actualiza mientras escribes.
Por qué importa la codificación
Las URL solo admiten letras ASCII, dígitos y un pequeño conjunto de caracteres reservados. Los espacios, los emojis, las letras acentuadas, los ampersands dentro de valores y las comillas deben codificarse con porcentaje. Sin codificación, una URL se rompe en el primer ampersand dentro de un valor, se corta en el primer espacio o devuelve un 404 con un carácter UTF-8. La codificación porcentual es la solución estándar.
Usos habituales
- Crear URL de campaña con etiquetas UTM que contienen espacios o caracteres acentuados
- Codificar datos de formularios para solicitudes GET
- Depurar enlaces de seguimiento cuyos parámetros parecen dañados
- Crear endpoints de API con contenido generado por usuarios en la ruta
- Codificar caracteres no latinos (japonés, árabe, cirílico) para URL
- Decodificar URL de los registros para que vuelvan a ser legibles
encodeURI frente a encodeURIComponent
encodeURI sirve para URL completas. Deja tranquilos los caracteres de estructura como / ? & # porque tienen un significado en la URL. encodeURIComponent sirve para valores individuales y codifica todo lo que lo necesita, incluidos / y &. Usa encodeURIComponent para los valores de los parámetros de consulta y encodeURI para URL completas que hayas armado a partir de partes de confianza.
Preguntas frecuentes
¿Por qué un espacio a veces se convierte en + y a veces en %20?
Ambos pueden representar un espacio, pero en lugares distintos. En las cadenas de consulta de formularios HTML, + es habitual. En las rutas, solo funciona %20. Los codificadores de JavaScript siempre usan %20 para evitar ambigüedades.
¿Tengo que codificar # y &?
Dentro del valor de un parámetro, sí; si no, & se leerá como el inicio del siguiente parámetro. En un fragmento después de #, un ampersand no da problemas. En una ruta, codifica # pero deja las barras como están.
¿Por qué mi emoji se estropea en las URL?
Los emojis son caracteres UTF-8 de varios bytes y muchos sistemas no los codifican con porcentaje automáticamente. Pasa el contenido generado por usuarios por encodeURIComponent antes de añadirlo a una URL.
¿La codificación romperá mi píxel de seguimiento?
Solo si se codifica dos veces. Fíjate si aparece %2520 donde esperabas %20. Decodifica una vez y luego codifica una vez.