[Network] 웹페이지가 사용자에게 보여지는 과정 (feat. Google)

이전 글에서 네트워크 통신에 대해 공부했었다. 그리고 TCP/IP 프로토콜을 기반으로 인터넷이 통신하는 것까지!

 

아래 사진은 우리가 브라우저(크롬)에서 들어가고 싶은 웹 사이트가 있을 때 검색해서 그 사이트가 눈 앞에 보이기까지의 과정을 간략하게 그림으로 나타낸 것이다. 과정에 대해서, 추가로 관련 용어와 개념까지 자세히 알아보자!

URL 입력

---

브라우저(크롬 ,사파리 등) 주소표시줄에 URL을 입력하고 Enter를 클릭한다. 혹은 링크를 클릭하면 주소창에 입력된다.

 

URL 처리

---

웹 브라우저가 URL을 해석한다.

 

URL의 구조

https://www.example.com:80/path/to/myfile.html
?key1=value1&key2=value2#SomewhereInTheDocument

• https - 프로토콜
• www.example.com - 도메인 이름 (or IP 주소)
• :80 - 포트
• /path/to/myfile.html - 경로
• ?key1=value1&key2=value2 - 파라미터
• #SomewhereInTheDocument - 부분 식별자

자세히

 

내가 입력한 URL이 구조(문법)에 맞다면, URL을 해석한다.

그 후 HSTS(HTTP Strict Transport Security) 목록을 로드해서 확인한다.

* HTTP Strict Transport Security : HTTP 대신 HTTPS 만을 사용하여 통신해야 한다고 웹 사이트가 브라우저에게 알리는 보안 기능

 

URL을 해석하는 이유는 접속을 원하는 웹페이지를 구현하는 파일(html)이 실제로 저장되어 있는 서버에 접근하기 위해서다. 하지만 "www.google.com" 같은 도메인 이름은 사람이 알아듣기 위한 것이고, 실제 컴퓨터가 서버에 접근하기 위해서는 다음의 과정이 필요하다. 

DNS 조회

---

DNS란? (Domain Name Service)

도메인 이름과 IP주소를 변환해주는 역할
인터넷에 연결된 컴퓨터들에 접근하려면 IP 주소가 필요하다. 하지만 숫자(102.24.63.80 등)로 되어있어 인간이 이를 기억하기 쉽지 않다. 이를 해결하기 위해 DNS가 등장했다.

구글을 예로 들어보자면 다음과 같다.
도메인 주소 : www.google.com
IP 주소 : 172.217.175.238

또한 크게 도메인 서버를 나눌 수 있는데 다음과 같다.

Local DNS Server
기본적으로 통신사에서 제공해주는 DNS 서버를 사용 (KT, SK 등)
Root Nameserver
크게 전 세계에 13개의 서버로 구성되어 있다. 도메인을 IP 주소로 변환하는 첫 단계로써, 최상위 도메인(TLD)에 대한 네임서버를 반환한다.
TLD Nameserver
일반 최상위 도메인(com, net, org 등) 과 국가코드 최상위 도메인(kr, uk, fr 등) 을 포함하고 있다.
권한 있는 네임서버(Authoritative Nameserver)를 반환한다.
Authoritative Nameserver
실제로 DNS 리소스 레코드들을 관리하고 있는 서버다. 마지막 단계로써, IP 주소를 반환한다.

 

우리가 원하는 "www.google.com" 실제 IP주소를 알기 위해 다음의 과정을 거친다. 

1. 클라이언트(내 브라우저)에서 해당 도메인이 캐시로 저장되어 있는지 확인
2. 저장되어 있을 시 저장된 IP 주소 리턴, 없을 경우 DNS 시스템을 따른다.
3. 클라이언트에서 IP 설정 시 지정한 DNS 서버(Local)에게 "www.google.com" 에 대해 물어본다.
   (나의 경우 KT 공유기를 사용해서 KT DNS : 168.126.63.1)
4. DNS 서버(Local)에서 해당 국가(구글이 있는)에 지정된 DNS 서버(Root) 에게 묻는다.
5. "com"을 관리하는 DNS 서버(TLD)에게 묻는다.
6. "google.com"을 관리하는 DNS 서버(Authoritative)에게 물는다.
7. DNS서버가 알아낸 "www.google.com"의 IP 주소를 클라이언트에게 알려준다.

위 과정을 거쳐 드디어 구글 서버의 IP주소를 얻을 수 있게 되었다!

 

ARP를 통해 MAC 주소 추적

---

자세한 공부 필요!

TCP 통신

---

TCP 소켓을 열고 3-way handshake로 연결을 설정한다. HTTPS 요청인 경우 TLS(Transport Layer Security) handshake 과정을 통해 세션키를 생성한다.

요청 전송 및 응답

---

클라이언트와 서버는 HTTP or HTTPS 프로토콜을 통해 메시지를 생성하여 주고 받는다.

브라우저 렌더링

---

서버가 메시지를 통해 리소스(HTML, CSS, JS, Image 등)를 클라이언트(브라우저)에 제공한다.

이 후, 클라이언트(브라우저)는 받은 리소스를 사용하여 웹페이지를 렌더링한다.

 

마무리

---

위의 과정들을 요약해보자면

URL 입력 → 브라우저가 URL 해석 → DNS 서버를 통해 도메인 이름을 IP주소로 변경 → HTTP or HTTPS 프로토콜 방식으로 요청 및 응답 → 브라우저가 서버에게서 받은 자료를 바탕으로 렌더링 → 사용!

이라 말할 수 있다.

 

사실 중간 DNS조회 이후부터 간략하게 적은 느낌이 엄청 든다..! 하지만 우선 중요하다 싶은 개념들을 우선 정리하는 시간이라 생각하고, ARP를 통해 MAC 주소를 추적하는 과정은 따로 공부를 해야할 것 같다. 또한 브라우저 렌더링 같은 경우는 무조건 다음 블로깅으로 할 예정이다!