www.google.com을 주소창에 입력했을 때 발생하는 과정을 살펴보겠다.
1. DNS 조회 (Domain Name System Lookup)
사용자가 www.google.com을 입력하면 브라우저는 먼저 이 도메인 이름을 IP 주소로 변환해야 합니다. 이 과정을 DNS 조회라고 부릅니다.
과정 요약
DNS 조회는 점진적으로 이루어진다. 브라우저는 먼저 가장 가까운 곳에서 DNS 정보를 찾기 시작하며, 찾지 못하면 점점 외부로 요청을 보내 확인한다.
- 브라우저 캐시 확인
- 브라우저는 최근에 요청한 도메인과 IP 정보를 일정 시간 캐싱합니다.
- 이 정보가 있으면 바로 사용하고, 없으면 다음 단계로 넘어갑니다.
- 운영체제(OS)의 DNS 캐시 확인
- OS도 내부적으로 DNS 정보를 일정 기간 보관합니다.
- 브라우저에 없더라도 OS 수준에서 캐시된 IP가 있을 수 있습니다.
- 예: macOS는 dscacheutil -cachedump 명령어로 확인 가능
- 라우터의 DNS 캐시 확인
- 가정이나 사무실의 공유기(라우터)도 DNS 캐시를 유지할 수 있습니다.
- 이 단계에서 IP를 찾을 수 있다면 외부 네트워크로 나갈 필요가 없습니다.
- ISP(인터넷 제공자)의 DNS 서버 요청
- ISP는 자체 DNS 서버를 운영하며, 일반적으로 우리가 처음 접속하는 외부 DNS입니다.
- ISP DNS도 캐시를 유지하고 있어 자주 요청되는 도메인은 빠르게 응답할 수 있습니다.
- 권한 있는 DNS 서버까지 쿼리 (재귀/반복)
- ISP DNS 서버에서도 IP 정보를 찾지 못하면, ISP 서버는 서버의 IP주소를 찾기 위해 DNS query를 날린다.
- 이 과정에서 재귀적으로 루트 네임서버부터 실제 도메인을 관리하는 네임서버까지 필요한 IP 주소를 찾거나 찾을 수 없다는 오류 응답을 반환할 때까지 재귀적으로 진행된다.
이 과정을 통해 www.google.com에 해당하는 IP 주소를 얻습니다.
2. TCP 연결 수립 (3-Way Handshake)
IP 주소가 확인되면, 브라우저는 해당 서버와 TCP 연결을 수립합니다. TCP는 데이터를 신뢰성 있게 전송하기 위한 전송 계층 프로토콜입니다.
3-Way Handshake
-
클라이언트가 SYN 패킷 전송
브라우저가 서버와의 연결을 시작하고자 한다는 것을 알리는 신호.
-
서버가 SYN-ACK 패킷 응답
서버가 SYN 패킷을 받으면, 클라이언트에게 연결 요청을 수락한다는 의미의 SYN-ACK 패킷을 전송
-
클라이언트가 ACK 전송
클라이언트는 서버에게 ACK 패킷을 보내 연결을 확정
이 과정을 통해 양측은 연결을 설정하고 데이터를 교환할 준비를 마칩니다.
만약 HTTPS라면 다음 단계에 SSL/TLS 핸드셰이크도 함께 수행됩니다.
3. SSL/TLS 핸드셰이크 (HTTPS의 경우)
HTTPS는 HTTP 위에 TLS(Transport Layer Security) 암호화를 적용한 프로토콜입니다. 보안성을 위해 TLS 핸드셰이크를 통해 암호화 연결을 설정합니다.
주요 작업
- 서버는 SSL 인증서를 클라이언트에 전송
- 클라이언트는 인증서를 검증하고, 세션 키를 협상
- 이후 모든 HTTP 통신은 암호화된 채널에서 수행
4. HTTP 요청 전송
TCP 연결이 수립되면 브라우저는 HTTP/HTTPS 요청을 전송합니다.
예시
GET / HTTP/1.1
Host: www.google.com
User-Agent: Chrome/xx.x
이 요청은 웹 페이지를 요청하는 메시지이며, 필요한 쿠키, 캐시 제어, 인증 정보 등이 함께 전송될 수 있습니다.
5. 서버의 응답
웹 서버는 요청을 처리한 후 HTML, CSS, JavaScript, 이미지 등의 리소스를 HTTP 응답으로 브라우저에 전달합니다.
응답 예시
HTTP/1.1 200 OK
Content-Type: text/html
Content-Length: 1024
이후 브라우저는 이 HTML 문서를 해석하고 추가 리소스를 요청합니다 (예: JS, CSS, 폰트).
6. 브라우저 렌더링 파이프라인
서버에서 받은 HTML과 리소스를 바탕으로 브라우저는 다음과 같은 과정을 거쳐 화면에 웹 페이지를 렌더링합니다.
렌더링 단계
- HTML 파싱 → DOM(Document Object Model) 생성
- CSS 파싱 → CSSOM(CSS Object Model) 생성
- DOM + CSSOM → Render Tree 구성
- Layout 단계에서 각 요소의 위치 계산
- Paint 단계에서 픽셀로 변환
- Composite 단계에서 GPU 레이어 조합 및 화면 출력
이 과정을 통해 사용자는 www.google.com 웹사이트를 시각적으로 확인할 수 있게 됩니다.
요약 정리
| 단계 | 설명 |
|---|---|
| 1. DNS 조회 | 도메인을 IP로 변환 |
| 2. TCP 연결 | 3-Way Handshake 수행 |
| 3. TLS 핸드셰이크 | 암호화 연결 수립 (HTTPS일 경우) |
| 4. HTTP 요청 | 웹 페이지 리소스를 요청 |
| 5. 서버 응답 | HTML, CSS, JS 등 리소스 반환 |
| 6. 렌더링 파이프라인 | 사용자 화면에 페이지 출력 |
참고 자료
https://yong-nyong.tistory.com/82
https://velog.io/@khy226/브라우저에-url을-입력하면-어떤일이-벌어질까
https://velog.io/@tnehd1998/주소창에-www.google.com을-입력했을-때-일어나는-과정
