[Node.JS 입문 리뉴얼] 웹과 HTTP의 동작 방식

웹 브라우저

• 웹 서버로부터 정보를 요청하고, 그 정보를 사용자에게 보여주는 소프트웨어
• HTML, CSS JavaScript 파일을 받아 해석하고 표시하는 역할

 

정적 웹 페이지 (Static Web Page)

• 서버에서 브라우저로 전송되는 내용이 그대로 표시

 

동적 웹 페이지(Dynamic Web Page)

• 서버로부터 데이터를 받아 브라우저가 실시간으로 내용을 생성하거나 변경

 

브라우저의 통신 방식

1. 사용자가 웹 브라우저의 주소창에 URL을 입력
2. 웹 브라우저는 URL을 DNS 서버로 전달하여 IP 주소를 찾음
3. DNS 서버는 도메인 이름을 IP 주소로 변환
4. 웹 브라우저는 IP 주소로 HTTP 요청을 전달
5. 웹 서버는 요청을 받아 처리한 후 HTTP Response로 브라우저에게 전달
6. 웹 브라우저는 받은 HTTP Response를 바탕으로 사용자에게 결과를 표시

 

URL 입력

• URL(Uniform Resource Locator)은 웹 브라우저 주소창에 입력되어 인터넷상의 리소스 위치를 나타냄
• URL은 <프로토콜>://<도메인 명>:<포트>/<경로>의 구조를 가짐
  http://cafe.naver.com/joonggonara는 http 프로토콜과 cafe.naver.com 도메인, joonggonara 경로를 가리킴

 

IP를 이용하여 웹 서버와 통신하기

• IP(Internet Protocol)는 각 네트워크에 연결된 장치에 고유한 주소를 부여
  IPv4는 현재까지 사용되고 있으며, 이를 통해 웹 서버와 통신을 진행

 

HTTP와 HTTPS
  - HTTP는 웹 서버와 브라우저 사이의 통신을 위한 프로토콜
  - HTTPS는 HTTP에 보안 기능을 추가한 것으로, 데이터가 암호화되어 전송

IPv4와 IPv6
  - IPv4는 32비트 주소 체계를 사용하는 반면, IPv6는 128비트 주소 체계를 사용하여 훨씬 더 많은 주소 공간을 제공

 

 

 

HTTP(Hypertext Transfer Protocol)

• 웹 상에서 데이터를 주고받는 통신 규약(프로토콜)
• 컴퓨터 간 데이터 전송에 사용되는 약속으로, HTTP를 사용함으로써 서버와 클라이언트(Ex. 브라우저)는 서로 이해할 수 있는 방식으로 통신

 

HTTPS와의 차이

• HTTPS는 HTTP에 암호화 기능을 추가한 버전
• 데이터의 안정성을 높이기 위해 사용
• HTTPS는 데이터를 비밀 코드처럼 만들어 전송하여, 클라이언트와 서버 간의 데이터가 외부에서 볼 수 없게 보호

 

HTTP의 데이터 전송 방식

• 항상 요청(Request)과 응답(Response)의 개념이 존재
• 브라우저(클라이언트)는 서버에 특정 페이지(URL 등의 정보)에 대한 요청을 보냄
• 서버는 이 요청을 받고, 해당 페이지에 대한 데이터를 반환(Response)하며, 페이지가 없으면 관련된 정보를 반환
• 브라우저는 서버로부터 받은 데이터를 사용자에게 표시

 

개발자 도구를 통한 HTTP 동작 확인

• 브라우저에서 개발자 도구(DevTool)를 열고 네트워크 탭을 통해 HTTP 통신을 직접 볼 수 있음

 

Headers 탭

• 서버로 보낸 요청 데이터(Request Headers)와 서버가 보낸 응답 데이터(Response Headers)를 볼 수 있음

 

Response 탭

• 서버에서 브라우저로 반환된 실질적인 웹 페이지 데이터를 볼 수 있음

 

HTTP의 구성 요소

• Method: 데이터를 주고받는 방식을 정의
  GET은 리소스를 얻을때, POST는 데이터를 게시할 때 사용
• Header: 요청 및 응답에 대한 추가적인 정보(메타데이터)를 담고 있음
  요청하는 페이지, 페이지의 성공 여부 등이 여기에 포함
• Payload: 실제 전송되는 데이터 본문
  GET을 제외한 대부분의 메서드에서 사용

 

 

 

웹 서버

• 웹 서버는 인터넷 상에서 클라이언트(Ex. 웹 브라우저)의 HTTP 요청을 처리하고 응답하는 컴퓨터 시스템 또는 소프트웨어를 말함
• 웹 서버의 주요 업무는 클라이언트로부터의 요청에 대해 정적 콘텐츠(HTML, CSS, 이미지 파일 등)를 빠르게 반환하는 것
• 웹 서버는 필요에 따라 웹 어플리케이션 서버(WAS)로 요청을 전달하여 처리할 수 있음
• 대표적인 웹 서버 소프트웨어: Apache, Nginx

 

웹 어플리케이션 서버(WAS)

• 웹 어플리케이션 서버는 웹 서버와 협력하여 동적 콘텐츠를 제공하는 시스템
• 데이터베이스 조회, 복잡한 계산, 비즈니스 로직 처리 등을 수행
• WAS는 클라이언트의 요청을 웹 서버로부터 받아 처리한 후, 결과를 웹 서버에 반환하여 클라이언트에 최종 응답을 제공
• WAS의 사용은 복잡한 데이터 처리 및 다양한 비즈니스 로직 실행에 필요

 

웹 서버와 브라우저 간의 통신 방식

1. HTTP Request: 사용자는 브라우저를 통해 웹 사이트에 대한 요청을 보냄
   주로 GET 메소드를 사용하나, POST, PUT, DELETE 등 다른 HTTP 메서드들도 사용됨
2. 웹 서버의 처리: 웹 서버는 이 요청을 처리하고, 요청된 데이터를 HTTP response를 통해 브라우저에 전송
3. 브라우저의 표시: 브라우저는 서버에서 받은 데이터를 사용하여 사용자에게 웹 페이지를 표시