Codificación y decodificación de URL en línea: la guía completa de codificación porcentual sin romper sus enlaces

El error que me enseñó a respetar el porcentaje de codificación fue una redirección de OAuth que falló exactamente para un cliente. WP Adminify tenía una integración de Google Fonts que se autenticaba a través de OAuth, y un usuario, un revendedor de alojamiento que ejecutaba alguna configuración de proxy inverso que todavía no entiendo ' No entiendo completamente, seguí recibiendo redirect_uri_mismatch errores. Todos los demás estaban bien. Pasé la mayor parte de dos días culpando a la configuración de su servidor. Luego, finalmente, miré la URL real que su navegador estaba enviando, carácter por personaje, y allí estaba: %2520 donde debería haber un espacio. Su proxy fue codificar el redirect_uri. mi complemento era además codificándolo. Google recibió una URL donde el espacio había sido codificado dos veces - %20 se convirtió %2520- y rechazó todo el apretón de manos. Dos líneas de código lo arreglaron. Dos días para encontrarlo.

Ese fue ' Ni siquiera mi primer desastre de codificación. Años antes I'd creó un enlace de campaña para el lanzamiento de un complemento con un parámetro UTM que contenía un signo comercial sin formato, algo así como utm_campaign=black&friday. El panel de análisis mostró una misteriosa campaña llamada black y un parámetro fantasma llamado friday Eso no coincidía con nada. El ampersand había dividido en dos silencio mi parámetro en dos. Sin error. Sin advertencia. Solo datos silenciosamente equivocados durante once días antes de que noté que los números no suponían.

Aquí ' es lo que pasa con la codificación de URL: es ' es uno de esos problemas que parece trivial hasta que es 't. Las reglas viven en una especificación de 2005 (RFC 3986), la realidad del navegador vive en una especificación diferente (la QUÉWG Estándar de URL), JavaScript le ofrece tres funciones diferentes que hacen cosas ligeramente diferentes, y PHP le ofrece dos más. Si se equivoca, no se bloquea ' Obtenga un bloqueo: obtiene parámetros truncados, flujos OAuth rotos y enlaces que funcionan en Chrome pero mueren en un cliente de correo electrónico.

Así que construí el codificador/decodificador que siempre quise en Toolz.dev. Esta guía cubre cómo usarlo y, lo que es más importante, cómo funciona realmente la codificación porcentual, y luego %2520 En sus registros le toma dos minutos en lugar de dos días.

TL;Dr: Para codificar o decodificar URL en línea, pegue su cadena en el Codificador de URL de Toolz.dev, elija un modo y presione Encode o Decode. Maneja UTF-8 y emoji correctamente, y el botón de intercambio vuelve a alimentar la salida a la entrada para que pueda pelar los valores de doble codificación (%2520) Aparte una capa a la vez. Todo se ejecuta en el lado del cliente, por lo que los tokens y las ID de sesión en sus URL nunca tocan un servidor. Parámetro de codificación valores Con el modo de componente; solo codifica las URL completas cuando sabes por qué.

Características clave

Codificar y decodificar en una herramienta

La mitad del tiempo necesito codificar un valor. La otra mitad I' Estoy mirando una URL retorcida de un archivo de registro y necesito decodificarla en algo legible. La herramienta hace ambas cosas desde un cuadro de entrada: codificar y decodificar se ubican uno al lado del otro como dos botones, por lo que no hay búsqueda de una página separada. Pegue una cadena codificada y presione Decodificar; escriba un valor de consulta sin formato y presione Encóde. También realiza viajes de ida y vuelta limpiamente: codifica, decodifica y recuperas tu cadena original, byte por byte. Eso suena obvio, pero I' He usado herramientas en línea que destrozaron más señales en el viaje de ida y vuelta porque no pudieron 't decide qué especificaciones estaban siguiendo. Este es explícito sobre lo que hace 's en cada paso, que es exactamente lo que desea cuando usted 're depuración.

Modos de codificación de componentes frente a URL completa

Esta distinción es donde nacen la mayoría de los errores de codificación. El modo de componente codifica todo lo que es 't sin reservas, incluido /, ?, &y =- que es lo que desea para un valor de parámetro único. El modo URL completa deja los caracteres estructurales solos, por lo que la URL aún funciona como URL, que es lo que desea cuando ' está limpiando una dirección completa. Usar el incorrecto rompe la estructura de su URL o deja caracteres peligrosos sin codificar. La herramienta separa ambos modos con un solo clic en un único menú desplegable, etiquetado con la función JavaScript a la que corresponde cada uno: encodeURIComponent, encodeURI, application/x-www-form-urlencoded. Fui de un lado a otro en ese nombre. Las etiquetas de intención ("codificar un valor", "codificar una URL completa") leerían mejor frío, pero los nombres de funciones significan que el panel de referencia debajo de los mapas uno a uno en el código que está a punto de escribir, y ese es el momento en que la mayoría de la gente está realmente en el que está. Si alguna vez has escrito encodeURI cuando quisiste decir encodeURIComponent- Lo he hecho, más de una vez - el panel está ahí para atraparlo antes de que envíes.

Maneja UTF-8, emoji y personajes internacionales

escribir a máquina café y obtienes caf%C3%A9- el é correctamente expandido en sus dos bytes UTF-8. Escriba un emoji y obtendrá bytes codificados por un cuatro por ciento. Aquí es donde las herramientas más antiguas y el JavaScript desaprobado escape() Función se desmoronan: asumen latín-1 o producen no estándar %uXXXX secuencias que ningún servidor puede analizar. Si usted 're creando URL con contenido generado por el usuario: nombres, consultas de búsqueda, nombres de ciudades en cualquier idioma que sea 't Inglés - el manejo correcto de UTF-8 es 't es agradable de tener. Texto bengalí, babosas árabes, términos de búsqueda chinos: todos codifican secuencias RFC 3986 por ciento válidas que decodifican de manera idéntica en el otro extremo.

Un botón de intercambio por valores codificados doblemente

los %2520 trampa: una ya codificada %20 codificarme de nuevo me costó dos días una vez, así que este es personal. La decodificación es una operación de una sola capa: %2520 decodifica a %20, no a un espacio, porque %25 es La codificación de %. Un pase te lleva una capa. el botón de intercambio (⇄) mueve la salida nuevamente al cuadro de entrada para que el siguiente paso esté a un clic de distancia. Yo ' He desenvuelto URL de tres capas de profundidad después de que pasaron por un proxy, un servicio de redireccionamiento y un contenedor de enlaces de correo electrónico: intercambie, decodifique, intercambie, decodifique hasta que la cadena deje de cambiar. Eso " deja de cambiar" el momento es la señal real que estás buscando. Sea honesto acerca de qué es esto: es un bucle manual, no un detector. La herramienta no lo hace 't bandera %25XX para usted, y voy y vengo sobre si debería ser así: la decodificación automática hasta que sea estable sería conveniente hasta que destruya silenciosamente un valor que contenía legítimamente un signo porcentual.

Tres modos, un panel de referencia explícito

El selector de modo incluye tres opciones (componente, URL completa y forma codificada en URL) y el panel debajo explica exactamente qué caracteres escapa ese modo, cuáles conserva y muestra un ejemplo resuelto. Lo agregué porque nunca pude recordar si encodeURIComponent hojas ~ solo (lo hace) o si ! y * Sobreviven (lo hacen, lo que sorprende a la gente, ya que RFC 3986 los clasifica como sub-delims en lugar de sin reservas). En lugar de memorizar tres peculiaridades de JavaScript, eliges el modo por intención y vuelves a leer lo que está a punto de hacer. Ese texto de referencia es la parte que más uso, y es lo que quiero si estuviera aterrizando en la página fría a la 1 am.

100% del lado del cliente: nada sale de su navegador

Piense en qué y#39; en realidad dentro de las URL que decodifica: códigos de autorización OAuth, tokens de restablecimiento de contraseña, ID de sesión, direcciones de correo electrónico en enlaces de cancelación de suscripción, claves API, algún marco útilmente incluido en una cadena de consulta. Péguelos en una herramienta del lado del servidor y ingresarán los registros de acceso de alguien & # 39;s, vinculados a su IP, retenidos para quién sabe cuánto tiempo. El codificador Toolz.dev se ejecuta completamente en su navegador; la conversión consiste en algunas líneas de JavaScript que se ejecutan localmente y no se realiza ninguna solicitud con sus datos. Abra DevTools y mire la pestaña de red si no lo hace & # 39; no me crea. Para cualquier cosa adyacente a la seguridad, el lado del cliente es & # 39; una característica, it & # 39; es la barra mínima.

Gratis, sin registro, sin límites

Sin muro de cuenta, no hay una cuota de cambio de una herramienta que realiza una transformación de cadena, no se actualiza a Pro para decodificar más de 1000 caracteres. Construí Toolz.dev porque estaba cansado de sitios de utilidades ahogados por anuncios que interrumpen una tarea de diez segundos con una ventana emergente. Marcar, úsalo cincuenta veces al día, hecho.

Cómo usar el codificador y el decodificador de URL

Paso 1: Abre la herramienta y elige tu dirección

IR A Toolz.dev/Herramientas/Codificador de URL Y suelte su cuerda en el cuadro de la izquierda. Hay dos botones de acción, codificar y decodificar, y elige uno después de pegar en lugar de establecer una dirección primero. Si está comenzando con algo legible (una consulta de búsqueda, una URL de redirección que está a punto de incrustar), presione Encode. Si está comenzando con algo lleno de signos de porcentaje (una entrada de registro, un encabezado de referencia), presione Decodificar. La salida aterriza en el panel derecho con un botón de copia en el encabezado, y cambia y despeja siéntate junto a los dos botones de acción.

Paso 2: elija el modo Componente, URL completa o Formulario

codificando un preciar eso se ubicará dentro de un parámetro: un redirect_uri, un término de búsqueda, cualquier cosa después de un = ¿Señal? Usar el modo de componente. codifica /, ?, &y = Por lo tanto, su valor no puede romper la URL circundante. codificando un URL completa ¿Eso solo necesita espacios y caracteres no ASCII limpios? Utilice el modo de URL completa, que conserva los caracteres estructurales. El tercer modo, form-urlencoded, es la codificación de componentes con espacios escritos como + en vez de %20- elígelo cuando 'Estás construyendo a mano un application/x-www-form-urlencoded cuerpo Tenga en cuenta que el modo también afecta a la decodificación: en el modo de formulario, + se convierte de nuevo en un espacio antes de decodificar; en los otros dos permanece literal de plus. En caso de duda: Modo componente para piezas, modo de URL completa para todo.

Paso 3: Lea la salida y observe los signos de porcentaje sobrantes

La salida aparece en el panel derecho. Para la decodificación, mire si el resultado aún contiene %XX secuencias: si es así, el valor se codificó más de una vez. Presione Swap para mover esa salida nuevamente a la entrada, decodificarla nuevamente y repetirla hasta que la cadena deje de cambiar. Si la entrada tiene un formato incorrecto (un extraviado % no seguido de dos dígitos hexadecimales, como un literal 100%), obtendrá un error explícito en lugar de una media decodificación silenciosa, que es el comportamiento que desea cuando se depura.

Paso 4: Copiar y verificar

Presione el botón Copiar y pegue el resultado donde pertenece. Para cualquier cosa importante, especialmente las redirecciones de OAuth, haga una verificación final de cordura: pegue el valor codificado nuevamente en modo de decodificación y confírmelo durante viajes de ida y vuelta exactamente a lo que comenzó. Treinta segundos de verificación superan los dos días de redirect_uri_mismatch.

Codificación de porcentaje, RFC 3986 y por qué los espacios se convierten en %20 o +

Las URL solo pueden contener de forma segura un conjunto limitado de caracteres. Todo lo demás tiene que ser introducido de contrabando como bytes codificados por porcentaje. El reglamento es RFC 3986 (2005), y divide a los personajes en dos campos.

Personajes no reservados Nunca necesita codificación: las letras A–Z y a–z, dígitos 0–9y cuatro símbolos - guión -, período ., subrayado _, y tilde ~. Codificar estos es legal pero sin sentido.

Personajes reservados Tener trabajos estructurales dentro de una URL: : / ? # [ ] @ (los delimitadores generales) y ! $ & ' ( ) * + , ; = (los subdelimitadores). El colon separa el esquema del huésped. El signo de interrogación inicia la cadena de consulta. El ampersand separa los parámetros. Si un carácter reservado necesita codificación depende completamente de donde aparece. un / en el camino hay estructura; un / Dentro de un valor de parámetro redirect_uri es data, y debe convertirse %2F o el servidor analizará su URL incorrectamente.

La mecánica: tome el personaje, obtenga su(s) byte(s) UTF-8 y escriba cada byte como % seguido de dos dígitos hexadecimales. Los caracteres ASCII son un byte: el espacio es %20, ampersand es %26. Pero UTF-8 es una codificación de varios bytes, por lo que é es de dos bytes: %C3%A9. Un emoji típico tiene cuatro bytes - 🚀 codifica como %F0%9F%9A%80. Esta es la razón por la que las herramientas que asumen un carácter equivalen a un byte que corrompen cualquier cosa fuera del inglés.

Ahora, el problema del espacio es lo más confuso en la codificación de URL. Según RFC 3986, un espacio se convierte en %20. Pero los envíos de formularios HTML usan una serialización diferente, application/x-www-form-urlencoded, definido hoy en el Whatwg estándar de URLy aquello El formato codifica espacios como +. Ambos son correctos, en sus propios contextos. Lo que significa + En una cadena de consulta es ambigua: puede ser un signo más literal (lectura RFC 3986) o un espacio codificado (lectura de codificación de formulario). Si alguna vez ha visto llegar un número de teléfono como 1234 5678 Cuando alguien envió +1234..., has conocido a este error. Mi consejo: siempre emitir %20 por espacios y %2B Para signos literales más. Nadie los analizó.

JavaScript le ofrece tres funciones y no son intercambiables. Dada la cadena a=b&c d:

const s = "a=b&c d";

encodeURIComponent(s); // "a%3Db%26c%20d"  — encodes =, &, and space
encodeURI(s);          // "a=b&c%20d"      — leaves = and & alone
escape(s);             // "a%3Db%26c%20d"  — deprecated; breaks on Unicode

encodeURIComponent Codifica todo excepto los caracteres no reservados (más !'()*- una peculiaridad heredada), lo que la hace segura para los valores de los parámetros. encodeURI conserva caracteres reservados para que una URL completa siga siendo funcional, pero eso también significa que sí no ganará proteger un & dentro de sus datos. y escape() está en desuso por una buena razón: produce no estándar %uXXXX Secuencias para caracteres no latinos. Nunca lo use en código nuevo.

PHP refleja la misma división con un giro: urlencode() Produce codificación de estilo de forma (los espacios se convierten en +), mientras rawurlencode() sigue a RFC 3986 (los espacios se convierten %20). Si está creando URL para cualquier otra cosa que no sea un cuerpo de publicación de formulario, rawurlencode() es el que quieres. Envié el código de administración de WP con el incorrecto desde el principio; el propio WordPress add_query_arg() Me salvó más veces de las que me gustaría admitir.

Finalmente, la trampa de codificación doble. %20 Es un espacio, codificado. cifrar esa cadena de nuevo y el % mismo se convierte en %25, dándote %2520. decodifica una vez y obtienes %20 atrás, todavía codificado. Esto sucede cada vez que dos capas de un sistema cada una "ayudablemente" codificar: su código más un proxy, un servicio de redireccionamiento más un contenedor de enlaces de correo electrónico. La regla que lo impide: codificar exactamente una vez, en el último momento posible antes de que el valor entre en la URL, y nunca codificar algo que no haya hecho' simplemente decodifique o genere sin formato.

Casos de uso comunes

Creación de cadenas de consulta con entrada de usuario

Cada vez que el texto escrito por el usuario ingresa a una URL (cuadros de búsqueda, filtros, valores de formulario pasados a través de GET), debe estar codificado por componentes. Un usuario que busca Q&A tips se convierte en ?q=Q%26A%20tips; Sin codificar, el servidor ve una búsqueda de Q y un parámetro misterioso A tips. Durante el desarrollo utilizo el Codificador de URL Para generar valores esperados antes de escribir el código, tengo una referencia conocida-correcta contra la que probar. También es la forma más rápida de resolver "¿debería codificarse este carácter" argumentos en Revisión de código: péguelo en el modo de componente y busque. API modernas como JavaScript URLSearchParams maneje esto automáticamente y debería usarlos, pero aún así es necesario verificar Su salida cuando algo se rompe, y eso es un trabajo de decodificación.

Depuración de enlaces de UTM y campaña

Los enlaces de marketing codifican campos minados. Valores UTM con espacios, tuberías o amplificadores; enlaces que pasan a través de un acortador de URL, luego un servicio de correo electrónico ' haga clic en el rastreador, luego en una redirección: cada capa tiene la posibilidad de agregar o destrozar codificación. Cuando una campaña aparece mal en análisis, mi primer movimiento es siempre el mismo: pegar el enlace completo en modo decodificar y leer lo que realmente recibió el servidor de análisis. Nueve de cada diez veces el culpable es visible en segundos: sin formato & Dividir un parámetro, un + Se suponía que eso era una ventaja literal, o un %2520 Traicionando la doble codificación. mi black&friday El incidente habría sido una solución de once segundos en lugar de un agujero de datos de once días si hubiera hecho esto el primer día.

Redirect_uri y URL de devolución de llamada de OAuth

OAuth es donde los errores de codificación se vuelven costosos, porque los proveedores sí Coincidencia exacta de cadena en URI de redireccionamiento. Redirect_uri es una URL completa incrustada como valor de parámetro dentro de otra URL, por lo que debe codificarse por componentes exactamente una vez. Subcodificarlo y el ? investigaciones operacionales & En su interior se rompe la URL de autorización externa. Doble-codifique y el proveedor compara https%3A%2F%2F... contra su registro https://... y devoluciones redirect_uri_mismatch con cero más detalles. Cuando aparezca ese error, decodifique la URL de autorización real de la barra de direcciones de su navegador y compare el valor registrado de carácter por carácter con el valor registrado de su aplicación. emparejarlo con el Decodificador JWT Para inspeccionar los tokens que regresan, y puede depurar un flujo OAuth completo sin salir del navegador.

Decodificando URLs retorcidas de registros y encabezados de referencia

Los registros del servidor y los encabezados de referencia están llenos de sopa codificada por porcentaje: %D0%9F%D1%80%D0%B8%D0%B2%D0%B5%D1%82 en una referencia de búsqueda, rutas codificadas triplemente a partir del tráfico de bots, cargas útiles codificadas en solicitudes sospechosas. Decodificar esto es como se descubre lo que realmente sucedió: si ese extraño 404 era un usuario con una consulta cirílica o un script que buscaba ../../etc/passwd Detrás de tres capas de codificación. Esta es también exactamente la situación en la que más importa el ángulo de privacidad: las URL de registro contienen rutinariamente tokens de sesión y direcciones de correo electrónico. Decodifique en una herramienta del lado del cliente, no en un servidor aleatorio que mantenga sus propios registros. Escribí más sobre este flujo de trabajo en el Guía de herramientas de depuración de API.

Pruebas de API con curl

Su shell y curl forman un segundo campo minado en la parte superior de la codificación de URL. & Antecedentes Un proceso en bash, ? desencadena la expansión global en zsh, por lo que una URL no codificada y sin comillas falla de manera confusa incluso antes de llegar a la red. Mi flujo de trabajo: codifique cada valor de parámetro en la herramienta, ensamble la URL, envuélvala en comillas individuales y luego ejecute curl. Cuando una API devuelve un 400 para una solicitud que "se ve bien," Decodigo la URL exacta a partir de la salida detallada (curl -v) para ver qué se envió realmente, más de una vez el error fue mi terminal, no mi API. rizo 's --data-urlencode Marcar maneja la codificación para los cuerpos de las publicaciones, pero para obtener cadenas de consulta, usted es mayormente solo, y un codificador confiable supera las adivinanzas.

Compartir enlaces con texto no ASCII

Artículos de Wikipedia en otros idiomas, enlaces de Google Maps con nombres de lugares locales, URL de documentos con babosas bengalíes o árabes: copie uno de su barra de direcciones y podrá obtener cualquiera de los bonitos Unicode forma o pared de %E0%A6%AC-bytes de estilo, según el navegador y el estado de ánimo del #39. Algunas aplicaciones de chat y clientes de correo electrónico truncan o alteran el formulario Unicode sin formato. Codificar la URL antes de compartir produce una cadena ASCII pura que sobrevive a cada mensajero, lista de correo y renderizador Markdown I' lo he intentado. Yendo en sentido contrario, la decodificación convierte un enlace compartido ilegible en algo que un humano puede verificar antes de hacer clic; vale la pena hacer antes de reenviar cualquier cosa que llegue con apariencia de ruido de línea.

EncodeUriComponent vs EncodeURI vs Escape(): ¿Cuál deberías usar?

Tres funciones, una correcta predeterminada. Aquí está la comparación honesta:

Mi postura, y moriré en esta colina: aprovechamiento encodeURIComponent Para los valores, casi siempre. El modelo mental es simple, si la cadena va entromete una URL (un valor de consulta, un segmento de ruta, un redirect_uri), es un componente y se obtiene encodeURIComponent. los casos donde encodeURI Es realmente raro: tiene una URL completa y ya estructurada que contiene espacios o caracteres no ASCII, y desea desinfectarlo sin tocar su estructura. Eso es quizás el 5% de las llamadas de codificación del mundo real. y escape() simplemente nunca debería aparecer en el código escrito después de 2010 aproximadamente: su salida Unicode es 't codificación porcentual válida, y cada linter moderno la marcará de todos modos.

Un matiz más: encodeURIComponent hojas ! ' ( ) * no codificados por razones históricas, aunque RFC 3986 los enumera como subdelimitadores reservados. Para OAuth y API de análisis estricto, algunas bibliotecas agregan un segundo pase para codificar esas cinco también. Si una API exigente rechaza sus valores, ese & #39; es un lugar para buscar, y el Codificador de URL'S El modo de componente le muestra exactamente qué caracteres se convirtieron para que pueda comparar.

Preguntas frecuentes

¿Qué es la codificación de URL?

La codificación de URL (codificación porcentual) es el mecanismo para representar caracteres en una URL que de otro modo sería insegura o estructuralmente significativa. Cada carácter problemático se convierte a sus bytes UTF-8 y cada byte se escribe como un signo porcentual seguido de dos dígitos hexadecimales: un espacio se convierte en %20, un signo comercial se convierte en %26. Las reglas se definen en RFC 3986. Existe porque las URL solo permiten un conjunto de caracteres limitado y caracteres como ? y & Tengo trabajos que hacer dentro de la estructura de URL.

¿Por qué los espacios se convierten en %20 a veces y en otros tiempos?

Dos especificaciones diferentes. RFC 3986, que rige las URL en sí, codifica un espacio como %20. El formato codificado por URL de formulario x-www utilizado por los envíos de formularios HTML, definido en el estándar de URL WHATWG, codifica un espacio como +. Ambos son válidos en su propio contexto, por lo que + en una cadena de consulta es ambiguo. La práctica segura: siempre produce %20 para espacios y %2B para signos plus literales; cada analizador los maneja correctamente.

¿Cuál es la diferencia entre EncodeURI y EncodeUriComponent?

encodeURIComponent codifica casi todo, incluido /, ?, & y =, lo que lo hace seguro para valores individuales colocados dentro de una URL. encodeURI conserva esos caracteres reservados para que una URL completa mantenga su estructura. Utilice encodeURIComponent para valores de parámetros y segmentos de ruta, que es casi todos los casos del mundo real, y encodeURI sólo cuando desinfecte una URL completa sin reestructurarla. Usar encodeURI en un valor que contenga & romperá silenciosamente su cadena de consulta.

¿Cómo arreglo una URL de doble codificación?

La codificación doble ocurre cuando una cadena ya codificada se codifica nuevamente: %20 se convierte en %2520 porque el % en sí se convierte en %25. Para solucionarlo, decodifique la cadena repetidamente hasta que no queden secuencias %XX y la salida deje de cambiar. Luego busque qué capa de su sistema codificada dos veces (comúnmente su código más un proxy, servicio de redireccionamiento o contenedor de enlaces de correo electrónico) y elimine uno de los pasos de codificación. La regla: codifique exactamente una vez, en el último momento antes de que el valor ingrese a la URL.

¿Es seguro decodificar las URL en una herramienta en línea?

Sólo si la herramienta se ejecuta en el lado del cliente. Las URL frecuentemente contienen códigos OAuth, tokens de restablecimiento de contraseña, ID de sesión y direcciones de correo electrónico. Una herramienta del lado del servidor recibe todo eso y puede mantenerlo en los registros de acceso indefinidamente. El codificador/decodificador de URL Toolz.dev realiza todas las conversiones en su navegador con JavaScript; no se transmiten datos a ninguna parte, lo cual puede verificar en su navegador & #39;s pestaña de red. Para cualquier cosa que contenga credenciales o tokens, el procesamiento del lado del cliente no debe ser negociable.

¿Necesito codificar la URL completa o solo los parámetros?

Sólo las partes de datos: valores de parámetros individuales y, ocasionalmente, segmentos de ruta. Los caracteres estructurales de la propia URL (el :// después del esquema, el ? iniciando la consulta, el & entre parámetros) deben permanecer sin codificar o la URL deja de funcionar. Codifique cada valor por separado con codificación de estilo componente y luego ensamble la URL a su alrededor. Codificar una URL completa de un extremo a otro solo es correcto cuando esa URL se está convirtiendo en un valor dentro de otra URL, como una OAuth redirect_uri.

¿Puede la codificación de URL manejar emoji y caracteres no ingleses?

Sí, la codificación porcentual moderna funciona en bytes UTF-8, por lo que cualquier carácter Unicode funciona. Un carácter de dos bytes como e se convierte en %C3%A9, y un emoji de cuatro bytes se convierte en cuatro secuencias porcentuales, como %F0%9F%9A%80. Los problemas solo surgen con herramientas heredadas o la función escape() obsoleta de JavaScript's, que asumen codificaciones de un solo byte y producen resultados no válidos. El codificador Toolz.dev maneja correctamente el UTF-8 completo en ambas direcciones.

¿Por qué mi URL se rompe cuando un parámetro contiene un ampersand?

Porque & es el delimitador entre parámetros. Si un valor contiene un signo comercial - digamos utm_campaign=black& viernes - el servidor lo analiza como un parámetro llamado utm_campaign con valor negro, más un segundo parámetro llamado viernes. No se genera ningún error; sus datos simplemente están silenciosamente equivocados. Codifique el signo comercial como %26 dentro del valor y el parámetro llegará intacto. Este es uno de los errores de URL más comunes y menos visibles.

¿Qué significa %2f en una URL?

%2F es la barra diagonal codificada por porcentaje. Usted y #39; Lo veré cuando un valor que contiene una barra diagonal (una ruta de archivo, una fecha como 07/07 o una URL anidada) se codifica correctamente antes de colocarlo en un parámetro de consulta o segmento de ruta. Tenga en cuenta que algunos servidores y proxies (Apache, versiones anteriores de Tomcat, varias puertas de enlace API) rechazan o decodifican silenciosamente %2F en la ruta por razones de seguridad, por lo que si una solicitud con una barra codificada devuelve un 404, la configuración del lado del servidor suele ser la culpable, no su codificación.

¿Cómo codifico URL en Python, PHP o en la línea de comandos?

Python: urllib.parse.quote() para segmentos de ruta y quote_plus() para valores de consulta de estilo de formulario. PHP: RawurlenCode() produce salida RFC 3986 con %20 para espacios, mientras que urlencode() produce una salida de estilo de forma con +. Línea de comando: jq -rr @uri o curl's --data-urlencode flag. Cada uno de estos coincide con el comportamiento de estilo de componente de esta herramienta, por lo que puede crear un prototipo de codificación aquí y verificar que su código produzca una salida idéntica a bytes.

envolviendo

La codificación de URL es una pequeña habilidad con una recompensa desdichada. Una vez que puedas leer %C3%A9 Como un y un lugar %2520 como olor a doble codificación, toda una categoría de " funciona en mi máquina" Los errores (flujos OAuth rotos, campañas UTM fantasma, API que rechazan solicitudes de apariencia perfectamente razonable) pasan de misteriosos a mecánicos. Las reglas encajan en una ficha: los caracteres no reservados pasan, todo lo demás se convierte en bytes UTF-8 como %HH, codifican valores, no estructura, y codifican exactamente una vez.

mantener el Codificador de URL/decodificador marcado junto a sus hermanos: el Convertidor Base64 Para el otro esquema de codificación que encontrará en cada encabezado de autenticación (he escrito un completo Guía de codificación Base64 sobre cuándo usar cuál), el Codificador de entidades HTML Para la tercera capa de codificación que al contenido web le encanta apilar en la parte superior (el Guía de entidad HTML Cubre la versión de doble escape de la misma trampa con la que golpeé %2520), y el Formateador JSON para lo que sea que puntos de URL decodificados.

Y si está ensamblando un kit de depuración basado en navegador más amplio, el Guía de herramientas de codificación analiza cómo estas herramientas encajan en un flujo de trabajo real. Todo en Toolz.dev se ejecuta en el lado del cliente, no cuesta nada y hace bien un trabajo. Eso' es todo el discurso, el mismo que desearía que alguien me hubiera hecho antes de pasar dos días en un solo %25 fuera de lugar.