[왜 학습하는가?]
면접질문에서 많이 물어본다고 하는 내용이라고 하며 나 스스로도 명확하게 알고있지 않은 내용이기 때문에 학습하려고 한다.
[웹 통신의 큰 흐름]
https://www.google.com을 입력하면 무슨일이 일어나는가?
우리는 하루에도 몇번이나 브라우저 주소창에 URL을 입력한다.
그리고 검색창이 뜨는 걸 당연하게 받아들인다.
하지만 그 순간에는 많은 단계가 있다.
그 단계에 대해 하나씩 알아보자
1. 브라우저는 먼저 "이게 무슨 주소지?"를 파악한다.
우리가 입력한 주소를 쪼개보면 이렇게 된다
https:// www.google.com. /
(프로토콜) (도메인) (경로)
브라우저는 이걸 보고 이렇게 판단한다.
- https ➡️ 보안 통신이 필요하구나
- www.google.com ➡️ 서버 주소구나
- / ➡️ 기본 페이지 요청이구나
여기서 문제는 하나다
➡️ google.com이 실제 어디에 있는 서버인가?
2. DNS: 이름을 IP주소로 바꾸는 과정
컴퓨터는 도메인 이름을 이해하지 못한다.
대신 IP 주소만을 이해한다.
그래서 브라우저는 DNS에게 물어본다
➡️ "www.google.com의 IP 주소가 뭐야?"
이 과정은 대략 아래와 같이 진행된다.
1. 브라우저 캐시 확인
2. OS 캐시 확인
3. 공유기(로컬 DNS) 확인
4. 그래도 없으면 ➡️ DNS서버에 물오봄
결과는 아래와 같다
www.google.com -> 142.250.xxx.xxx이제야 컴퓨터는 구글 주소가 이 서버구나 하고 위치를 알게 된다.
3. 서버와 연결을 맺는다(TCP연결)
IP주소를 이제 알았으니 서버와 실제 연결을 해야 한다.
이 때 사용하는 것이 TCP연결이고 ,3-way-handshake라고 한다.
클라이언트: 나 연결해도 돼?
서버: 응
클라이언트: 그럼 시작하자4. HTTPS라면, 보안 악수(TLS Handshake)를 한다.
주소가 https로 시작했다.
이것은 함호화 통신을 하겠다는 선언이다.
그래서 TCP 연결 직후 아래와 같은 일이 추가로 일어난다.
- 서버가 인증서를 보여줌
- 브라우저가 신뢰 가능한지 검증
- 서로 사용할 암호화 방식 합의
- 비밀 키 생성
이 과정을 TLS Handshake라고 한다.
이 이후부터는 모든 데이터가 암호화된 상태로 오간다.
5. 진짜 요청(Request)을 보낸다.
여기까지 와야 드디어 우리가 생각하는 행동이 일어난다.
브라우저가 서버에게 말한다.
GET / HTTP/1.1
Host: www.google.com이 요청의 의미는 "google.com의 기본페이지를 줘" 라는 뜻이다.
6. 서버에서는 무슨 일이 벌어질까?
서버 입장에서는 다음과 같은 흐름이다.
1. 요청 수신
2. 요청 분석(URL, 헤더 등)
3. 필요한 로직 실행
4. HTML 생성
5. 응답(Response)dmfh qksghks
응답은 다음과 같이 생겼다.
HTTP/1.1 200 OK
Content-Type: text/html
<html>
...
</html>위 코드 안에는 HTML, CSS, JavaScript에 대한 시작점이 들어있다.
7. 브라우저는 받은 HTML을 바로 끝내지 않는다.
HTML을 받은 브러우저는 여기서 멈추지 않고 HTML을 해석한다
- <link> -> CSS 요청 필요
- <script> -> JS 요청 필요
- <img> -> 이미지 요청 필요
그래서 추가 요청을 또 보내며 이 과정이 여러 번 반복된다.
8. 랜더링(화면을 그리는 단계)
브라우저는 마지막으로 다음 단계를 실행한다.
1. HTML 파싱(DOM생성)
2. CSS 파싱(CSSOM 생성)
3. 둘을 합쳐 Render Tree 생성
4. 레이아웃 계산
5. 화면에 그림(Paint)
위 모든 과정이 끝나야 우리가 아는 "구글 화면"이 보이게 된다.
9. 전체 흐름을 한 줄로 요약해보면?
URL 입력
-> DNS 조회
-> TCP 연결
-> HTTPS 보안 설정
-> HTTP 요청
-> 서버 처리
-> HTTP 응답
-> 추가 리로스 요청
-> 브라우저 랜더링
'백엔드개발지식' 카테고리의 다른 글
| 프로세스와 스레드의 차이 (0) | 2026.01.29 |
|---|---|
| GET과 POST의 차이점은 무엇일까? (0) | 2026.01.27 |
| [네트워크] Snappy에 대해 알아보자 (0) | 2026.01.10 |