Guía
Espacios en URL: diferencia entre %20 y +
Aprende cuándo un espacio se representa como %20 o como +, cómo conservar un signo más literal y qué codificación usa cada contexto.
por Tools in a Tab · Publicado el · Revisado el
Respuesta breve
%20 representa un espacio mediante percent-encoding en una URL. El signo +
representa un espacio específicamente en datos codificados como
application/x-www-form-urlencoded, usados a menudo en consultas y
formularios. Fuera de ese formato, + puede ser un signo más literal. Si
necesitas conservarlo dentro de datos de formulario, codifícalo como %2B.
Tres entradas, tres significados
Supón que quieres transportar estos valores:
| Valor original | Percent-encoding de componente | Formulario URL-encoded |
|---|---|---|
café solo |
caf%C3%A9%20solo |
caf%C3%A9+solo |
a+b |
a%2Bb |
a%2Bb |
a b |
a%20b |
a+b |
El problema aparece cuando se descodifica a+b con reglas de formulario: se
obtiene a b, no el signo más original. Por eso un + que forma parte del dato
debe llegar como %2B en ese contexto.
Qué regla aplica cada API
encodeURIComponent("a b") devuelve a%20b. En cambio,
URLSearchParams serializa espacios como + porque utiliza el formato de
formulario. Ambos resultados pueden ser correctos; responden a algoritmos y
contextos diferentes.
La sección de percent-encoding del RFC 3986
define la forma %HH. El estándar URL de WHATWG
define el algoritmo application/x-www-form-urlencoded que transforma el
espacio en +.
Qué hace la herramienta
El codificador y decodificador URL de
Tools in a Tab trabaja con componentes mediante las operaciones equivalentes a
encodeURIComponent y decodeURIComponent. Por tanto, un espacio se codifica
como %20; no interpreta automáticamente + como espacio.
Esto resulta apropiado para construir de forma segura un segmento o valor de
componente. Si estás reproduciendo exactamente el cuerpo de un formulario,
utiliza URLSearchParams o el analizador de query
strings, que aplica las reglas de
formulario y conserva por separado cada nombre, valor y aparición repetida.
Regla práctica
- Identifica si codificas un componente de URL o datos de formulario.
- Para componentes, espera
%20para el espacio. - En formulario URL-encoded, espera
+para el espacio. - Representa siempre un signo más literal como
%2Bcuando el receptor aplique reglas de formulario.
No reemplaces todos los + por espacios sin conocer el formato: esa sustitución
puede cambiar un dato legítimo.