나의 브을로오그으

#2. [HTTP] URI와 웹브라우저 요청 흐름 본문

HTTP

#2. [HTTP] URI와 웹브라우저 요청 흐름

__jhp_+ 2022. 7. 29. 09:10

목차

- URL

- 웹 브라우저 요청 흐름

 

URI(Uniform Resource Identifier, 리소스 통합 식별자)

 

URI? URL? URN?

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

 

URI가 더 가장 큰개념임. 

모든 자원을 식별하는 식별자다라는 의미. 

URL은 locator(위치)라는 한정된 범위의 자원을 식별하는 것이고, 

URN은 name(이름)이라는 한정된 범위의 자원을 식별하는 것이다.

 

 

구조

foo://example.com:8088/hello/world/httpworld?name=honggildong#nose

 

URL : foo://example.com:8088/hello/world/httpworld?name=honggildong#nose

URN : fooxxxxxx (사실상 별로 않씀. 필요하게 되면 그때 공부)

authority : example.com:8042(도메인 이름임, 이 위치에 IP주소가 와도 됨)

path : /hello/world/httpworld(authority뒤에부터)

query : name=honggildong(?뒤에)

fragment : nose(#뒤에)

 

보통 URN은 않쓰고 URL만 씀. URN은 결국 머냐면, 저 URL을 식별하는 이름임.

근대 보통 URN은 않씀. 주의) http://....... 에서 http가 URN이 아님. 이건 프로토콜 명시하는 scheme일 뿐임.

 

 

URI

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

- Resource : 자원, URI로 식별할 수 있는 모든 것(제한 없음)

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

 

- URL : Uniform Resource Locator

- URN : Uniform Resource Name

 

URL, URN

* URL - Locator : 리소스가 있는 위치를 지정

* URN - Name : 리소스에 이름을 부여

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

* urn:isbn:8969777331 (어떤 책의 isbn URN)

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

* 사실상 URI, URL만 알아도 됨.

 

 

URL 분석하기 예제)

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

[]로 감싸져있는것은 포함해도되고 포함 안해도 된다는 의미임.

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

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

 

hello - Google 검색

HELLO! brings you the latest celebrity & royal news from the UK & around the world, magazine exclusives, fashion, beauty, lifestyle news, celeb babies, ...

www.google.com:443

- 프로토콜(https)

- 호스트명(www.google.com)

- 포트 번호(443)

- 경로(/search)

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

 

URL(scheme)

- 주로 프로토콜 사용

- 프로토콜 : 어떤 방시긍로 자원에 접근할 것인가 하는 약속 규칙

예) http, https, ftp, smtp 등등

- http는 80번 포트임, https는 443번 포트를 주로 사용함, 포트번호는 생략 가능함

(왜냐하면 예약된 포트번호이므로)

- https는 http에 보안 추가(HTTP secure)

 

 

URL(userinfo)

- URL에 사용자정보를 포함해서 인증

- 거의 않씀.

 

 

URL(host)

- 호스트 이름

- 도메인이름 또는 IP주소를 직접 사용가능

 

 

URL(PORT)

- 포트

- 접속 포트

- 예약된 포트번호는 생략 가능 http: 80, https: 443

 

 

URL(Path)

- 리소스 경로(path), 계층적 구조

예)

* /home/file1.jpg

* /members

* /members/100, /items/ipone12 등

 

 

URL(query)

* key=value 형태

* ?로 시작, &로 추가 가능 ?key=valueA&keyB=valueB

* query parameter, query string 등으로 불림, 웹서버에 제공하는 파라미터 문자 형태

(참고로 숫자를 집어넣어도 서버에 넘어가는 데이터 타입은 문자임)

 

 

URL(fragment)

- html 내부 북마크 등에 사용

- 서버에 전송되지 않음.

 

 

웹 브라우저 요청 흐름

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

1. 우리가 웹브라우저 주소창에 다음의 URL을 입력한다.

 

2. 입력된 부분에서 웹브라우저 해당 URL을 아래와같이 변경하고, DNS서버에서 해당 도메인 이름이 있는지 찾는다.

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

 

3. DNS서버에서 해당 도메인 이름을 찾았다면, HTTP 요청 메시지를 생성한다.

https://200.200.200.3:443/search?q=hello&hi=ko

 

HTTP 요청 메시지 형태

GET /search?q=hello&hi=ko HTTP/1.1Host:www.google.com

 

1. 웹 브라우저가 HTTP 메시지 생성

2. SOCKET 라이브러리르 통해 전달

- A: TCP/IP 연결(IP, PORT)

- B : 데이터 전달 (3-ways handshaking)

3. TCP/IP 패킷 생성해서 씌움, HTTP 메시지 포함

 

패킷이 정상적으로 도착했다면?

HTTP 응답 메시지를 보냄.

 

HTTP 응답 메시지 형태

HTTP/1.1 200 OK
Content-Type: text/html;charset=UTF-8
Content-Length:3423

<html>
  <body>...<body>
</html>

content-type은 현재 내가 응답한 데이터의 타입(여기선 html)이고, 그 데이터의 문자열 인코딩 방식은 UTF-8형식으로 쓰여있음을 의미

content-length는 html데이터의 크기를 의미함.

 

이걸 이제 클라이언트에서 응답을 받으면 웹브라우적 그거에 맞게 랜더링을 할것이다~