(항상 잘못된 정보가 포함되어 있을수 있습니다)
(잘못된 정보가 있다면 댓글로 피드백 부탁드리겠습니다)
지금까지 작성한 네트워킹에 관련된 CS들을 총 망라하여 복습하기 좋은 문제에 대한 해답을 작성해보려고 한다.

웹사이트란 HTML, CSS, Javascript 및 이미지와 같은 파일들의 모음이다.
이런 웹사이트들은 브라우저에 이미지나 데이터 등을 표시하는 방법들을 지정한다.
이러한 방법들은 인터넷에 연결된 외부 컴퓨터 즉 우리가 흔히 말하는 "서버" 라는곳에 저장한다.
그리고 브라우저는 이러한 서버에서 웹사이트를 보여주는데 필요한 정보들을 가져와서 웹사이트를 보여준다.
브라우저가 서버와 상호작용해서 웹사이트를 보여주는 과정을 한번 살펴보자.

검색 시작

사용자가 브라우저를 열고 검색창에 www.naver.com을 입력하고.
엔터를 누른다.

URL 해석

검색을 시작하게 되면 해당 URL이 유효한 URL인지 확인한다.

URI?
자원을 식별하는 문자열
URL?
자원을 식별하고 자원의 위치를 파악하는 문자열

URL의 기본구조

URL은 일반적으로 다음과 같은 구조를 가진다.

scheme://Domain:port/path?query#fragment

• Scheme: 자원에 접근하기 위해 사용되는 프로토콜(예: http, https, ftp 등).
  만약 통신 프로토콜이 명시되지 않았다면 기본적으로 http로 입력되고 보통 HSTS 매커니즘을 통해 https로 최종 입력된다.
• Domain: 인터넷 상의 도메인 주소 또는 IP 주소.
• Port: 서버에 접근하기 위해 사용하는 포트 번호(대부분의 경우 생략되며, http는 80, https는 443이 기본값).

  Port?
  네트워크를 통해 서로 통신하는 프로그램들 사이의 연결점
  컴퓨터는 보통 여러 개의 프로그램이 동시에 실행되고 있어서,
  이 여러개의 프로그램 중 어느 프로그램이 내가 접속하려는 프로그램인지 컴퓨터에게 알려 주어야 한다.
  포트번호는 어떤 프로그램에 접속 할 것인지 컴퓨터에게 알려주는것이다.

• Path: 자원을 찾기위한 경로.
• Query: 자원을 찾는데 추가적으로 전달되는 정보를 포함한 key-value 쌍 ?로 시작함

  Query?
  일반적으로 데이터베이스에서 정보를 검색하기 위한 요청 또는 질의를 의미

• Fragment: 문서 내의 특정 부분을 가리키기 위한 앵커. 특정 섹션 또는 위치를 가리키는 데 사용

www.naver.com을 한번 해석해보자

• Scheme이 명시되지 않았다. HSTS 매커니즘을 통해 https로 입력된다.
• Domain은 www.naver.com 이다.
• Port는 https이기때문에 443이 기본값으로 사용된다.
• Path, Query, Fragment는 본 예시에는 없으니 생략한다.

만약 이런 형식의 유효한 URL 형식이 아니라면 브라우저의 검색엔진을 통해 검색을 시도한다.
www.naver.com은 유효한 URL 형식이기때문에 다음 과정으로 넘어가게 된다.

DNS 정보 조회

이제 해당 Host로 연결할수 있는 서버의 IP주소를 찾기위해 DNS 정보 조회를 시도한다.

IP 주소?
IP 주소는 컴퓨터간 통신을 하기 위해 각 컴퓨터에 부여된 네트워크 상의 주소를 말한다.

DNS?
인터넷 상에서 도메인 Name을 IP주소로 변환하는 시스템을 말한다.
사람이 기억하기 쉬운 www.naver.com 과 같은 도메인 Name을 컴퓨터나 네트워크장비가 이해할 수 있는 IP주소인 125.209.222.141로 매핑하는 역할을 한다.

브라우저는 어떤 웹사이트에 접근한적이 있다면 그 웹사이트의 DNS조회 결과를 캐싱해둔다.
이는 이전에 방문한 도메인에 대한 IP주소를 저장하여 반복적인 DNS 조회를 방지하고 응답속도를 향상 시킨다.

캐시?
컴퓨팅에서 데이터나 값을 미리 복사해놓는 임시 저장소를 말한다.
데이터 접근시간을 단축해서 성능을 향상시키는 목적을 가지고 사용한다.

www.naver.com을 검색했을때 이전에 들어간적이 있던 웹사이트라면 다음과 같은 과정을 거친다.

브라우저 캐시를 확인한다.

브라우저는 가장 먼저 브라우저 캐시를 확인한다. 브라우저는 이전에 방문한 웹사이트에 대해 일정기간 동안의 DNS 정보들을 저장해놓는다.
만약 여기에 저장된 정보가 없다면 다음으로 넘어간다

OS 캐시 조회

브라우저 캐시에 해당 DNS 기록이 없는 경우, 브라우저는 운영 체제의 DNS 캐시를 확인한다.
대부분의 운영 체제는 시스템 수준에서 DNS 조회 결과를 캐시하여, 여러 애플리케이션이 이를 재사용할 수 있도록 한다.
여기에도 저장된 정보가 없다면 다음으로 넘어간다

라우터 캐시 조회

OS 캐시에 해당 DNS 기록이 없는 경우, 라우터 캐시를 확인한다.
물론 모든 라우터가 DNS 캐시를 유지하고 관리하는것은 아니기때문에 이는 환경에 따라 차이가 있을수도 있다.

라우터?
OSI 7계층중에서 3계층에 속하는 장치이며 데이터 패킷을 전송하는 장치를 말한다.
네트워크를 연결한뒤 출발지에서 목적지까지 데이터패킷을 최적의 경로로 이동시켜주는 역할도 한다.

ISP DNS 서버 캐시 조회

만약 이렇게 3개의 단계에서 캐싱된 DNS정보가 없으면
ISP DNS 서버에 조회를 요청한다.

ISP?
인터넷 서비스를 제공해주는 업체를 말한다.
우리나라에선 흔히 KT LG SKT 등이 있을것이다.
이러한 인터넷 서비스 제공 업체들은 막대한 양의 DNS 정보를 캐시하고 있는 DNS 서버를 가지고 있다.

Name서버 조회

이런 캐시에서 조회가 안된다면 재귀적 질의를 통해 IP주소를 찾는다

재귀적 질의는 올바른 IP 주소를 찾을 때까지 인터넷에서 여러 DNS 서버를 검색하는 것이다.
필요한 IP 주소를 찾거나, 찾을 수 없다는 오류 응답을 반환할 때까지 한 DNS 서버에서 다른 DNS 서버로 검색이 반복적으로 계속되기 때문에 이 유형의 검색을 재귀적 질의(Recursive Query)라고 한다.

Root Name 서버 조회

Root Name 서버를 조회한다. Root Name 서버는 DNS 최상위에 위치해 있으며
도메인 Name 별로(예: .com, .org, .net 등의 도메인을 관리하는 서버) TLD의 주소를 제공해준다.

TLD(Top-Level Domain) Name 서버 조회

Root Name 서버로부터 받은 주소를 바탕으로, 해당 도메인의 TLD Name 서버가 조회된다.
TLD 서버는 해당 최상위 도메인 아래에 등록된 도메인 이름의 권한 있는 Name server 주소를 알려준다.

권한 있는 Name 서버 조회

TLD 서버로부터 받은 주소를 바탕으로 실제 도메인 Name에 대한 정보를 가지고 있는 권한있는 Name 서버가 조회된다.
이 서버는 도메인 Name에 대응하는 IP주소를 포함한 DNS 정보를 제공한다.
이런 DNS정보를 알아냈다면 브라우저나 OS는 DNS 정보를 일정기간동안 캐시에 저장해둔다.

ARP (주소 결정 프로토콜)

ARP(Address Resolution Protocol)는 네트워크상에서 IP주소를 실제 데이터를 전달할 컴퓨터의 물리적인 MAC 주소로 변환하는 프로토콜을 말한다.

MAC 주소?
네트워크에 연결된 컴퓨터에 할당된 고유 식별자를 말한다.
하드웨어 중 네트워크 인터페이스 카드(NIC)에 고정되어 있으며, 물리적 주소 또는 하드웨어 주소로도 불린다.
네트워크 내에서 각 장치를 고유하게 식별하는 데 사용된다.
IP주소만 필요한거 아니야? 라고 할수도 있지만
IP주소는 아주 자주 바뀔 가능성이있지만 MAC 주소는 웬만하면 변경되지 않는다.

ARP 요청

브라우저가 서버와 통신하려고할때 브라우저는 먼저 자신의 컴퓨터의 ARP 캐시를 확인하여 서버의 IP주소와 대응하는 MAC주소를 찾아본다.
만약 캐시에 해당 정보가 없다면 ARP 요청패킷을 생성한다.

ARP 요청 패킷

ARP 요청 패킷에는 브라우저 컴퓨터의 IP주소와 MAC주소 서버의 IP 주소 3가지가 포함된다.

브로드캐스트

ARP 요청 패킷을 네트워크상의 모든 장치에게 브로드캐스트 한다.

브로드캐스트?
자신의 호스트가 속해 있는 네트워크 전체를 대상으로 패킷을 전송하는 일대다 통신방식을 말한다.

이는 네트워크 상의 모든 장치가 ARP 요청 패킷을 수신하게 함으로써, 해당 IP 주소를 가진 목적지 호스트만이 응답할 수 있도록 하는것이다.

ARP 응답 패킷

요청된 IP를 가진 호스트만 응답을하여 자신의 MAC주소를 포함한 ARP 응답 패킷을 생성해서 응답한다.

ARP 응답패킷에는 자신의 MAC주소 IP주소 그리고 요청패킷을보낸 호스트의 IP주소 MAC주소가 포함된다.

ARP 테이블 업데이트

ARP응답을 받으면 자신의 ARP 캐시를 업데이트해서 IP와 매칭되는 MAC 주소를 일정시간동안 저장한다.
이후 똑같은 과정에서는 ARP요청없이 캐시에서 바로 MAC주소를 통해 데이터를 전달할 수 있다.

TCP 연결

그후에는 TCP라는 OSI 계층 4계층에서 사용하는 전송제어 프로토콜을 사용하여 라우터 장비를 통해 이동되어 IP주소에 해당하는 웹서버와 연결을 시도한다.
이 연결은 브라우저와 서버가 3 way handshake 라는 3단계 연결 과정을 통해서 이루어진다.

3 way handShake?
신뢰성있는 전송을 위한 프로세스
1. 브라우저가 SYN 패킷을 보내 접속을 요청
2. 연결을 수락, SYN, ACK를 보냄
3. 브라우저도 ACK를 보내고 통신시작

HTTPS TLS handshake

이렇게 TCP 연결이 완료되고 나면 HTTPS 프로토콜을 통해서 데이터 요청을 한다.
그전에 TLS handshake라는 데이터 암호화 과정을 수행한다.
이는 암호화를 할 상호 대상을 확인하는 과정이다.

TLS handshake에서는 비대칭키 방식으로 세션키를 안전하게 공유하고
인증서를 통해 증명된 서버인지 검증한다.
그리고 이후에 데이터를 주고받는 과정에 이 세션키로 암화를해서 사용하게 된다.

HTTP 요청

TLS handshake를 마치고 나면 보안적으로 안전하게 데이터를 주고 받을수 있게된다.
이제 브라우저가 서버로 HTTP 요청을 보낸다. 이 요청 데이터는 암호화되어 보내진다.
이 요청은 HTTP 프로토콜 통신규칙을 따라야 한다.
HTTP 요청에는 요청라인, 헤더, 본문이 포함된다.

요청라인

요청라인에는 다음과 같은것들이 포함된다.

GET, POST, PUT PATCH 등등 http 메서드

www.naver.com의 경우에는 GET메서드를 요청한다.

요청된 리소스를 가리키는 경로

통신할 HTTP 버전

실제 www.naver.com으로의 요청 라인 내용은 다음과 같다.

헤더

헤더는 응답의 방식에 도움이되는 추가정보와 어떤 유형의 클라이언트인지 등의 부가적인 정보를 담고있다.

실제 www.naver.com의 요청헤더 내용은 다음과 같다.

본문

요청의 마지막 부분은 본문이다.
보통 GET 요청의 경우는 비어있다.
POST나 PUT과 같은 리소스를 조작하는 경우에 그에 대한 데이터가 포함되어있다.

HTTP 응답

서버는 요청을 받고 요청라인, 헤더, 본문의 정보를 기반으로 요청 처리 방법을 결정한다.
https://www.naver.com/ 경로의 컨텐츠를 가져오고 응답을 생성하여 클라이언트로 다시 전송한다.

이러한 응답에는 응답상태코드(StatusCode), 응답을 처리할 방법, 페이지를 렌더링할 리소스 (HTML, CSS, JavaScript, 이미지와 같은 것들) 등을 함께 포함하여 응답하게된다.

실제 응답헤더의 내용은 다음과 같다.

페이지 렌더링

브라우저가 서버로부터 응답을 받으면 응답헤더를 통해 리소스를 페이지에 렌더링할 방법에 대한 정보를 확인한다.
www.naver.com 의 경우에는 HTML 리소스를 응답했음을 알 수 있다.
물론 꼭 HTML 뿐만아니라 다른 Javascript, CSS, 이미지 리소스등을 응답 할 수도 있다.
브라우저는 이러한 리소스를 기반으로 페이지를 렌더링하라고 지시한다.
이런 브라우저의 렌더링 과정을 웹 프론트엔드 개발자의 역할이다.