오늘의 주제는 주소창에 google.com을 검색하면 브라우저와 서버에서 어떤 일이 일어나는지 학습을 해보겠다!!
사실 이게 개발자로서 기본이 되는 지식인데 이제야 제대로 학습을 하다니..
면접이 아니었다면 또 알아볼 생각을..했을..까
그래도 지금이라도 알게되서 너무 다행이고 이를 이해하니 백엔드와 프론트엔드의 책임을 더 이해할 수 있게 되었다.
After Search Google.com
자, 먼저 결론부터 말하자면 다음과 같다!
- 사용자가 원하는 URL을 입력한다.
- 입력 받은 URL을 기준으로 브라우저에 캐싱된 DNS기록을 확인한다.
- 만약 DNS 기록에 원하는 URL이 없다면 DNS서버에게 URL과 일치하는 IP주소를 요청한다.
- 요청한 IP주소를 DNS서버로부터 받아온다.
- HTTP 요청 메세지를 만들어서 해당 IP주소로 보낸다.
- 이때, TCP/IP 프로토콜을 사용해서 보낸다.
- 그럼 해당 IP주소에서 response 메세지를 다시 TCP/IP 프로토콜을 사용해 브라우저에게 보낸다.
- 그럼 브라우저는 받아온 웹페이지, 상태코드, 쿠키, 개인정보를 기반으로 html을 렌더링해 보여준다.
- 이때 렌더링 되는 과정은 CPR(Critical Path Rendering)의 순서로 렌더링 된다.
지금은 천천히 생각하면서 학습을 하다보니 이해가 된다!
완벽하게 이해하진 못했지만 그래도 전체적인 흐름을 알 거 같다. 이제 세세하게 한번 살펴보자
DNS ❓
DNS는 그냥 IP주소들과 도메인을 짝지어 저장하고있는 전화번호부라고 생각하면된다.
짝발란스 개인 프로젝트를 만들 때 DNS 서버에 도메인을 등록한 경험이 있다. 그때는 잘 몰랐지만 이렇게 전체적인 흐름으로 보니 도메인까지 만들어 서비스 한 경험을 해보길 잘했다는 생각이 든다.
그럼 도메인을 왜쓸까? IP주소는 아주 많은 숫자와 . 으로 이루어져 있다. 이를 사용자에게 기억하고 검색하라고 한다면 아마 사용자들은 브라우저를 사용하지 않을 수 있다. 컴퓨터가 이해할 수 있는 숫자와 . 으로 서버나 클라이언트의 컴퓨터를 알아볼 수 있는데 이를 위해 IP주소를 감싸는 포장지가 도메인이이고 이에 대한 정보를 모두 가지고 있는 책자가 DNS 서버이다.
브라우저에 캐싱된 DNS 기록 ❓
브라우저는 DNS에 대한 기록을 일시적으로 캐싱해놓는다.
크게 4가지의 캐시가 있다.
- Browser캐시
- OS캐시
- router캐시
- ISP캐시
캐싱된 데이터를 이용해 네트워크 트래픽 조절과 데이터 전송 시간을 줄일 수 있다.
ISP ❓
ISP: 인터넷 서비스 공급자 : SK, LG, KT 등
HTTP, TCP/IP ❓
자, 위 전체적인 흐름을 이해하는데 가장 어려움을 주었던 프로토콜이다. 사실 프로토콜이라는 개념도 꽤 어렵다. 추상적이었다.
Protocal: 컴퓨터 네트워크에서 데이터 통신을 위해 사용되는 규칙과 규약의 집합
자 그럼 DNS서버에서 IP 주소를 주면 이 IP주소의 서버에게 통신을 해서 원하는 html, 개인정보, 쿠키 등을 받아와야하지 않는가??
그럼 어떻게 통신을 할까! 에 대한 해답이 HTTP, TCP/IP 통신인 것이다.
자 일단은 브라우저는 HTTP 요청 메세지를 만든다.
HTTP는 그냥 요청 메세지를 담는 '요청메세지 말풍선' 이라고 생각하자.
이곳에 원하는 요청메세지를 담을 수 있다.
그럼 TCP/IP가 이 요청 메세지를 보내준다. GET요청을 한 HTTP 요청 메세지겠죠?
TCP/IP는 '클라이언트와 서버를 이어주는 통로'라고 생각하자
그럼 이해할 수 있다. HTTP라는 요청메세지를 TCP/IP라는 통로를 뚫어서 보내주는 것이다.
그러면 다시 서버에서 요청 메세지를 받아 response를 보내주는데 이를 http 요청 메세지에 담겨 다시 TCP/IP 프로토콜을 통해 다시 클라이언트로 돌아오게 됩니다.
HTTP 요청메세지에 담겨진 response는 무엇이❓
이때 response에는 Cookie, 개인정보, 웹페이지, 상태코드 등이 담겨져 온다
추가사항 http://URL 을 입력하는 이유 ❓
많은 웹 사이트에서 http:// 이후에 url을 추가한 형태가 주소창에 보인다. 이는 왜 그럴까??
바로바로!! http 통신을 하겠다는 말이다. 그니까 사실 주소창에 naver.com을 검색하면 자동으로 https://naver.com으로 입력되어있는 것을 알 수 있다.
사실 브라우저는 기본값으로 http 통신이 설정되어있다. 그러니 주소창에 굳이 http를 써주지 않아도 브라우저는 자동으로 http 통신을 통해 해당 IP를 가진 컴퓨터 서버와 통신을 하는 것이다.
이제 좀 알겠다!!!
근데 요즘 사이트를 보면 https:// 이렇게 자동으로 연결된다. 이는 뭐냐면 http와 https의 가장 큰 차이점은 보안성이다. https에서 s는 Secure을 말한다. http와 달리 https는 데이터를 더욱 안전하게 전송하기위해 추가 보안 기능을 제공한다. https는 데이터를 암호화해서 전송하므로 중간에서 데이터가 누출되거나 변조되는 것을 방지할 수 있다.
그니까 http 요청 메세지를 가지고 TCP/IP 포로토콜을 통해 메세지가 이동할 때 보안성을 높여 사용자의 개인정보나 쿠키에 대한 보안을 높이는 것이다!
정말 흥미롭다. 이제야 이런 재밌는 사실들을 알게되다니!!!!! 🔥
