Query String

JSON

À quoi sert Query String vers JSON ?

Vous collez une query string à gauche — avec ou sans le ? initial — et la droite se remplit avec un objet JSON. Les valeurs sont décodées au passage (donc customer=Ava%20Chen devient "customer": "Ava Chen"), et si la même clé apparaît plusieurs fois elle est regroupée dans un tableau JSON. Ce dernier point est ce que la plupart des découpages improvisés ratent, et c'est pour ça que cette page existe.

Le parsing utilise URLSearchParams intégré au navigateur — la même chose qui alimente request.query dans tous les frameworks web modernes. URLSearchParams suit les règles application/x-www-form-urlencoded du standard URL du WHATWG, ce que les navigateurs envoient quand un formulaire fait un POST. La sortie est ensuite sérialisée via JSON.stringify selon RFC 8259.

Tout tourne dans votre navigateur. Si votre entrée est une URL complète, la page est tolérante — elle en extraira la partie query pour vous. Si vous voulez seulement les composants de l'URL (host, path, etc.), utilisez plutôt URL vers JSON. Si vous voulez juste regarder les paramètres sans garder le JSON, la page URL Parser est mieux adaptée. Les règles de pourcentage en jeu ici sont définies par RFC 3986 §2.1.

Comment convertir une Query String en JSON

Trois étapes. Chacune correspond à un bouton sur cette page.

Collez la Query String

Déposez la query string dans le panneau de gauche. Inclure le ? initial est très bien — le parser l'enlève. Cliquez sur Exemple pour charger une URL de filtre e-commerce réaliste avec des valeurs en pourcentage, de la notation crochets et une clé tag répétée. Exemple :

?customer=Ava%20Chen&status=active&total%5Bgte%5D=49.99&page=2&tag=premium&tag=verified

Vous pouvez aussi coller une URL complète comme <code>https://shop.example.com/orders?...</code> et la page en extraira la partie query.

Lisez l'objet JSON

Le panneau de droite se met à jour pendant que vous tapez. Chaque paramètre est une clé, chaque valeur est décodée et les clés répétées deviennent des tableaux. Donc l'exemple ci-dessus produit "customer": "Ava Chen", "total[gte]": "49.99" et "tag": ["premium", "verified"]. Les nombres restent des chaînes — les query strings n'ont pas d'information de type, donc faire semblant ne ferait que cacher des bugs.

Copier, télécharger ou minifier

Cliquez sur Copier pour envoyer le JSON dans le presse-papiers, Télécharger pour le sauver en querystring.json, ou Minifier pour le compacter sur une seule ligne. Effacer remet à zéro le panneau d'entrée.

Quand vous l'utiliseriez vraiment

Déboguer des logs de requêtes

Les logs serveur déversent la ligne de requête complète, query string comprise. Quand vous cherchez pourquoi la recherche d'un client n'a rien renvoyé, copier ?customer=Marco%20Rivera&status=cancelled&date_from=2026-04-01&date_to=2026-04-30 du log dans cette page va plus vite que de décoder mentalement chaque valeur. Le JSON rend les vrais filtres évidents.

Générer des fixtures de test à partir de trafic réel

Vous écrivez des tests contre un endpoint qui prend 12 paramètres de query. Récupérez une vraie URL en prod, collez la query string ici et utilisez le JSON comme objet de paramètres dans votre test. Vrais noms, vraies formes, vrais bugs attrapés — bien mieux que d'inventer customer: "ORD-1001" de tête.

Migrer entre conventions de query string

Chaque stack encode les tableaux différemment — ?tag=red&tag=blue, ?tag[]=red&tag[]=blue, ?tag=red,blue. Convertir d'abord en JSON donne une forme intermédiaire neutre. À partir de là, transformer vers la convention cible est un script de 5 lignes au lieu d'archéologie regex.

OAuth, webhooks et callbacks d'analytics

Les callbacks OAuth reviennent en ?code=abc&state=xyz. Les URLs de webhook de services comme Stripe ou GitHub fourrent des métadonnées dans la query string. Les redirections d'analytics empilent une douzaine de paramètres UTM et de tracking par-dessus. Coller juste la partie query ici vous amène direct à l'objet de paramètres sans avoir à virer le host d'abord.

Questions fréquentes

Faut-il inclure le point d'interrogation initial ?

Non — collez avec ou sans. Le parser enlève le ? initial s'il en voit un. Vous pouvez même coller une URL complète (https://api.shop.example.com/orders?customer=Ava%20Chen) et la page en extraira la partie query.

Comment sont gérées les clés répétées ?

Elles sont regroupées dans un tableau JSON. Donc ?tag=premium&tag=verified devient "tag": ["premium", "verified"]. Cela correspond au comportement de URLSearchParams.getAll() et à la façon dont Express, FastAPI, ASP.NET et Spring parsent les query strings.

Et les clés sans valeur comme ?debug ou ?dry-run ?

Elles deviennent des chaînes vides — "debug": "". URLSearchParams traite une clé sans = de la même façon que key= selon le standard URL du WHATWG. Si vous voulez un vrai booléen, post-traitez le JSON avec un truc comme obj.debug = "debug" in obj.

Et la notation crochets comme ?items[]=1&items[]=2 ?

Les crochets sont gardés comme partie de la clé — vous verrez "items[]": ["1", "2"] dans la sortie. C'est honnête par rapport aux octets sur le fil. Si votre framework (PHP, Rails, qs.js) a besoin que les crochets soient enlevés ou développés en objets imbriqués, faites-le en post-traitement.

Pourquoi toutes les valeurs sont des chaînes, même si elles ressemblent à des nombres ou booléens ?

Parce que les query strings ne portent aucune information de type. ?count=5 et ?count=true sont juste du texte. Auto-coercer en nombres ou booléens rend un exemple du happy path tout propre mais cause des bugs silencieux dès qu'un nom de client est "1" ou que quelqu'un écrit ?id=007. La sortie reste en chaînes ; convertissez dans votre code, là où vous connaissez le schéma.

Comment ça gère Unicode et emoji ?

Proprement. URLSearchParams décode les octets en pourcentage, puis les interprète en UTF-8 — donc ?name=%E4%B8%AD%E6%96%87 devient "name": "中文" et un emoji comme ?reaction=%F0%9F%94%A5 devient "reaction": "🔥". JSON.stringify échappe ensuite ce qui doit l'être selon RFC 8259 §7.

Autres outils URL & JSON

Décoder une query string est une opération. Voici ce qui s'associe bien :