![](https://blog.imqa.io/content/images/2024/01/240117_URL-----1_01-3.png)
대부분의 웹사이트에서는 추적 분석을 위한 식별 값, 광고, 검색어 등으로 여러 개의 파라미터가 생성됩니다. 이에 1개의 페이지에 여러 개의 URL이 생기는 경우가 많습니다. 웹 프론트엔드 모니터링 솔루션 WPM에서는 사용자가 접속한 URL 데이터를 수집하기 때문에 여러 개의 URL 페이지로 보일 수 있습니다.
이 경우 데이터가 파편화되기 때문에 모니터링이 불편할 수 있습니다. 이때 ‘URL 패턴 설정’을 하시면 더욱 편리하고, 효과적으로 웹페이지의 성능 모니터링이 가능합니다.
예시 웹사이트로 알아보기
![](https://blog.imqa.io/content/images/2024/01/240117_URL-----1_01-1.png)
이해를 돕기 위해 위와 같은 웹사이트 IMQA Mall이 있다고 가정하고, 해당 사이트를 기준으로 URL 패턴을 설정해 보겠습니다. 개발∙운영 중이신 웹사이트 및 URL 구조와 비교하여 설정해 보세요.
웹사이트 구성
먼저, 예시 사이트인 IMQA mall의 사이트 구성과 URL 구조에 대해 확인해 볼까요? IMQA mall은 Main, Product, Event, Cart, Community와 같은 메뉴로 구성되어 있습니다.
![](https://blog.imqa.io/content/images/2024/01/240117_URL-----1_02-2.png)
그리고 Product 메뉴는 Outer, Top, Skirt, Pants, Dress와 같은 카테고리로 이루어져 있습니다.
![](https://blog.imqa.io/content/images/2024/01/240117_URL-----1_03-2.png)
URL 구조
![](https://blog.imqa.io/content/images/2024/01/240117_URL-----1_05-1-2.png)
URL 구조는 웹사이트 구조나 개발 사항에 따라 상이합니다. 그러나 기본적인 URL 구조를 이해하시면, 다른 형태라도 쉽게 URL 패턴을 설정하실 수 있습니다.
* 보통 파라미터는 URL 뒤 물음표(?) 이후로 붙는 값입니다.
URL 패턴 설정
웹사이트와 URL 구조를 파악하셨다면, 이제 URL 패턴을 설정해 보실까요?
1. URL 패턴은 '프로젝트 리스트 > 관리[...] > URL 패턴 설정'에서 설정하실 수 있습니다.
![](https://blog.imqa.io/content/images/2024/01/240117_URL-----1_06.png)
2. 설정하고자 하시는 경로, 쿼리 파라미터 값을 입력해 주세요.
- 경로에는 도메인 값을 제외한 URL과 변수 입력
- 쿼리 파라미터는 '키=값' 형태로 입력
우선순위가 높은 URL 패턴부터 적용되니 드래그하여 원하시는 순서로 변경해 주세요.
![](https://blog.imqa.io/content/images/2024/01/240117_URL-----1_07.png)
* 입력 시, 변수 {group}과 {value}를 활용하실 수 있습니다. {group}은 묶고 싶은 단위에, {value}는 풀고 싶은/개별 값으로 사용할 단위에 사용합니다. 아래 실제 적용 방법을 통해 자세히 설명해 드릴게요!
![](https://blog.imqa.io/content/images/2024/01/240117_URL-----1_08-3.png)
경로, 쿼리 파라미터 설정 방법
“많은 채널에서 광고를 집행하다보니, 페이지마다 파라미터도 다양해져서 페이지 수가 너무 많아져요.”
![](https://blog.imqa.io/content/images/2024/01/240117_URL-----1_09.png)
상품 페이지의 URL은 https://shop.imqa.io/product/outer/12345이지만, 광고와 추적 등으로 인해 URL이 여러개 생성되었는데요. 데이터가 파편화되기 때문에 파라미터 값 구분 없이 하나의 상품 페이지(https://shop.imqa.io/product/outer/12345)로 통합하여 모니터링이 필요합니다. 이 때, 어떻게 설정하는지 함께 확인해 보실까요?
#1. 특정 카테고리 내 모든 상품 페이지에 적용하는 경우
https://shop.imqa.io/product/outer/12345 하위의 파라미터 값을 구분하지 않고 .../12345까지만 볼 수 있도록 설정할 때, 다른 페이지에도 적용이 필요할 수 있습니다.
이때, 예시 사이트에서는 /12345 자리에 다른 상품 페이지 정보가 들어옵니다. 각기 다른 상품 페이지 값이므로 해당 부분은 개별 데이터가 들어와야 하므로 {value}를 사용합니다.
쿼리 파라미터 값은 따로 구분하지 않기 때문에 입력하지 않습니다.
![](https://blog.imqa.io/content/images/2024/01/240117_URL-----1_10-2.png)
위와 같이 상품 페이지 값에만 변수 {value} 를 적용하였기 때문에, outer 카테고리 내 상품 페이지만 파라미터 값 구분 없이 개별 상품 페이지 1개씩 데이터가 보입니다.
![](https://blog.imqa.io/content/images/2024/01/240117_URL-----1_11.jpeg)
#2. Product 메뉴 내 속한 모든 상품 페이지에 적용할 경우
위의 경우와 달리 모든 카테고리 내 상품 페이지에 적용이 필요할 수 있습니다. 예시 사이트 IMQA mall은 Product는 상품 카테고리로 구성되어 있고, 카테고리 내 상품 페이지가 있는데요.
![](https://blog.imqa.io/content/images/2024/01/240117_URL-----1_03-3.png)
카테고리가 많지 않다면 위의 #1 방법으로 개별 등록할 수도 있지만, 카테고리가 많다면 등록이 어렵습니다. 적다고 해도 등록 과정에서 누락되는 경우가 발생할 수도 있구요. 이때, 아래와 같이 간단하게 설정해 보세요.
![](https://blog.imqa.io/content/images/2024/01/240117_URL-----1_12-2.png)
위와 같이 설정하면, Product 뒤 카테고리도 개별 값으로 구분되어 보입니다.
![](https://blog.imqa.io/content/images/2024/01/240117_URL-----1_13.png)
URL 패턴 기본 설정 방법에 대해 안내해 드렸는데요. {group}과 {value} 값을 활용하시면 원하시는 형태로 페이지를 구분하여 확인하실 수 있습니다. 자주 사용하는 URL 패턴 설정 방법은 아래 #2편 포스팅에서 확인해 보세요!
- URL 패턴 설정 - #2. 자주 사용하는 설정
URL 패턴 설정 시 궁금한 사항이 있으시다면 언제든지 문의해 주세요. 필요에 따라 사이트 구성 확인 후 원하시는 내용에 따라 설정 방법을 개별 안내해 드리겠습니다.
![](https://blog.imqa.io/content/images/2024/03/-------_IMQA------------2.png)