[NetWork] URI 와 웹 브라우저 요청 흐름

 ̱URI(Uniform Resource Identifier)

 

 

URI 를 번역하면 자원을 식별하는 통합된 방법입니다.

URI는 로케이터(locator), 이름(name) 또는 둘 다 추가로 분류될 수 있습니다.

그럼 로케이터(locator)와 이름(name)은 정확히 무엇일까요?

 

 

 

(URI, URL, URN 중에 URI 가 가장 큰 개념입니다. )

URL 은 자원의 위치로 우리가 흔히 웹브라우저에서 사용하는 주소

URN 은 자원의 이름으로 위 그림과 같이 이름을 부여하는 것인데,

이름만 가지고는 주소를 찾아갈 수 없기에 URL 을 많이 사용합니다. 

 

URI

Uniform: 리소스 식별하는 통일된 방식

Resource: 자원, URI로 식별할 수 있는 모든 것을 말합니다. (html, 파일, 실시간 교통 정보 등)

Identifier: 다른 항목과 구분하는데 필요한 정보

 

URL, URN

URL - Locator: 리소스가 있는 위치를 지정합니다.

URN - Name: 리소스에 이름을 부여합니다.

위치는 변할 수 있지만, 이름은 변하지 않습니다.

URN 이름만으로 실제 리소스를 찾을 수 있는 방법이 보편화 되어있지 않습니다.

 

 URL 전체 문법

 

scheme://[userinfo@]host[:port][/path][?query][#fragment] 

https://www.google.com:443/search?q=hello&hl=ko 

프로토콜(https)

호스트명(www.google.com) 

포트 번호(443) 

패스(/search) 

쿼리 파라미터(q=hello&hl=ko)

 

URL scheme

 

scheme://[userinfo@]host[:port][/path][?query][#fragment]

https://www.google.com:443/search?q=hello&hl=ko

scheme 에는 주로 프로토콜을 사용합니다.

프로토콜은 어떤 방식으로 자원에 접근할 것인지 정해놓은 규칙을 의미합니다.

ex) http, https, ftp ..

http는 80 포트, https는 443 포트를 주로 사용하며 이 두 프로토콜을 사용하면 포트를 생략할 수 있습니다.

https(HTTP Secure) 는 http 에 보안 기능이 추가된 프로토콜입니다. 대부분의 웹 사이트들이 https 를 사용하고

있습니다.

 

URL userinfo

scheme://[userinfo@]host[:port][/path][?query][#fragment]

https://www.google.com:443/search?q=hello&hl=ko

URL에 사용자정보를 포함해서 인증할 때 사용하지만 거의 사용하지 않습니다.

 

URL host

scheme://[userinfo@]host[:port][/path][?query][#fragment]

https://www.google.com:443/search?q=hello&hl=ko

host 는 호스트명을 의미합니다. 도메인명 또는 요청을 받는 컴퓨터인 서버의 IP 주소를 직접 사용할 수 있습니다.

 

URL PORT

scheme://[userinfo@]host[:port][/path][?query][#fragment]

https://www.google.com:443/search?q=hello&hl=ko

port 는 포트 번호를 의미하며 요청을 받는 컴퓨터인 서버의 포트 번호를 입력합니다.

일반적으로 생략할 수 있고 생략시 http는 80, https는 443 입니다.

 

URL path

scheme://[userinfo@]host[:port][/path][?query][#fragment]

https://www.google.com:443/search?q=hello&hl=ko

path 는 자원이 있는 경로를 의미합니다. 계층적 구조를 갖고 있습니다.

ex) /home/file1.jpg, /members, /members/100, /items/iphone12

 

URL query

scheme://[userinfo@]host[:port][/path][?query][#fragment]

https://www.google.com:443/search?q=hello&hl=ko

query 는 key=value 형태이며, ?로 시작, &로 추가할 수 있습니다. ex) ?keyA=valueA&keyB=valueB

웹서버에 제공하는 파라미터여서 query parameter, URL 에 입력되는 값은 모두 문자 타입이기 때문에

query string 로도 불립니다.

 

URL fragment

scheme://[userinfo@]host[:port][/path][?query][#fragment]

https://docs.spring.io/spring-boot/docs/current/reference/html/gettingstarted.html#getting-started-introducing-spring-boot

fragment 는 중간에 html 내부에서 다른 사이트로 이동할 때 사용합니다. 

서버에 전송하는 정보가 아니며 잘 사용하지 않습니다.

 

 웹 브라우저 요청 흐름

 

 

 

클라이언트는 웹 브라우저를 통해 위 그림에 나와있는 URL 을 입력해 요청합니다. 

 

 

1. 구글 서버를 찾기 위해 입력한 host 값인 도메인으로 DNS 에서 도메인에 해당하는 IP 가 있는지 찾습니다.

2. 포트는 현재 URL 의 schema 의 값인 프로토콜이 https 여서 443이 붙습니다.

 

 

3. HTTP 요청 메시지를 생성합니다. 

 

 

4. SOCKET 라이브러리를 통해 생성된 HTTP 요청 메시지를 OS 에 전달합니다.

 

 

 

5. 전달받은 HTTP 요청 메시지에 출발지 IP, 도착지 IP 와 출발지 PORT, 목적지 PORT 를 추가해

TCP/ IP 패킷을 생성해 서버에 전송합니다.

 

 

 

 

6. 패킷을 받은 서버는 HTTP 요청 메시지를 꺼내 해석한 후, HTTP 응답 메시지를 생성, 클라이언트가

TCP/ IP 패킷을 생성한 것처럼 TCP/ IP 패킷을 생성해 클라이언트에게 전송합니다.

 

 

 

7. 클라이언트는 서버가 보낸 TCP/ IP 패킷에서 HTTP 응답 메시지를 꺼내서 웹 브라우저를 이용해 확인합니다.

결국 웹 브라우저에 보여지는 화면은 HTTP 응답 메시지를 웹 브라우저가 해석한 결과입니다.