URL 세그먼트 결합

소개

이 랩에서는 JavaScript 를 사용하여 URL 세그먼트를 결합하고 결과 URL 을 정규화하는 방법을 살펴봅니다. 이 랩에서는 다양한 정규 표현식 (regular expression) 을 사용하여 이중 슬래시를 제거하고, 프로토콜에 적절한 슬래시를 추가하며, 매개변수 앞의 슬래시를 제거하고, 매개변수를 '&'로 결합하고, 첫 번째 매개변수 구분 기호를 정규화하는 과정을 안내합니다. 이 랩을 마치면 JavaScript 를 사용하여 URL 세그먼트를 효율적으로 결합하고 정규화할 수 있게 됩니다.

URL 세그먼트 결합 및 정규화

주어진 URL 세그먼트를 함께 결합하고 결과 URL 을 정규화하려면 다음 단계를 따르세요.

1. Array.prototype.join()을 사용하여 URL 세그먼트를 결합합니다.
2. 일련의 String.prototype.replace() 호출과 다양한 정규 표현식 (regular expression) 을 사용하여 다음을 통해 결과 URL 을 정규화합니다.
   • 이중 슬래시 제거
   • 프로토콜에 적절한 슬래시 추가
   • 매개변수 앞의 슬래시 제거
   • 매개변수를 '&'로 결합하고 첫 번째 매개변수 구분 기호를 정규화

URL 세그먼트를 결합하고 정규화하려면 아래 코드 스니펫을 사용하세요.

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

사용 예시:

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

요약

축하합니다! URL 세그먼트 결합 랩을 완료했습니다. LabEx 에서 더 많은 랩을 연습하여 기술을 향상시킬 수 있습니다.