[HTTP] URI 와 웹 브라우저 요청 흐름

1️⃣ URI (Uniform Resource Identifier)

URI 는 로케이터(Locator), 이름(name) 또는 둘 다 추가로 분류될 수 있습니다. 

URI 는 리소스를 식별한다는 의미입니다. 예를 들어 주민번호와 같이 사람을 식별할 수 있는 것 이라고 생각하면 될 것 같습니다.

URI 에는 크게 URL (리소스의 위치) 과 URN (리소스의 이름) 두 가지로 나눌 수 있습니다.

URI, URL, URN

 

 

 

URL 과 URN

 

위의 그림과 같이 URL은 우리가 흔히 자주 보는 주소를 이야기하고, URN은 이름을 부여하는 것을 말합니다. 하지만 URN 이름만으로 실제 리소스를 찾을 수 있는 방법이 보편화 되어 있지 않으므로 URL 을 더 자주 사용합니다.

 

URI 의 단어 의미는

• Uniform : 리소스를 식별하는 통일된 방식
• Resource : 자원, URI로 식별할 수 있는 모든 것
• Identifier : 다른 항목과 구분하는데 필요한 정보 를 의미합니다. 

---

2️⃣ URL 분석

https://www.google.com:443/search?q=hello&hl=ko

 

위와 같은 URL 이 있다고 하고, URL을 분석해보겠습니다. 

https 는 프로토콜, www.google.com은 호스트명, 443은 포트번호, /search 는 패스(path), q=hello&hl=ko 은 쿼리 파라미터입니다.  

 

즉, URL 은 scheme://[userinfo@]host[:port][/path][?query][#fragment] 이와 같은 순서로 이루어져 있습니다. 

 

✔ URL - Scheme

위의 URL 에서는 (https) 에 해당하며, 주로 프로토콜을 사용합니다. 

프로토콜이란 ? 어떤 방식으로 자원에 접근할 것인가에 대한 약속 규칙을 이야기합니다. 예를 들어 http, https, ftp 등이 있습니다. 위의 프로토콜은 자주 사용하는 것으로 http는 80 포트, https 는 443 포트를 주로 사용하며, 포트번호는 생략이 가능합니다. 

 

✔ URL - Userinfo

userinfo 는 사용자 정보를 포함해서 인증하며, 거의 사용하지 않습니다.

 

✔ URL - Host

위의 URL 에서는 (www.google.com) 에 해당하며, 호스트명을 나타냅니다. 

도메인 명을 사용해도 되고, IP 주소를 직접 사용해서 작성할 수도 있습니다.

 

✔ URL - Port

위의 URL에서는 443에 해당하며, 포트번호를 작성할 수 있습니다. 일반적으로는 생략하며 생략할 경우 http 는 80포트, https 는 443 포트를 사용합니다. https 는 http 에 security (보안) 가 더해진 것을 이야기합니다.

 

✔ URL - Path

위의 URL 에서는 /search 에 해당하며 리소스 경로를 작성합니다. 예를 들어 /members 혹은 /members/100 과 같이 경로를 작성하시면 됩니다. 

 

✔ URL - query

위의 URL 에서는 ?q=hello&hl=ko 에 해당하며 key=value 형태로 이루어져 있습니다.

? 로 시작하며 &로 추가할 수 있습니다. ?keyA=value&keyB=valueB 의 형태로 작성할 수 있습니다. 

쿼리 파라미터 (query parameter), 쿼리 스트링 (query string) 등으로 불리며 웹서버에서 제공하는 파라미터, 문자 형태를 나타냅니다.

✔ URL - Fragment

fragment 는 html 내부 북마크 등에 사용되는 정보이며, 서버에 전송되는 정보는 아닙니다. 

---

3️⃣ 웹 브라우저 요청 흐름

https://www.google.com:443/search?q=hello&hl=ko

 

위와 같은 URL 을 입력했다고 가정했을 때 어떤 흐름으로 웹 브라우저가 요청이 되는지를 알아보겠습니다. 

 

 

 첫 번째로, IP 주소와 포트 번호를 찾아내고 HTTP 요청 메시지를 생성합니다. 

호스트명을 보고 DNS 를 조회하여 IP 주소를 알아내고, 프로토콜이 https 이기 때문에 443번이 됩니다.  

 

 

위와 같은 HTTP 요청 메시지가 생성됩니다. HTTP 요청 메시지에 관해서는 자세히 나중에 포스팅으로 설명드리겠습니다. 간략하게 설명을 하자면 www.google.com 으로 q=hello&hl=ko 라는 정보를 보내겠다는 의미입니다. 

 

 

 

이렇게 HTTP 요청 메시지가 생성이 되면 소켓 라이브러리를 통해서 TCP/IP 계층에 전달합니다. 이 소켓 라이브러리를 통해서 3 way handshake 를 하면서 서버와 연결을 합니다. 그 다음 데이터를 전달하고, TCP/IP 패킷을 한 겹 더 씌운 후 인터넷으로 전달합니다. 

 

 

TCP/IP 패킷에는 출발지 IP 주소와 PORT , 목적지 IP 주소와 PORT 와 전송데이터가 들어있는데요, 전송 데이터 자리에 HTTP 메시지가 들어간 상태로 패킷이 완성됩니다. 

 

이렇게 만들어 진 TCP/IP 패킷을 클라이언트가 서버로 전송하게 되고, 이 패킷을 받은 서버는 다시 HTTP 응답 메시지를 생성하여 클라이언트가 원하는 정보를 담아 클라이언트로 다시 전송합니다. 

 

이렇게 만들어진 응답 패킷이 도착하면, 클라이언트는 웹 브라우저에서 HTML 을 렌더링하여 사용자에게 원하는 화면을 제공하게 됩니다. 

 

🌟 웹 브라우저 요청 흐름 정리 !

 

DNS 조회 -> HTTP 요청 메시지 생성 -> TCP/IP 연결 -> 데이터 전달 -> TCP/IP 패킷 생성 -> 서버로 전달
-> 서버는 HTTP 응답 메시지 생성 -> 클라이언트로 전송 -> 웹 브라우저 HTML 렌더링

---

 

🔍 참고글

인프런 김영한 강사님의  [모든 개발자를 위한 HTTP 웹 기본 지식] 섹션 2.URI 와 웹 브라우저 요청 흐름 강의를 참고하여 작성했습니다.