Encodage et décodage d’URL en TypeScript

L’encodage d’URL dépend du contexte. Un segment de chemin, une valeur de requête et des données application/x-www-form-urlencoded ne suivent pas exactement les mêmes règles ; utilisez donc l’API adaptée au composant manipulé.

Démarrage rapide#

L’exemple suivant utilise l’API standard de TypeScript ou une bibliothèque couramment utilisée pour cette tâche.

Exemple#

1function encodeComponent(value: string): string {2  return encodeURIComponent(value);3}45function decodeComponent(value: string): string {6  return decodeURIComponent(value);7}89const encoded = encodeComponent("café & tea + cake");

Opérations courantes#

Ce second exemple couvre une opération fréquente en production ou une manière plus sûre de traiter des entrées réelles.

Variante courante#

1const params = new URLSearchParams();2params.set("q", "café & tea");3params.set("page", "1");45const url = new URL("https://example.com/search");6url.search = params.toString();

Points importants#

Encodez le composant approprié plutôt qu’une URL structurée entière. Les chemins, les valeurs de requête et les formulaires n’emploient pas exactement les mêmes règles.

Bonnes pratiques#

1. Considérez toute entrée externe comme non fiable et gérez explicitement les erreurs d’analyse ou de validation.
2. Rendez explicites l’encodage, les unités, les formats et les conventions propres aux bibliothèques aux frontières du système.
3. Ajoutez des tests couvrant l’entrée vide, le texte Unicode, les entrées invalides et des données représentatives de la production.

Références#

• RFC 3986: URI Generic Syntax
• TypeScript Handbook