HTTP는 무엇일까? / 웹 브라우저?

Think_Positively·2021년 3월 2일
0

백엔드_개발자

목록 보기
3/6

HTTP(HyperText Transfer Protocol)

  • HTML과 같은 하이퍼미디어 문서를 전송하기위한 애플리케이션 레이어 프로토콜
  • 웹 브라우저 / 웹 서버간의 커뮤니케이션을 위해 디자인되었지만, 다른목적으로도 사용될 수 있다.
  • 클라이언트의 요청을 위한 연결부터 응답까지 기다리는 클라이언트-서버 모델이다.
  • 무상태(stateless) 프로토콜, 즉 서버에서 어떠한 데이터도 유지하지 않는다는 의미
  • 데이터의 loss가 있는 UDP보다 안정적인 TCP/IP 레이어 기반.

Browser and How they work?

Web Browser?

  • 웹은 인터넷을 사용하기 쉽게 도와주는 도구이다.
  • FireFox, Google Chrome, Microsoft Edge 등 이 웹 브라우저를 통해 우리는 인터넷에 있는 모든 것들 (문서, 동영상, 검색, 쇼핑)을 한다.

How does it work?

  • 웹 브라우저는 우리가 원하는 사이트에 우리를 대려다 주고 그곳에 정보를 HTTP로 가져와 우리가 보는 화면에 보여준다.
  • 웹 브라우저가 데이터를 가져올때 렌더링이라고 불리우는 소프트웨어를 사용하여 가져온 데이터를 text 또는 images 들로 보여준다.
  • 이러한 데이터들은 HTTP로 작성되어있고 웹 브라우저는 HTTP 데이터를 읽어 우리가 보고, 듣는 형식으로 만들어준다.

Four main jobs browser do

  • DNS resolution
  • HTTP exchange
  • Rendering
  • Rinse and repeat

DNS resolution

  • 쉽게 표현해서 www.naver.com을 입력하면 브라우저가 자동으로 naver의 IP주소로 연결해준다.

HTTP exchange

  • 웹상에서 서버와 클라이언트(web browser)간에 요청/응답 by TCP connection

  • 예로 www.google.com에 접속하게되면 브라우저는 서버에게 이렇게 요청한다

    GET / HTTP/1.1Host: google.comAccept: /

  • GET / HTTP/1.1: 브라우저가 서버에게 "/"에 위치한 문서를 HTTP/1.1 protocol로 달라는 의미

  • Host: google.com: HTTP/1.1 protocol에서만 필수이며, 의미하는 바는 다양한 도메인을 가지고 있을 수 있는 ex) google.co.kr, google.co.uk etc.. 서버에게 google.com이라는 특정한 host를 요청하는 것.

  • Accept: */*: Optional header, 브라우저가 서버에게 어떤 응답도 받아드리겠다는 뜻. 서버가 JSON, XML, 또는 HTML 포맷을 다가지고 있어도 아무거나 보내도 상관없다는 뜻.

Client(웹 브라우저)의 요청이 끝나면 이제는 서버에서 응답이 온다.

HTTP/1.1 200 OKCache-Control: private, max-age=0Content-Type: text/html; charset=ISO-8859-1Server: gwsX-XSS-Protection: 1; mode=blockX-Frame-Options: SAMEORIGINSet-Cookie: NID=1234; expires=Fri, 18-Jan-2019 18:25:04 GMT; path=/; domain=.google.com; HttpOnly

  • 우선 서버에서 요청을 잘받았으며(200 OK), 응답을 보낼때 몇가지 header들을 추가해서 보낸다. 예를 들면 무슨 웹서버가 우리 요청을 받았는지 (Server: gws), 이 응답에 X-XSS-Protection policy 가 뭔지 블라블라..

  • 어쨋든 지금 중요한건 서버와 클라이언트(Browser)가 통신을 하는데 HTTP로 통신한다는 것이다.

Rendering

  • 서버의 응답 본문에 보면, 서버는 Content-Type header에 맞춰, 보내는 데이터가 무엇인지 알려줍니다.
  • 이게 웹브라우저의 최대 강점입니다. 브라우저는 HTML 구문을 해석하여, 추가적인 요소들 예를들면, Javascript, CSS들을 빠르게 사용자에게 보여줍니다.

Cookies

  • 웹사이트는 유저에 대한 정보를 우리의 컴퓨터에 저장한다. 그리고 추후에 다시 그 웹사이트에 접속하게되면 유저 데이터를 읽어 웹사이트 사용을 더 유용하게 도와준다.

References

profile
데이터 엔지니어를 꿈꾸며

0개의 댓글