Juntar Segmentos de URL: Um Tutorial em JavaScript

Introdução

Neste laboratório, exploraremos como juntar segmentos de URL e normalizar a URL resultante usando JavaScript. O laboratório irá guiá-lo através do processo de utilização de várias expressões regulares para remover barras duplas, adicionar barras adequadas para o protocolo, remover barras antes dos parâmetros, combinar parâmetros com '&' e normalizar o delimitador do primeiro parâmetro. Ao final deste laboratório, você será capaz de juntar e normalizar eficientemente segmentos de URL usando JavaScript.

Junção e Normalização de Segmentos de URL

Para juntar os segmentos de URL fornecidos e normalizar a URL resultante, siga os passos abaixo:

Use Array.prototype.join() para combinar os segmentos de URL.
Use uma série de chamadas String.prototype.replace() com várias expressões regulares para normalizar a URL resultante, fazendo o seguinte:
- Removendo barras duplas
- Adicionando barras adequadas para o protocolo
- Removendo barras antes dos parâmetros
- Combinando parâmetros com '&' e normalizando o delimitador do primeiro parâmetro.

Use o trecho de código abaixo para juntar e normalizar segmentos de URL:

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

Exemplo de uso:

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

Resumo

Parabéns! Você concluiu o laboratório de Junção de Segmentos de URL. Você pode praticar mais laboratórios no LabEx para aprimorar suas habilidades.