TIL/Daily Mission

01/29 앱개발 아티클 스터디(2) - 웹 브라우저에 URL을 입력하면 어떤 일이 생기나요?

sos000303 2024. 1. 29. 16:04
728x90

https://aws.amazon.com/ko/blogs/korea/what-happens-when-you-type-a-url-into-your-browser/

 

웹 브라우저에 URL을 입력하면 어떤 일이 생기나요? | Amazon Web Services

여러분은 매일 웹 브라우저를 열고 소셜 미디어, 뉴스, 전자 상거래 사이트 등 즐겨 찾는 웹 사이트를 탐색합니다. 주소창에 URL을 입력하거나 페이지 링크를 클릭하면 해당 페이지로 이동합니다

aws.amazon.com

 

1. 내용 요약

기본 지식

- 웹 사이트는 HTML, CSS, Javascript 및 이미지와 같은 파일의 모음이며 서버에 저장된다.

- 웹 브라우저에서 URL( https://channy.creation.net/blog 같은 사이트 주소)를 입력하면 브라우저는 도메인( channy.creation.net)을 검색하여 주소를 찾는다.

- 인터넷의 각 장치에는 IP주소(3.34.220.186과 같은)라는 고유한 주소가 있다. 하지만 도메인보다 기억하기 어렵기때문에 DNS(도메인 이름 시스템)을 이용한다.

 

전체 과정

1. 웹브라우저에 URL을 입력하고 Enter 키 입력

 - 통신규약(Protocol)

https:// 는 통신프로토콜이다. 이는 Hypertext Transfer Protocol Secure의 줄임말로 브라우저에 TLS라는 암호화 프로토콜을 사용해 서버에 연결하도록 지시한다. https:// 외에도 file://, mailto://, ftp:// 등의 다른 프로토콜도 있다.

 

- 도메인(Domain)

channy.creation.net 은 웹사이트의 도메인 이름이며 특정 서버의 IP주소를 가리킨다.

 

- 경로(Path)

URL에 https://channy.creation.net/blog/hello-world와 같이 리소스에 대한 추가경로가 있는 경우가 있다. 이 경우 blog는 서버에서 요청된 hello-world로 이어지는 경로이다. 파일 디렉토리 구조처럼 생각할 수 있다.

 

- 리소스(Resource)

hello-world는 보려는 웹 사이트의 리소스 이름이다. .html과 같은 파일 확장자가 있으면 html컨텐츠가 있는 서버의 정적파일임을 나타내고 없다면 서버가 이 컨텐츠를 생성했음을 나타낸다.

 

 

2. 웹 브라우저가 도메인명의 IP 주소 조회

 

- 브라우저는 인터넷에서 연결할 서버를 파악해야하는데 DNS 조회를 사용하여 이 작업을 수행한다.

- 웹 브라우저는 캐시(Cache)라는 형태의 DNS데이터를 읽는다.

- 웹 브라우저가 캐시계층에서 IP주소를 찾을 수 없는 경우 회사 네트워크 또는 IPS(인터넷 서비스 제공업체)의 DNS서버에서 재귀적 DNS조회를 수행한다.

- 특정 웹 브라우저는 사용자가 링크를 따라가기 전에 미리 도메인 네임을 확인하는 DNS 프리페치라는 기능을 가지고 있다.

 

3. 웹 브라우저가 서버와의 TCP 연결 시작

 

- 인터넷에 연결된 웹 브라우저 요청 패킷은 일반적으로 TCP/IP (Transmission Control Protocol/Internet Protocol)라고 하는 전송 제어 프로토콜을 통하여 연결할 IP주소가 있는 웹 서버를 찾는다.

- 웹 서버에 직접 도달하는 방법은 위치에 따라 효율적이지 않을 수 있기 떄문에 CDN(컨텐츠 전송 네트워크)를 이용하여 콘텐츠를 웹 브라우저 가까이에 위치시킨다.

- CDN은 콘텐츠를 사용자에게 더 가까이 제공하여 사이트의 원본 연결 성능을 개선하는 캐싱 서버의 글로벌 분산 네트워크이다.

 

4. 웹 브라우저가 HTTP 요청을 서버로 전송

 

- 웹 브라우저가 서버에 연결되면 HTTP(s) 프로토콜에 대한 통신 규칙을 따른다.

- 요청에는 요청라인 / 헤더 / 본문이 포함된다.

- 요청 라인에는 요청 메서드(GET, POST, PATCH 등)/경로/통신할 HTTP 버전이 포함된다.

- 요청 헤더는 요청을 라우팅하는데 도움이 되는 추가정보를 클라이언트에서 전달하고 어떤 유형의 클라이언트가 요청을 수행하는지 나타낸다. 키 - 값의 짝으로 이루어져있다.

- 요청의 본문은 메서드에 따라 비어있기도 하며 비어있지 않을 경우 생성하거나 업데이트 할 클라이언트의 데이터가 포함된다. 본문의 형식은 서로 다를 수 있으며 서버는 요청헤더를 기반으로 형식을 이해한다.

 

5. 웹 서버가 요청을 처리하고 응답을 다시 전송

 

- 응답에는 상태 라인 / 응답 헤더 / 요청된 리소스가 포함된다.
- 상태라인에는 HTTP버전과 요청상태의 숫자 및 텍스트 표현이 모두 포함된다.

 

6. 웹 브라우저가 콘텐츠 렌더링

 

- 브라우저가 응답 헤더를 검사하여 렌더링하는 방법에 대한 정보를 확인

- 서버에 추가 데이터를 요구하거나 CSS, JS파일 리소스를 참조하여 후속 요청을 한다.

 

2. 알게 된 개념

- DNS와 서버, 웹 주소에 대한 개념을 알게 되었다.

- 웹 브라우저에 웹 주소를 입력하면 페이지를 로딩하기까지 일어나는 과정을 알게 되었다.

- 전체 과정에서 코딩 공부할때도 보았던 몇몇 키워드를 보았다. 공통적으로 사용하는 용어가 꽤 있는 것을 알았다.

 

 

 

728x90