1. 도메인 주소 입력
사용자가 브라우저 주소창에 www.example.com 입력
2. DNS 조회 → IP 주소 확인
도메인 이름을 IP 주소로 변환하는 과정은 다음과 같이 진행됩니다:
- 브라우저 캐시 확인
- 운영체제 캐시 확인
- 로컬 DNS 서버 조회
- 루트 DNS 서버 조회
- TLD 서버 조회 (.com, .org 등)
- 권한 있는 네임서버 조회
3. TCP 3-Way Handshake
클라이언트 → 서버: SYN (연결 요청)
서버 → 클라이언트: SYN + ACK (요청 승인 + 연결 요청)
클라이언트 → 서버: ACK (연결 확정)
👉 HTTPS라면 TLS 핸드셰이크가 이어서 진행됨
SSL/TLS Handshake 과정
- Client Hello (지원하는 암호화 방식 전송)
- Server Hello (인증서 및 선택된 암호화 방식 전송)
- 인증서 검증
- 대칭키 생성 및 교환
- 암호화 통신 시작
TCP vs UDP 비교
| 특성 | TCP | UDP |
|---|---|---|
| 연결성 | 연결 지향 | 비연결 지향 |
| 신뢰성 | 보장 | 보장하지 않음 |
| 속도 | 상대적으로 느림 | 빠름 |
| 용도 | 웹, 이메일, 파일전송 | 게임, 스트리밍 |
4. HTTP/HTTPS 요청 전송
브라우저가 요청 메세지(HTTP Method, Header, Body 등) 전송
HTTP vs HTTPS
HTTPS는 HTTP에 SSL/TLS 암호화를 추가한 프로토콜입니다:
HTTP의 문제점:
- 평문 전송: 모든 데이터가 암호화되지 않음
- 도청 가능: 네트워크상에서 누구나 데이터를 볼 수 있음
- 변조 위험: 중간자가 데이터를 수정할 수 있음
- 신원 확인 불가: 서버의 진위를 확인할 수 없음
HTTPS의 장점:
- 암호화: 모든 통신 데이터 암호화
- 무결성: 데이터 변조 감지 가능
- 인증: 서버 신원 확인 가능
- 기밀성: 제3자의 통신 내용 열람 차단
5. 웹서버에서 요청 처리
웹서버 (Web Server)
대표적인 웹서버: Apache, Nginx 등
주요 역할:
- 정적 파일 제공 (HTML, CSS, JS, 이미지)
- 로드 밸런싱, 캐싱, SSL 처리
WAS (Web Application Server)
대표적인 WAS: Tomcat, WebLogic 등
주요 역할:
- 동적 콘텐츠 생성
- 비즈니스 로직 처리
- DB 연동, 세션 관리
프론트엔드 (Frontend)
- 브라우저에서 실행되는 React, Vue, Angular 같은 JS 애플리케이션
- 초기 로딩 시 웹서버로부터 index.html + 번들 파일을 내려받음
- 이후 페이지 이동은 클라이언트 라우터가 처리 (새로고침 없음)
- 필요한 데이터는 백엔드 API 서버에 별도의 HTTP 요청(AJAX, Fetch, Axios 등)으로 호출
백엔드 (Backend)
- API 요청 처리 (REST, GraphQL 등)
- 비즈니스 로직 수행
- 데이터베이스 연동 (PostgreSQL, MySQL 등)
- 세션/토큰 관리 및 인증 처리
6. HTTP 응답
서버는 클라이언트의 요청을 처리한 후 HTTP 응답을 보냅니다:
HTTP/1.1 200 OK
Content-Type: text/html; charset=UTF-8
Content-Length: 1234
Cache-Control: max-age=3600
Set-Cookie: sessionid=abc123; HttpOnly; Secure
<!DOCTYPE html>
<html>
<head>
<title>Example Page</title>
</head>
<body>
<h1>안녕하세요!</h1>
</body>
</html>7. 브라우저 렌더링
브라우저는 받은 HTML, CSS, JavaScript를 해석하여 사용자에게 보여줄 페이지를 구성합니다:
렌더링 과정
1. HTML 파싱 → DOM 트리 생성
2. CSS 파싱 → CSSOM 트리 생성
3. DOM + CSSOM → 렌더 트리 생성
4. 레이아웃 (Reflow) → 요소들의 위치와 크기 계산
5. 페인트 (Repaint) → 실제 픽셀로 그리기
6. 합성 (Composite) → 레이어들을 합쳐서 최종 화면 생성8. TCP 연결 종료
모든 통신이 완료되면 TCP 연결을 정리합니다:
4-Way Handshake
클라이언트 → 서버: FIN (연결 종료 요청)
서버 → 클라이언트: ACK (종료 요청 확인)
서버 → 클라이언트: FIN (서버도 연결 종료 요청)
클라이언트 → 서버: ACK (최종 확인)- HTTP/1.0: 각 요청마다 연결 종료
- HTTP/1.1: Keep-Alive로 연결 재사용 가능
- HTTP/2: 하나의 연결로 다중 요청 처리
- HTTP/3: UDP 기반 QUIC 프로토콜 사용, 스트림별 독립 전송으로 HOL 블로킹 최소화, TLS 1.3과 통합해 빠른 연결 및 다중 요청 처리 가능
디등