Codificación URL: codifica parámetros de consulta y rutas

La codificación porcentual sustituye caracteres inseguros por %XX para que cualquier texto sea seguro dentro de una URL. Sepa qué caracteres escapar y cómo decodificarlos.

Qué es la codificación porcentual

Los caracteres que no se pueden usar dentro de una URL se sustituyen por un signo de porcentaje y dos dígitos hexadecimales. Un espacio se vuelve %20 y un ampersand se vuelve %26.

encodeURIComponent frente a encodeURI

Usa encodeURIComponent para un único valor de query o un segmento de ruta — escapa /, ?, & y =. Usa encodeURI solo sobre una URL completa, donde esos caracteres son estructurales y deben sobrevivir.

La trampa de + frente a %20

En las query strings, un espacio puede aparecer como un signo + (form encoding) o como %20. decodeURIComponent no convierte el + en espacio, así que sustituye los signos + antes de decodificar datos codificados como formulario.

Doble codificación

Codificar una cadena que ya estaba codificada convierte %20 en %2520. Si ves secuencias %25 en la salida, el valor se codificó dos veces — decodifícalo varias veces hasta que deje de cambiar.

Caracteres reservados frente a no reservados

RFC 3986 divide los caracteres de una URL en reservados (gen-delims como : / ? # y sub-delims como & =) y no reservados (letras, dígitos, - . _ ~). Los no reservados nunca necesitan codificación. Los reservados solo se codifican cuando aparecen dentro de un valor, no como parte de la estructura de la URL.

Codificar una URL completa frente a un solo valor

encodeURI está pensado para URLs enteras: deja : / ? # & = tal cual para que la URL mantenga su forma. encodeURIComponent está pensado para un único valor que entra en un segmento de ruta o parámetro de query — escapa esos caracteres estructurales para que el valor no pueda salirse de su sitio.

Construir query strings de forma segura desde código

Prefiere URLSearchParams (navegador) o url.URLSearchParams (Node) antes que concatenar cadenas. Ambas APIs codifican claves y valores correctamente, manejan parámetros con varios valores y evitan el error más común — olvidar codificar un parámetro que casualmente contiene & o =.