웹 브라우저란 사용자가 인터넷에서 웹사이트를 탐색할 수 있게 하고, HTML, CSS, JavaScript 등으로 구성된 웹 페이지를 렌더링하여 화면에 출력해주는 소프트웨어 애플리케이션이다. 대표적으로는 Chrome, Safari, Microsoft Edge 등이 있다.
웹 서버란 인터넷에서 사용자의 요청을 받아 웹 페이지나 데이터를 제공하는 소프트웨어 또는 하드웨어 시스템으로, 웹 브라우저가 요청한 파일을 반환해 웹 페이지를 표시할 수 있도록 한다.
- 데이터 센터에 있는 실제 물리적인 하드웨어 서버를 의미한다. 클라우드의 가상 서버는 물리적 서버에서 가상화된 환경으로 동작하지만, 독립적인 서버처럼 작동한다.
- 일반적으로 말하는 "웹 서버"로 사용자가 요청한 콘텐츠를 정적인 형태 그대로 반환해주는 역할을 한다. (e.g. NginX, Apache)
- 흔히 "WAS (Web Application Server)"라 불리며 정적인 콘텐츠 뿐만 아니라 동적인 콘텐츠도 처리할 수 있는 서버이다. 웹 서버의 기능과 더불어 애플리케이션 로직을 실행하고, DB와의 상호작용으로 동적인 응답을 생성하는 역할을 한다. (e.g. Apache Tomcat, Jetty, Undertow)
웹 브라우저와 웹 서버의 통신은 주로 HTTP/HTTPS 프로토콜을 기반으로 하는 요청-응답 구조이다. 다음은 웹 브라우저에서 요청이 일어났을 때 해당 요청이 서버에서 처리되고 반환되는 과정이다.
1. 사용자 요청
사용자가 웹 브라우저에 URL을 입력하거나 링크를 클릭하여 웹 페이지를 요청한다.
2. DNS 조회
사용자가 입력한 도메인 주소를 DNS 서버에 전달해 해당 도메인의 IP 주소를 반환받는다.
3. 웹 서버 연결
브라우저는 웹 서버의 IP주소를 이용하여 서버에 연결한다. 일반적으로는 HTTP / HTTPS 프로토콜을 사용하고, 경우에 따라 WebSocket, FTP 등을 사용하기도 한다.
4. HTTP 요청
브라우저는 웹 서버에 HTTP 요청을 보낸다. 이 요청에는 사용자가 요청한 리소스(HTML, 이미지, 데이터 등)에 대한 경로정보와 헤더(브라우저 정보, 쿠키, 인증정보 등)가 포함된다.
5. 요청 처리
서버는 브라우저로부터 받은 리소스를 처리한다. 이때, 정적 리소스는 웹 서버 내의 파일시스템에서 찾아 바로 반환하고, 동적 리소스는 WAS에 전달하여 DB와의 상호작용이나 비즈니스 로직을 실행하여 결과를 반환한다.
6. 서버 응답
웹 서버는 요청을 처리한 후 브라우저로 HTTP 응답을 보낸다. 이 응답에는 상태코드, 응답헤더, 요청된 리소스가 포함된다.
7. 응답 렌더링
브라우저는 서버로부터 받은 파일은 웹 페이지로 볼 수 있도록 랜더링한다. HTML 파일을 해석하여 웹 페이지의 구조(DOM)를 구성하고, CSS 파일을 적용하여 디자인과 레이아웃을 설정한 후, JavaScript 파일을 실행시켜 동적 기능을 추가한다.