Joindre les segments d'URL : un tutoriel JavaScript

Introduction

Dans ce laboratoire, nous allons explorer comment joindre les segments d'URL et normaliser l'URL résultante à l'aide de JavaScript. Le laboratoire vous guidera tout au long du processus d'utilisation de diverses expressions régulières pour supprimer les doubles barres obliques, ajouter les barres obliques appropriées pour le protocole, supprimer les barres obliques avant les paramètres, combiner les paramètres avec '&' et normaliser le premier délimiteur de paramètres. À la fin de ce laboratoire, vous serez capable d'unir et de normaliser efficacement les segments d'URL à l'aide de JavaScript.

Joindre et normaliser les segments d'URL

Pour joindre les segments d'URL donnés et normaliser l'URL résultante, suivez les étapes suivantes :

Utilisez Array.prototype.join() pour combiner les segments d'URL.
Utilisez une série d'appels à String.prototype.replace() avec diverses expressions régulières pour normaliser l'URL résultante en :
- Enlevant les doubles barres obliques
- Ajoutant les barres obliques appropriées pour le protocole
- Enlevant les barres obliques avant les paramètres
- Combinant les paramètres avec '&' et normalisant le premier délimiteur de paramètres.

Utilisez le extrait de code ci-dessous pour joindre et normaliser les segments d'URL :

const URLJoin = (...args) =>
  args
    .join("/")
    .replace(/[\/]+/g, "/")
    .replace(/^(.+):\//, "$1://")
    .replace(/^file:/, "file:/")
    .replace(/\/(\?|&|#[^!])/g, "$1")
    .replace(/\?/g, "&")
    .replace("&", "?");

Utilisation de l'exemple :

URLJoin("http://www.google.com", "a", "/b/cd", "?foo=123", "?bar=foo");
// 'http://www.google.com/a/b/cd?foo=123&bar=foo'

Sommaire

Félicitations ! Vous avez terminé le laboratoire Joindre les segments d'URL. Vous pouvez pratiquer d'autres laboratoires sur LabEx pour améliorer vos compétences.