[네트워크] 2. URI와 웹 브라우저 요청 흐름

[ 🌐2023/05/07 ]

 
2. URI와 웹 브라우저 요청 흐름

 

1. URI
2. 웹 브라우저 요청 흐름

 

 

URI? URL? URN?

1. URI (Uniform Resource Identifier) 

 

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

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

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

 

URL (Uniform Resource Locator)

• 리소스가 있는 위치를 지정

 

URN (Uniform Resource Name)

• 리소스에 이름을 부여
   
  
  

• 위치는 변할 수 있지만, 이름은 변하지 않는다.
• URN 이름만으로 실제 리소스를 찾을 수 있는 방법이 보편화 되어 있지 않다.
• 앞으로 URI를 URL과 같은 의미로 이야기 하겠다!

 

 

---

 
[URL 분석]

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

 
[ URL 전체 문법]

• scheme:/[userinfo@]host[:port][/path][?query][#fragment]
• https://www.google.com:433/search?q=hello&hl=ko

 

• 프로토콜(https)
• 호스트명(www.google.com)
• 포트 번호(443)
• 패스(/search) - 경로
• 쿼리 파라미터(q=hello&hl=ko)

 

---

 

URL scheme

• 주로 프로토콜 사용
• 프로토콜: 어떤 방식으로 자원에 접근할 것인가 하는 약속 규칙

 

예) http, https, ftp 등등

 

• http는 80 포트
• https는 443 포트를 주로 사용
• 포트 생략 가능
• https는 http에 + 보안 추가 (HTTP Secure)

 

---

 

URL userinfo

• URL에 사용자정보를 포함해서 인증
• 거의 사용하지 않음

 

 

---

 

URL host

• 호스트명
• 도메인명 또는 IP 주소를 직접 사용가능

 

---

 

URL PORT

• 포트(PORT)
• 접속 포트
• 일반적으로 생략
• 생략시 http는 80, https는 443

 

---

 

URL path

• 리소스 경로(path)
• 계층적 구조
• 예)
  • /home/file1.jpg
  • /members
  • /members/100, /items/iphone12

 

---

 

URL query

• key=value 형태
• ?로 시작, &로 추가 가능 ?keyA=valueA&keyB=valueB
• query parameter, query string 등으로 불림, 웹서버에 제공하는 파라미터, 문자 형태

 

---

 

URL fragment

 

• fragment
• html 내부 북마크 등에 사용
• 서버에 전송하는 정보 아님
• 잘 사용하지 않음

 

---

 

2. 웹 브라우저 요청 흐름

 

 
 1. HTTP 요청 메시지 전송

1. 웹 브라우저가 HTTP 메시지 생성
2. SOCKET 라이브러리를 통해 전달 / - A : TCP/IP 연결 (IP, PORT) - B : 데이터 전달
3. TCP/IP 패킷 생성, HTTP 메시지 포함

 

 
2. HTTP 요청 메시지 도착

요청 패킷 도착하면

1. 구글 서버가 TCP/IP 패킷을 다까서 버린다.
2. 그리고 HTTP 메시지를 꺼낸 다음 해석한다.
3. 구글 서버에서 HTTP 응답 메시지를 만든다.

 

3. 응답 패킷 도착

응답 패킷 열면? 👉🏻 웹 브라우저 HTML 렌더링 👉🏻 HTML 결과 보게 된다.