2025-02-09T19:02:05

doc/http/02_url.md

@@ -0,0 +1,182 @@
+# URL (Uniform Resource Locator, 통합 자원 식별자)
+
+URL은 웹에서 **특정 자원의 위치를 식별**하고 접근할 수 있도록 하는 주소 체계입니다.  
+우리가 브라우저 주소창에 입력하는 **웹사이트 주소**가 바로 URL입니다.  
+
+예를 들어,  
+```
+https://www.example.com:8080/path/to/page?query=hello#section
+```
+이 URL을 분석하면, 각 요소가 특정한 의미를 가집니다.
+
+
+## URL의 구성 요소
+
+URL은 다음과 같은 주요 구성 요소로 이루어집니다.  
+
+```
+<프로토콜>://<호스트>:<포트>/<경로>?<쿼리>#<프래그먼트>
+```
+
+| 구성 요소 | 설명 | 예시 |
+|-----------|--------|-------------------------|
+| **프로토콜 (Scheme)** | 통신 방식 지정 | `http`, `https`, `ftp`, `file` |
+| **호스트 (Host, 도메인 또는 IP)** | 서버 주소 | `www.example.com`, `192.168.1.1` |
+| **포트 (Port, 선택사항)** | 서버 접속을 위한 포트 번호 | `80`, `443`, `21` |
+| **경로 (Path)** | 서버 내 특정 리소스 위치 | `/products/item1` |
+| **쿼리 스트링 (Query String)** | 추가 정보 전달 (Key-Value) | `?search=apple&page=2` |
+| **프래그먼트 (Fragment, 해시)** | 문서 내 특정 위치 지정 | `#section1` |
+
+
+### 프로토콜 (Scheme)
+URL의 맨 앞 부분으로, **자원에 접근하는 방법(통신 방식)을 정의**합니다.
+
+| 프로토콜 | 설명 |
+|----------|----------------------------------|
+| `http://` | 일반 웹사이트 접속 (보안 X) |
+| `https://` | 보안 웹사이트 접속 (SSL/TLS 사용) |
+| `ftp://` | 파일 전송 프로토콜 |
+| `file://` | 로컬 파일 시스템 접근 |
+| `mailto:` | 이메일 전송 |
+| `tel:` | 전화 걸기 |
+
+> **보안이 중요한 경우 HTTPS 사용이 필수** (HTTP는 데이터가 암호화되지 않음).  
+
+
+### 호스트 (Host)
+서버의 주소를 나타내며, **도메인 이름 또는 IP 주소**를 사용할 수 있습니다.  
+
+도메인 예시:
+```
+https://www.google.com
+```
+- `www.google.com`은 호스트(도메인)입니다.  
+
+IP 주소 예시:
+```
+http://192.168.1.1
+```
+- `192.168.1.1`은 호스트(IP 주소)입니다.  
+
+
+
+### 포트 (Port, 선택 사항)
+서버에서 특정 서비스가 실행되는 네트워크 포트를 지정합니다.  
+포트를 생략하면 기본값이 사용됩니다.
+
+| 프로토콜 | 기본 포트 |
+|----------|----------|
+| HTTP | `80` |
+| HTTPS | `443` |
+| FTP | `21` |
+
+포트 지정 예시:
+```
+http://example.com:8080
+```
+➡️ `8080` 포트에서 실행 중인 웹 애플리케이션에 접근  
+
+> 일반적으로 80(HTTP)과 443(HTTPS)은 생략 가능
+
+
+
+### 경로 (Path)
+서버 내 특정 리소스의 위치를 나타냅니다.
+
+예시
+```
+https://example.com/products/item1
+```
+* `products/item1`은 서버 내 특정 파일이나 페이지의 경로를 의미  
+
+> 웹사이트에서는 `/about` 같은 경로가 **파일 경로일 수도 있고, 동적 라우팅일 수도 있음**.  
+
+
+### 쿼리 스트링 (Query String)
+`?key=value&key2=value2` 형식으로, **추가적인 데이터를 서버에 전달**하는 데 사용됩니다.
+
+예시
+```
+https://example.com/search?query=phone&page=2
+```
+* `query=phone` → 검색어 "phone"  
+* `page=2` → 2페이지 요청  
+
+> 쿼리 스트링은 `&`로 여러 개의 값을 연결 가능
+
+> RESTful API에서는 쿼리 스트링 대신 URL 경로를 활용하는 경우가 많음
+> ```
+> https://api.example.com/users/123
+> ```
+> * `123`은 특정 사용자의 ID  
+
+
+
+### 프래그먼트 (Fragment, 해시)
+`#` 이후의 값으로, **웹페이지 내 특정 위치를 지정**합니다.  
+서버에는 전달되지 않으며, 브라우저에서만 사용됩니다.
+
+예시:
+```
+https://example.com/docs#section3
+```
+* `#section3`은 문서 내 특정 섹션으로 이동  
+
+> 단일 페이지 애플리케이션(SPA)에서 해시 라우팅에 사용될 수 있음.  
+> 예: `https://myapp.com/#/dashboard`
+
+
+## URL의 동작 과정
+URL을 입력하면 다음 과정이 이루어집니다.
+
+1️. **DNS 조회** : 도메인(`www.google.com`)을 IP 주소(`142.250.190.46`)로 변환  
+2️. **TCP/UDP 연결** : 클라이언트와 서버가 연결됨 (HTTPS의 경우 SSL/TLS 핸드셰이크 포함)  
+3️. **HTTP 요청 전송** : 브라우저가 서버에 HTTP 요청을 보냄 (`GET /index.html HTTP/1.1`)  
+4️. **서버 응답** : 서버가 HTML, JSON 등의 데이터를 반환  
+5️. **브라우저 렌더링** : HTML, CSS, JavaScript를 해석하여 화면에 표시  
+
+
+## URL과 URI의 차이
+| 구분 | URL (Uniform Resource Locator) | URI (Uniform Resource Identifier) |
+|------|-------------------------------|-------------------------------|
+| 의미 | 리소스의 "위치"를 나타냄 | 리소스를 "식별"하는 모든 방식 포함 |
+| 예시 | `https://example.com/page.html` | `mailto:user@example.com`, `isbn:978-3-16-148410-0` |
+| 포함 관계 | URI의 한 종류 | URI의 더 넓은 개념 |
+
+* 즉, 모든 URL은 URI이지만, 모든 URI가 URL은 아님.  
+
+
+## URL 인코딩 (Percent Encoding)
+URL에는 **특수 문자(공백, &, ?, = 등)를 포함할 수 없음**.  
+따라서, 특정 문자를 **URL 인코딩(Percent Encoding)** 해야 합니다.
+
+예시:
+| 문자 | URL 인코딩 |
+|------|-----------|
+| 공백 (` `) | `%20` |
+| `&` | `%26` |
+| `?` | `%3F` |
+| `=` | `%3D` |
+
+인코딩 예제:
+```
+https://example.com/search?query=hello world
+```
+* URL 인코딩 후:  
+```
+https://example.com/search?query=hello%20world
+```
+
+> 브라우저와 서버는 자동으로 URL 디코딩(복원)함.  
+
+
+## URL 단축 서비스
+긴 URL을 짧게 줄여주는 서비스도 많이 사용됩니다.  
+예시:
+```
+https://bit.ly/3A4Bx5C
+```
+* 원래 긴 URL을 짧게 변환하여 사용  
+
+> Google의 `goo.gl`, Bitly, TinyURL 같은 서비스가 존재
+