Acerca de la codificación URL
La codificación URL, también conocida como codificación por porcentaje, es un mecanismo para codificar información en un Identificador Uniforme de Recursos (URI). Se utiliza para convertir caracteres no permitidos en una URL en un formato que se pueda transmitir por Internet. Esta codificación reemplaza caracteres ASCII inseguros con un "%" seguido de dos dígitos hexadecimales.
Usos comunes de la codificación URL
- Formatear cadenas de consulta en URLs
- Enviar datos de formularios mediante solicitudes HTTP (application/x-www-form-urlencoded)
- Crear URLs válidas con caracteres especiales o espacios
- Codificar caracteres no ASCII en URLs
- Pasar parámetros complejos en APIs y servicios web
Cómo funciona la codificación URL
La codificación URL sigue estos principios:
- Los caracteres alfanuméricos (A-Z, a-z, 0-9) permanecen sin cambios
- Caracteres especiales como espacio, ?, &, =, %, + se convierten en sus equivalentes codificados
- Cada byte de un carácter UTF-8 se codifica por separado
- El espacio puede codificarse como "%20" o "+" (en parámetros de consulta)
- Caracteres reservados como /, :, ?, #, [ tienen significados especiales y pueden tratarse según contexto
encodeURI vs encodeURIComponent
JavaScript proporciona dos funciones para la codificación URL:
- encodeURI: Codifica un URI completo, preservando los caracteres de sintaxis (/:?#[]@!$&'()*+,;=)
- encodeURIComponent: Codifica un componente URI, incluyendo todos los caracteres especiales
En la mayoría de los casos, encodeURIComponent()
es más seguro para entrada de usuario o parámetros.
Codificación URL para caracteres internacionales
Los navegadores modernos codifican caracteres no ASCII con UTF-8 y luego los percent-codifican. Esto garantiza que emojis y símbolos Unicode se incluyan correctamente. Por ejemplo, la letra ucraniana "ї" se codifica primero como bytes (D1 97) y luego como "%D1%97".
Ejemplos
Texto plano | URL codificado |
---|---|
Hello World | Hello%20World |
https://example.com/?q=search term | https%3A%2F%2Fexample.com%2F%3Fq%3Dsearch%20term |
50% off sale! | 50%25%20off%20sale%21 |
こんにちは | %E3%81%93%E3%82%93%E3%81%AB%E3%81%A1%E3%81%AF |