[Web] Query String

Query String

웹 개발에서 자주 사용되는 개념

✅ 1. Query String이란?

• Query String(쿼리 문자열)*은 브라우저에서 서버로 데이터를 전달하기 위해 URL 끝에 붙는 문자열입니다.

형식은 ?키=값&키=값 형태로 구성됩니다.

https://example.com/search?keyword=java&page=2

• ? ← Query String의 시작
• keyword=java ← 첫 번째 파라미터 (key=value)
• &page=2 ← 두 번째 파라미터 연결 (& 기호 사용)

---

✅ 2. Query String의 특징

특징	설명
위치	URL의 끝, ? 뒤에 위치
구분자	여러 개일 경우 & 로 구분
키-값 쌍	key=value 형태
인코딩 필요	공백, 한글 등은 URL 인코딩 필요 (%20, %EC%A0%95%EB%B3%B4)
GET 방식	주로 GET 요청에서 사용됨 (브라우저 주소창에 직접 보임)

---

✅ 3. Query String 관련 주요 개념

🔹 a. HTTP GET vs POST

구분	GET	POST
전송 위치	URL의 Query String	요청 Body
노출 여부	브라우저에 노출	숨겨짐
데이터 용량	작음 (URL 길이 제한 있음)	큼
사용 예	검색, 필터링	로그인, 회원가입

📌 Query String은 GET 방식에서 주로 사용됩니다.

🔹 b. URL vs URI vs URN

---

용어	설명	예시
URL	리소스 위치 + 접속 방법 포함	https://google.com/search?q=chatgpt
URI	URL + URN 포함하는 상위 개념	URI = URL + URN
URN	이름만으로 식별 (위치 불필요)	urn:isbn:1234567890

💡 URL은 "어디(Where)" + "어떻게(How)" 접근할지를 말함

---

🔹 c. URL 인코딩 (Encoding)

Query String에서 공백, 특수문자 등은 인코딩(encoding) 해야 합니다.

문자	인코딩
공백	%20 또는 +
한글	%ED%95%9C%EA%B8%80
&	%26
=	%3D

예: https://example.com/search?keyword=자바 →

https://example.com/search?keyword=%EC%9E%90%EB%B0%94

---

🔹 d. 서버에서 Query String 읽기

• Java (Servlet): request.getParameter("key")
• Node.js (Express): req.query.key
• PHP: $_GET["key"]
• Python (Flask): request.args.get("key")

---

✅ 4. 실전 예제

🔸 검색 기능에서의 Query String

https://shopping.com/products?category=shoes&sort=price_desc&page=3

Key	Value
category	shoes
sort	price_desc
page	3

→ 서버는 이 값을 기준으로 신발 카테고리에서 가격 내림차순으로 3페이지 데이터를 응답합니다.

---

✅ 5. 관련 도구 및 활용 팁

도구	설명
URL Encoder/Decoder	특수문자 인코딩/디코딩
브라우저 주소창	GET 요청 시 자동 생성됨
URLSearchParams (JS)	Query String 파싱에 유용한 객체

const params = new URLSearchParams(location.search);
console.log(params.get("keyword"));  // 'java'

---

✅ 6. 쿼리 스트링과 RESTful의 관계?

• REST API는 리소스 중심 설계로, 쿼리 스트링은 "옵션/필터링" 용도로 주로 사용합니다.

GET /users?page=1&limit=10&sort=name_asc

→ /users 리소스에 대해, 페이징과 정렬 옵션을 전달

---

📌 요약 정리

항목	설명
Query String	?key=value&key2=value2 형식의 URL 파라미터
GET 방식	데이터가 URL에 포함되어 서버로 전달됨
URL 인코딩	특수문자는 %숫자코드로 변환
서버 처리 방식	언어나 프레임워크에 따라 다름 (request.getParameter, req.query, ...)

---