웹 동작 방식
1. 사용자 요청
URL 구성: 사용자가 브라우저의 주소창에 URL을 입력한다. URL은 웹 리소스의 위치를 나타내며, 프로토콜://도메인:포트/경로?쿼리스트링의 형식을 가진다.
- 프로토콜: 서버와 통신할 때 사용할 규칙을 정의한다. (HTTP, HTTPS)
- 도메인: 웹 서버의 도메인 이름 (www.example.com)
- 포트: 서버에서 리소스를 제공하는 특정 포트 (생략 가능, 일반적으로 HTTP는 80, HTTPS는 443)
- 경로: 서버에서 특정 페이지나 자원에 접근하기 위한 경로
- 쿼리 스트링: 선택적으로 추가 데이터를 서버에 전달하는 매개변수
2. DNS 조회
도메인 이름 해석: 도메인 이름 시스템(DNS) 서버가 URL의 도메인 이름을 IP 주소로 변환한다. 이 과정은 여러 DNS 서버를 거쳐 이루어질 수 있으며, 최종적으로 해당 서버의 실제 주소를 찾아낸다.
3. 서버 요청
TCP 연결: 브라우저는 서버의 IP 주소로 TCP 연결을 시도한다. HTTPS를 사용할 경우, SSL/TLS Handshake 통해 보안 연결이 설정된다.
HTTP 요청: TCP 연결이 성립되면, 브라우저는 HTTP 요청 메시지를 구성하여 서버에 보낸다. 요청 타입(GET, POST 등), 경로, 프로토콜 버전, 필요한 헤더들을 포함한다.
4. 서버 응답
처리 및 응답: 서버는 받은 요청을 처리하고, 적절한 HTTP 응답 코드(200 성공, 404 찾을 수 없음 등)와 함께 요청한 데이터나 결과를 보낸다. 응답은 HTML 문서, CSS 파일, 이미지, JavaScript 코드 등
5. 콘텐츠 렌더링
브라우저는 서버로부터 받은 데이터를 해석하고, 웹 페이지를 사용자에게 보여줄 수 있도록 화면에 렌더링한다.
HTML 파싱: HTML 문서를 DOM(Document Object Model) 트리로 변환한다.
CSS 처리: CSS는 스타일 규칙을 파싱하고, DOM 트리의 각 요소에 적용한다.
자바스크립트 실행: JavaScript 파일은 DOM API를 통해 웹 페이지의 동적인 요소를 조작한다. 이 과정에서 추가적인 HTTP 요청이 발생할 수 있다.(AJAX 요청)
6. 인터랙션과 추가 요청
사용자 상호작용: 사용자의 입력(링크 클릭, 폼 제출 등)에 따라 추가적인 페이지 요청이 발생할 수 있고, 이를 통해 페이지가 새롭게 로드되거나 업데이트 된다.
