본 게시물은 모든 개발자를 위한 HTTP 웹 기본 지식 강의를 보고 작성하였습니다.
URI? URL? URN?
URI, URL, URN은 인터넷에서 리소스를 식별하는 방식입니다. 이 세 가지 개념은 서로 관련이 있지만, 역할과 범위가 다르다는 차이가 있습니다.
1. URI (Uniforn Resource Identifier)
URI는 웹에서 특정 리소스를 "식별"하는 모든 문자열을 의미합니다. 인터넷 상의 모든 자원을 지칭할 수 있는 주소 체계라고 보면 됩니다. URL과 URN은 모두 URI의 한 종류로 포함 관계에 있습니다.
<URI의 예시>
- https://www.example.com/index.html (URL)
- urn:isbn:0451450234 (URN)
2. URL (Uniform Resource Locator)
URL은 특정 리소스의 "위치"를 나타내는 URI의 한 종류입니다. 리소스를 어디서 찾을 수 있는지를 알려주는 역할을 합니다.
<URL의 예시>
- https://www.google.com/search?q=hello
- ftp://ftp.example.com/file.txt
3. URN (Uniform Resource Name)
URN은 리소스를 위치 없이, 고유한 이름으로 식별하는 URI의 한 종류입니다. 특정 리소스를 유일하게 식별하지만, 그 위치를 포함하진 않습니다.
<URN의 예시>
- urn:isbn:045145023 (책의 ISBN 번호)
- urn:uuid:123e4567-e89b-12d3-a456-2347134000 (UUID)
관계 정리
URI (리소스를 식별하는 모든 것)
├── URL (위치를 포함한 URI)
├── URN (이름만 포함한 URI)
URN 이름만으로 실제 리소스를 찾을 수 있는 방법이 보편화 되지 않았습니다. 따라서 사실상 URI와 URL만 알면 되기 때문에 실무에서는 대부분 포함 관계인 URI과 URL을 같은 의미로 사용합니다.
URL 전체 문법
scheme://[userinfo@]host[:port][/path][?query][#fragment]https://www.google.com:433/search?q=hello&hl=ko- 프로토콜 (https)
- 호스트명 (www.google.com)
- 포트 번호 (433)
- 패스 (/search)
- 쿼리 파라미터 (q=hello&hl=ko)
1. URL - scheme
scheme://[userinfo@]host[:port][/path][?query][#fragment]
https://www.google.com:433/search?q=hello&hl=ko
- 주로 프로토콜 사용
- 프로토콜: 어떤 방식으로 자원에 접근할 것인가 하는 약속 규칙
- http는 80포트, https는 443포트를 주로 사용, 포트는 생략 가능
- https는 http에 보안 추가된 것 (HTTP Secure)
2. URL - userinfo
scheme://[userinfo@]host[:port][/path][?query][#fragment]
https://www.google.com:433/search?q=hello&hl=ko
- URL에 사용자 정보를 포함해서 인증
- 거의 사용하지 않음
3. URL - host
scheme://[userinfo@]host[:port][/path][?query][#fragment]
https://www.google.com:433/search?q=hello&hl=ko
- 호스트명
- 도메인명 또는 IP 주소를 직접 사용 가능
4. URL - PORT
scheme://[userinfo@]host[:port][/path][?query][#fragment]
https://www.google.com:433/search?q=hello&hl=ko
- 접속 포트
- 일반적으로 생략, 생략 시 http는 80, https는 443
5. URL - path
scheme://[userinfo@]host[:port][/path][?query][#fragment]
https://www.google.com:433/search?q=hello&hl=ko
- 리소스 경로(path), 계층적 구조
- /members/100, /items/iphone12
6. URL - query
scheme://[userinfo@]host[:port][/path][?query][#fragment]
https://www.google.com:433/search?q=hello&hl=ko
- key=value 형태
- ?로 시작, &로 추가 가능 (?keyA=valueA&keyB=valueB)
- query parameter, query string 등으로 불림, 웹 서버에 제공하는 파라미터, 문자 형태
7. URL - fragment
scheme://[userinfo@]host[:port][/path][?query][#fragment]
- html 내부 북마크 등에 사용
- 서버에 전송하는 정보 아님
웹 브라우저 요청 흐름
1. 사용자 입력
사용자가 브라우저의 주소창에 URL을 입력하거나 링크를 클릭합니다.
- 브라우저에 https://www.google.com:433/search?q=hello&hl=ko를 입력한 상태입니다.
2. URL 파싱 및 분석
웹 브라우저는 URL을 파싱(분석)하여, 다음과 같은 요소들을 추출합니다.
- Scheme : https:// (HTTP 프로토콜의 보안 버전)
- Host : www.google.com (구글 서버의 도메인)
- Port : 433 (HTTPS의 기본 포트)
- Path : /search (구글 검색 페이지)
- Query : q=hello&hl=ko (검색어 hello와 언어 설정 ko)
3. DNS 조회 (도메인 -> IP 주소 변환)
웹 브라우저는 DNS 서버에 요청을 보내 도메인 이름을 IP 주소로 변환합니다.
- www.google.com -> 216.58.213.110 (구글 서버의 IP 주소)
4. HTTP 요청 전송
웹 브라우저는 HTTP 요청 메시지를 생성하여 서버에 전송합니다.
GET /search?q=hello&hl=ko HTTP/1.1
Host: www.google.com
SOCKET 라이브러리를 통해 TCP/IP를 연결하고 데이터를 전달합니다.
TCP/IP 패킷을 생성하고, HTTP 메시지를 포함하여 인터넷 망으로 던져서 구글 서버에 요청 패킷이 도착하도록 합니다.
5. HTTP 응답 전송
구글 서버에 요청 패킷이 도착하면, TCP/IP 패킷을 벗겨서 버리고, HTTP 메시지만 끄집어냅니다.
서버는 HTTP 응답 메시지를 만들어내고, 브라우저로 전송합니다.
HTTP/1.1 200 OK # HTTP버전, 상태 코드 200, OK
Content-Type: text/html; charset=UTF-8 # 밑에 데이터가 텍스트 HTML 형식, 언어는 UTF-8
Content-Length: 3423 # 실제 HTML 길이
<html>
<body>...</body>
</html>
6. 브라우저가 응답 데이터 렌더링
브라우저가 받은 HTML, CSS, JavaScript를 분석하여 화면에 구글 검색 결과를 렌더링합니다.
end
이번 글에서는 웹 브라우저의 요청 흐름에 대해 살펴보았습니다. URL을 입력하고, DNS 조회부터 TCP 연결, HTTP 요청 및 응답, 최종적으로 페이지가 렌더링 되는 과정까지, 웹 브라우저가 어떻게 웹 페이지를 표시하는지에 대한 기본적인 흐름을 이해하는 데 아주 큰 도움이 되었습니다. 다음 글에서는 HTTP에 대해 더욱 더 파헤처보도록 하겠습니다. 가즈아~!
'공부 메모' 카테고리의 다른 글
| [HTTP] HTTP 메서드 총정리: API 설계를 위한 필수 개념 (1) | 2025.04.04 |
|---|---|
| [HTTP] HTTP 기본 개념 정리: 구조, 특징, 메시지 이해하기 (0) | 2025.04.03 |
| [HTTP] 네트워크 필수 개념 정리 (IP/TCP/UDP/PORT/DNS) (1) | 2025.03.28 |
| 유튜브 URL로 댓글 목록 크롤링하기 (0) | 2025.03.18 |
| 정적/동적 크롤링 개념 및 실습 진행해보기 (0) | 2025.03.18 |
