L’encodage d’URL, aussi connu sous le nom d’encodage en pourcentage, est essentiel pour transmettre des données en toute sécurité dans les URL. Ce processus convertit les caractères non autorisés dans les URL standard (comme les espaces, les caractères spéciaux et les lettres accentuées) en un format que les serveurs web peuvent comprendre. JavaScript fournit deux fonctions puissantes, encodeURI() et encodeURIComponent(), pour gérer cela efficacement. Comprendre leurs différences est la clé pour construire des applications web robustes et sécurisées.
Table des matières
- Quelle est la différence entre URI et URL ?
- Encodage d’une URL à l’aide de la méthode
encodeURI()en JavaScript - Encodage d’une URL à l’aide de la méthode
encodeURIComponent()en JavaScript - Choisir la bonne méthode d’encodage
Quelle est la différence entre URI et URL ?
Bien qu’ils soient souvent utilisés de manière interchangeable, URI (Uniform Resource Identifier) et URL (Uniform Resource Locator) sont distincts. Un URI est un terme général identifiant une ressource, tandis qu’une URL est un type spécifique d’URI qui localise une ressource en spécifiant son mécanisme d’accès (par exemple, HTTP). Considérez un URI comme l’adresse et une URL comme les indications pour se rendre à cette adresse. Dans la pratique, pour l’encodage JavaScript, la différence est minime ; les deux nécessitent un encodage approprié pour gérer les caractères spéciaux.
Encodage d’une URL à l’aide de la méthode encodeURI() en JavaScript
La méthode encodeURI() encode une URI ou une URL complète. Elle cible les caractères spéciaux qui ne sont pas autorisés dans les chemins d’URL, les paramètres de requête ou les identificateurs de fragment, laissant les caractères généralement considérés comme sûrs (comme les barres obliques /, les points d’interrogation ? et les esperluettes &) inchangés.
let url = "https://www.example.com/search?q=hello world";
let encodedUrl = encodeURI(url);
console.log(encodedUrl); // Sortie : https://www.example.com/search?q=hello%20world
encodeURI() remplace les espaces par %20 (la représentation encodée en pourcentage d’un espace). Elle convient pour encoder des URL complètes, mais pas des composants individuels qui pourraient contenir des caractères réservés.
Encodage d’une URL à l’aide de la méthode encodeURIComponent() en JavaScript
encodeURIComponent() est plus agressif, encodant tous les caractères spéciaux, y compris ceux généralement sûrs dans les URL. Cela la rend parfaite pour encoder les composants individuels d’une URL (paramètres de requête ou identificateurs de fragment). Encoder l’URL entière avec cette méthode entraînerait une URL mal formée.
let urlBase = "https://www.example.com/search?q=";
let query = "hello world & caractères spéciaux";
let encodedQuery = encodeURIComponent(query);
let completeUrl = urlBase + encodedQuery;
console.log(completeUrl); // Sortie : https://www.example.com/search?q=hello%20world%26%20caract%C3%A8res%20sp%C3%A9ciaux
Remarquez comment encodeURIComponent() a encodé tous les espaces et l’esperluette. Cela empêche les comportements inattendus et les failles de sécurité lors de la construction dynamique d’URL.
Choisir la bonne méthode d’encodage
Utilisez encodeURI() pour les URL complètes et encodeURIComponent() pour les composants individuels (paramètres de requête, identificateurs de fragment). Une mauvaise utilisation de ces fonctions peut créer des URL cassées et des erreurs côté serveur. Décodez toujours l’URL côté serveur pour récupérer les données d’origine.