웹 브라우저에 접속했을 때 요청 흐름

1. 사용자가 주소 입력

웹 브라우저를 열고 원하는 웹사이트 주소를 입력하면, 브라우저는 그 주소로 연결하기 위해 준비를 시작한다.

브라우저는 사용자가 입력한 주소(URL)를 분석한다. 여기서 어떤 프로토콜을 사용할지(예: http, https), 어떤 도메인인지(예: example.com), 포트 번호가 명시되어 있는지 등을 파악한다.

이 과정에서 브라우저는 어떤 방식으로 서버와 통신할지 결정한다. 예를 들어 https는 보안 연결이 필요하므로, 이후에 보안 인증서(SSL/TLS)를 확인한다.

또한, 브라우저는 이전에 방문한 페이지나 파일들을 캐시에 저장한다. 그래서 DNS 조회나 HTTP 요청을 보내기 전에, 먼저 캐시에 해당 페이지나 자원이 있는지 확인한다.

만약 캐시에 이미 최신 페이지가 있다면 서버에 연결하지 않고 바로 로드할 수 있다. 반대로, 캐시에 없다면 새롭게 서버에 요청해야 한다.

2. DNS를 통한 IP 주소 찾기

웹사이트 주소는 사람이 읽기 쉬운 형태(예: www.google.com)로 되어 있지만, 컴퓨터는 숫자로 된 IP 주소를 사용한다.

그래서 브라우저는 먼저 DNS(Domain Name System) 서버에 가서 해당 주소에 맞는 IP를 찾는다.

이 과정은 마치 우리가 연락처에서 이름으로 전화번호를 찾는 것과 비슷하다고 볼 수 있다.

브라우저는 DNS 서버에서 IP 주소를 받으면, 그 IP 주소를 통해 어느 서버에 연결해야 할지 알게 된다.

3. 소켓과 TCP/IP 연결 설정

IP 주소를 찾으면, 브라우저는 서버와 통신을 시작하기 위해 TCP 연결을 설정한다. 이 과정에서 Three-Way Handshake라는 절차를 거친다. :

1. 클라이언트(브라우저)가 서버에 "SYN"이라는 요청을 보내 연결 시작을 알린다.
2. 서버가 "SYN-ACK"라는 응답을 보내 연결을 수락한다.
3. 브라우저가 다시 "ACK" 응답을 보내면서 연결이 완료된다.

브라우저는 서버와 연결하기 위해 소켓을 연다. 소켓은 네트워크 연결을 위해 열리는 문이라고 할 수 있다. 이 소켓을 통해 TCP/IP 프로토콜을 사용해 서버와 연결한다.

TCP는 데이터를 안정적으로 전송하기 위해, IP는 목적지에 데이터를 보내기 위해 사용된다.

5. SSL/TLS 연결 설정 (HTTPS일 경우)

웹사이트가 https 프로토콜을 사용하는 경우, 브라우저는 보안을 위해 SSL/TLS 연결을 설정한다. 이 과정에서 서버와 브라우저는 암호화된 통신을 위해 서로의 인증서를 확인하고, 암호화 키를 교환한다.

브라우저는 서버의 인증서를 검사해서 유효한지, 신뢰할 수 있는 기관에 의해 발급되었는지 확인한다.

6. HTTP 요청 보내기

이제 연결이 설정되면 브라우저는 웹서버에게 웹페이지를 요청하기 위해 HTTP라는 프로토콜을 사용한다. 예를 들어, 브라우저는 "GET /index.html HTTP/1.1" 같은 요청을 보낼 수 있다.

이 요청에는 사용자가 요청한 리소스의 경로와 브라우저의 정보(User-Agent 등)가 포함된다.

7. 서버에서 응답 받기

서버는 이 요청을 받고 요청한 웹페이지 내용을 준비한다.

웹페이지는 HTML, CSS, JavaScript 등 여러 파일로 구성돼 있는데, 서버는 이 파일들을 HTTP 응답이라는 형태로 브라우저에게 되돌려준다. 이때 서버는 데이터 패킷으로 나누어서 보내는데, 이게 바로 TCP/IP 패킷이다.

8. 패킷 수신 및 재조합

브라우저는 서버에서 전송된 TCP/IP 패킷을 받으면, 받은 패킷들을 다시 모아서 원래의 웹페이지로 재조합한다.

9. 웹페이지 렌더링

이제 브라우저는 받은 HTML, CSS, JavaScript 파일들을 해석하고, 웹페이지 화면에 표시할 수 있는 형태로 렌더링한다.

렌더링은 코드와 데이터를 사용자에게 보이는 화면으로 변환하는 과정을 말한다.

모든 과정이 끝나면, 사용자는 웹 브라우저 화면에 해당 웹사이트를 볼 수 있게 된다.

이렇게 웹 브라우저는 소켓을 통해 서버와 연결하고, HTTP 프로토콜로 요청을 보내며, TCP/IP 패킷으로 데이터를 주고받으면서 우리가 요청한 웹페이지를 화면에 표시한다.