우리는 매일매일 웹 브라우저를 열고 SNS나 뉴스, 쇼핑몰 등을 방문한다.
주소창에 URL을 입력하거나 페이지 링크를 클릭하면 해당 링크로 이동할 수 있는데 그 뒤에서는 과연 어떤일이 일어날까?!?!?
실제 면접에서도 나오는 단골 질문 이라고 하니 한번 알아보자!
🥸 웹 브라우저에
www.naver.com을 입력하고 Enter를 눌렀어요~
1. URL 파싱
브라우저는 일단 이 URL의 구조를 해석한다.(파싱)
프로토콜, 호스트, 포트, 경로, 쿼리 등의 정보를 어떤 프로토콜? 어떤 URL, 어떤 포트로 요청할 것인지 해석하여 분석한다.
🥸 근데 저는 프로토콜(https://)과 포트번호를 입력한 적이 없는데요?
명시적으로 입력하지 않았다면 브라우저는 일단 기본 값으로 요청하게된다.
http라면 80포트 https라면 443포트
2. HSTS 목록 조회
🥸 근데 naver URL은
https://www.naver.com인데 저는http://naver.com으로 입력해도 https로 접속이 되더라고요?
HTST는 HTTP를 이용하지 않고, HTTPS를 사용한 연결만 허용하는 기능인데 만약 HTTP로 요청이 왔다면 HTTP 응답 헤더에 "Strict transport Security"라는 필드를 포함하여 응답하고 이를 확인한 브라우저는 해당 서버에 요청할 때 HTTPS만을 통해 통신하게된다. 그리고 자신의 HSTS 캐시에 해당 URL을 저장하는데 이 것을 HSTS 목록이라고 한다.
즉 브라우저는 HSTS 목록 조회를 통해 해당 요청을 HTTPS로 보낼지 판단한다.
HSTS목록에 있다면 명시적으로 HTTP를 통해 요청해도 HTTPS로 요청하게 되는 것!
3. URL을 IP주소로 반환
www.naver.com으로 입력한 주소만으로는 컴퓨터끼리 통신할 수 없고 이 것을 인터넷 상에서 컴퓨터가 읽을 수 있는 IP주소로 변환해야 서로 통신이 가능하다.
우선 브라우저에서는 자신의 local hosts file과 브라우저 캐시에 해당 URL이 존재하는지 확인한다. 존재하지 않는다면 도메인 주소를 IP주소로 변환해주는 DNS서버에 요청하여 해당 URL을 IP주소로 변환한다.
DNS 서버로 요청하는 과정
- 미리 설정된 local DNS에 해당 URL주소의 IP주소를 요청한다.
- local DNS에 해당 URL의 IP주소가 존재한다면 이를 응답하고 없다면 다른 DNS서버와 통신해 root DNS서버에 해당 URL의 IP주소를 요청한다.
- root DNS서버에 해당 IF주소가 없으면 하위 DNS서버에에 요청해보라고 응답한다. 이 응답을 받은 local DNS는 .net 도메인을 관리하는 DNS서버에 같은 내용을 요청한다.
- .net DNS서버에도 해당 IP주소가 없다면 하위 DNS서버에 요청하라고 응답한다. 이 응답을 받은 local DNS는 naver.com 도메인을 관리하는 DNS서버에 같은 내용을 요청한다.
- naver.com DNS서버에서 IP주소를 응답받은 local DNS는 해당 IP를 캐싱하고 응답한다.
4. 라우터를 통해 해당 서버의 게이트웨이까지 이동
DNS서버에게 받은 IP주소로 해당 서버에 요청을 보낸다. 하지만 해당 IP주소로 가야하는 것은 알지만 거기까지 어떻게 가야하는지 그 경로는 모르니깐 라우터 라우팅 테이블이 이 요청이 네트워크를 타고 어떤 경로를 통해 갈지 경로 지정을 해준다. 그럼 그 경로를 통해 요청은 해당 IP주소를 찾아간다.
5. ARP를 통해 IP주소를 MAC주소로 변환
실질적으로 통신을 하기위해서는 논리 주소인 IP주소를 물리 주소인 MAC주소로 변환해야 한다. 이를 위해 해당 네트워크 내에서 ARP를 브로드 캐스팅한다.
ARP
네트워크 상에서 논리적인 IP주소를(망계층), 물리적인 MAC주소로 (데이터링크 계층), 바꾸어주는 역할
해당 IP주소를 가지고있는 노드는 자신의 MAC주소를 응답한다.
6. 대상 서버와 TCP 소켓 연결
이제 서버와 클라이언트가 통신하기위해 TCP 소켓 연결을 진행한다.
예전 글에서 작성했던 3 Way Handshake를 통해 이뤄진다.
3 way handshake 다시보기
HTTPS는 암호화 통신을 위한 TLS 핸드 쉐이킹이 추가된다.
7. HTTP(HTTPS) 프로토콜로 요청, 응답
연결이 됐으니 이제 www.naver.com을 달라고 서버에 요청을 한다.
서버에서 해당 요청을 받고, 수락할 수 있는지 검사한다. 그리고 서버는 이 요청에 대한 응답을 생성하여 브라우저에게 전달한다.
8. 브라우저에서 응답을 해석
서버에서 응답한 내용은 HTML, CSS, JS 등으로 이루어져 있는데 이를 브라우저에서 해석하여 그려준다. 정해진 형식으로 해석하여 우리가 원하는 www.naver.com가 그려지게 되는 것!
🥸 아니 이 과정을 대체 면접에서 어떻게 설명하죠??
지금까지 웹 통신에 대한 흐름을 살펴보았다.
근데 저 위의 과정을 이해는 했지만 면접에서 저걸 다 설명할 시간이 과연 있을까?...?
그래서 아래 면접용 설명으로 준비 했습니다!!!
면접용
1. URL 파싱
브라우저는 입력된 URL을 파싱하여 프로토콜, 호스트, 포트, 경로, 쿼리 등의 정보를 추출한다.
2. DNS 조회
호스트 정보를 이용하여 DNS서버에 호스트 이름을 IP주소로 변환하는 DNS조회를 수행합니다.
3. 서버 연결
브라우저는 IP 주소와 추출한 포트 정보를 이용하여 웹 서버와 TCP/IP 연결을 수립한다.
4. 요청 전송
브라우저는 HTTP요청 메시지를 생성하여 서버로 전송하는데 요청 메시지에는 HTTP메소드(GET, POST 등), 경로, 쿼리, 헤더, 바디 등의 정보가 포함된다.
5. 응답 수신
서버는 요청에 대한 응답 메시지를 생성하여 클라이언트에게 전송한다. 이때 응답 메시지에는 상태 코드, 헤더, 바디 등의 정보가 포함된다.
6. 페이지 렌더링
브라우저는 응답 메시지로부터 받은 HTML, CSS, JavaScript 등의 리소스를 파싱하여 렌더링 엔진을 통해 페이지를 렌더링한다.
7. 페이지 로드 성공
페이지가 완전히 로드되면, 브라우저는 페이지 로드 완료 이벤트를 발생시키고, 사용자가 페이지를 조작할 수 있도록 브라우저 UI를 업데이트 한다.
결론
오늘은 웹 브라우저에 URL을 입력하면 어떤 일이 생길까?에 대해 알아보았다.
확실히 이전에 네트워크에 대해 공부해 놓으니 이해가 더 잘 되는 것 같다!!
