[HTTP 웹 기본 지식] [URI와 웹 브라우저 요청 흐름]

khyojun·2022년 9월 14일
1

http기본

목록 보기
2/6

본 게시글은 김영한님의 HTTP 웹 기본 지식 강의를 보고 정리한 글입니다.


🔍 URI?

📌 URI

URI는 로케이터(Locator), 이름(Name) 또는 둘 다 추가로 분류가 되어질 수 있다.
https://www.ietf.org.rfc/rfc3986.txt - 1.1.3. URI, URL, and URN

  • Uniform: 리소스 식별하는 통일된 방식
  • Resource: 자원, URI로 식별할 수 있는 모든 것(제한 없음)
  • Identifier: 다른 항목과 구분하는데 필요한 정보

아래의 그림과 같이 URL: 일반적으로 우리가 보게 되는 주소라고 생각하면 되겠고 URN:URL을 이름으로 바꾼 것! 이라고 생각을 하면 될 거같다. 그치만 URN을 사용을 하게 되면 일반적으로 매핑이 어렵다는 단점이 있다.(일므으로만 되어 있으니)

이제 본격적으로 URL, URN에 대해서 알아보자.

📌 URL, URN

  • URL - Locator: 리소스가 있는 위치를 지정
  • URN - Name: 리소스에 이름을 부여
  • 위치는 변할 수 있지만, 이름은 변하지 않는다.
  • urn:isbn:8960777331 (어떤 책의 isbn URN)
  • URN 이름만으로 실제 리소스를 찾을 수 있는 방법이 보편화 되지 않음.
  • 위 그림과 벤 다이어그램 그림 안에 URL, URN이 거의 같이 들어가있는 것으로 볼 수 있는데 그래서 이제부터 URL이라는 단어랑 URI는 같은 것으로 취급을 하며 보겠다.

🔍 본격적인 URL 분석

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

  1. 프로토콜 : https
  2. 호스트명 : www.google.com
  3. 포트 번호 : 443
  4. 패스 : /search
  5. 쿼리 파라미터 : (q=hello&hi=ko) ~~ 뭣도 모르고 썼던 생각이 난다. ~~

1. Scheme(https)

  • 주로 프로토콜을 사용을 한다.

    프로토콜이란? 어떤 방식으로 자원에 접근할 것인가 하는 약속 규칙
    ex) http, https, ftp 등등

  • http는 80 포트, https는 443 포트를 주로 사용, 포트는 생략이 가능하다.

  • https는 http에 보안을 추가한 것이다.(HTTP Secure)

2. userinfo

  • URL에 사용자정보를 포함해서 인증을 한다.
  • 거의 사용을 하지 않는다.

3. host(www.google.com)

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

4. Port(443)

  • 포트(PORT)
  • 접속 포트
  • 일반적으로 생략, 생략시 http는 80 https는 443 으로 설정이 된다.

5. Path(search)

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

6. Query(?q=hello&hl=ko)

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

7. Fragment

  • html 내부 북마크 등에 사용
  • 서버에 전송하는 정보 아님
  • 어떤 url #asdfasdfasdfasdfasdf
  • #부터 시작한 부분이 Fragment임.

웹 브라우저의 요청 흐름!!!!!!!!! (너무 중요 면접때 자주 나오는 단골 질문)

그림으로 한 번 살펴보는 것이 이해하는것에는 제일 편할 거 같아 그림으로 표현을 주로 하겠다.

📌 요청

주로 이렇게 주소를 입력하게 된다면 브라우저에서 HTTP 요청 메시지를 생성한다.

HTTP 요청 메시지(path부터 들어가게 된다)
GET /search?q=hello&hl=ko HTTP/1.1
HOST: www.google.com

위와 같이 생성이 된다.
그렇게 이제 서버로 가기 전 과정들을 또 보게 되면?

📌 껍데기 씌우기

다음과 같이 진행이 되어진다. 이거 그림 TCP/IP에서 계층별로 어떻게 가는지 확인했을때의 그림과 같다는 것을 알 수 있는데, 여기서 보면 socket라이브러리를 통하여 전달을 TCP/IP 연결을 하고, 데이터를 전달하고 패킷을
TCP/IP 패킷을 생성, HTTP 메시지를 포함한 후 이제 서버로 전송을 한다.

여기서 이전에 말했던대로 TCP/IP패킷 껍데기 안에 HTTP 메시지를 넣어서 보내준다.

📌 요청 - 전달

이렇게 전달을 하고 나중에 서버에 도착을 하게 된다면 TCP/IP는 서버에서 다 까서 버린다.
마치 사과 껍질 까고 안에것만 먹는 것처럼 HTTP 메시지만 확인을 하게 된다. 그럼 요청 패킷을 받았으니 응답 패킷도 받아야겠지?

HTTP 응답 메시지

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

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

📌 응답

📌 응답 성공후 렌더링

이렇게 위와 같은 과정을 통하여서 우리가 보는 화면이 제공이 되게 된다.
이 과정에 대해서는 정말로 여러 기술 면접에서 단골로 나오는 질문인만큼 이 과정에 대해서는 머리속으로 넣어놓고 다녀야겠다는 생각이 많이 든다!

profile
코드를 씹고 뜯고 맛보고 즐기는 것을 지향하는 개발자가 되고 싶습니다

0개의 댓글