ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • 01. WEB과 URI, URL
    네트워크 2022. 9. 2. 00:01

     

     

     

    웹사이트 동작 원리

    우리가 인터넷을 사용할 때는 어떤 일이 일어나고 있을까요?

     

    한번 네이버를 들어가 봅시다.

     

     

    1초도 안 돼서 들어가지는 것 같네요.

    그리고는 다양한 배너, 카테고리들이 저희를 반겨줍니다.

     

    우리는 www.naver.com 이라는 주소를 입력했을 뿐인데 어떻게 화면이 보이는 걸까요?

     

     

     

    출처) https://all-young.tistory.com/21

     

     

    사실은 이런 복잡한 과정을 거쳐 우리에게 페이지를 전달하게 됩니다.

     

    하나씩 천천히 알아보겠습니다.

    먼저, 개념부터 알아봅시다.

    • Web Client : 사용자, 정확하게는 웹브라우저를 뜻합니다. Chrome, Edge, Firefox 등이 있겠네요.

    • DNS(Domain Name System) :  "www.naver.com"라는 주소를 223.~ 이라는 아이피로 변환하는 역할을 합니다.

    • Web Server : 우리가 흔히 아는 서버입니다.
                            정확히는 사용자에게 보여줄 페이지, 정보를 전달하는 역할을 합니다.

    • WAS(Web Application Server) : 웹 서버와 DB 사이에서 중간 역할을 합니다. 
                                                           데이터를 가공하거나 연결을 관리합니다.

    • DB(Database) : 실제 데이터가 저장된 공간입니다. 

     

     

    다음은 과정입니다.

    1. 사용자가 주소창에 www.naver.com를 입력합니다.

    2. 웹 브라우저가 DNS에게 www.naver.com를 요청합니다.

    3. DNS가 웹 브라우저에게 사이트의 IP주소를 응답합니다.

    4. 웹 브라우저가 웹 서버에게 IP 주소를 이용해 html 문서를 요청합니다.

    5. 웹 서버는 WAS와 DB에서 데이터를 가공하길 기다립니다.

    6. 가공이 완료되면 결과물을 웹 서버로 전달합니다.

    7. 웹 서버는 웹 브라우저에게 html 문서 결과를 응답합니다.

    8. 웹 브라우저는 화면에 페이지를 출력합니다.

     

    쉽게 말하면 "www.naver.com" 라는 주소를 입력하면 IP 주소를 반환받고,

    내부적으로 IP주소로 다시 요청을 하면 페이지 처리를 거쳐

    우리에게 다시 전달되어 화면을 출력하게 됩니다.

     

     

    우리가 사용하는 대부분의 사이트는 이러한 과정을 거치게 됩니다.

     

     

     

    URI / URL

    웹사이트의 동작 원리를 보고나니 궁금해지는 게 많이 생기네요.

    네트워크에 대해서 한번 검색해보겠습니다.

     

     

     

     

     

    아까랑은 주소가 많이 달라졌네요.

    search.naver.com/search.naver 까지는 알겠는데,

    그 뒤로 알 수 없는 단어들이 많이 써있습니다.

     

     

     

    search.naver.com/search.naver 는 우리가 어떻게 아는 걸까요?

    그 이유는 URL이기 때문입니다.

     

    URL(Uniform Resource Location) :  네트워크 상에서 자원이 실제로 어디 있는지를 알려주기 위한 규약입니다.
    URI(Uniform Resource Identifier) : 자원의 위치뿐만 아니라 자원의 고유 식별자가 됩니다.

     

    풀어서 보겠습니다.

    search.naver.com/search.naver은 URL이기 때문에 자원이 실제 어디 있는지 알려준다고 했습니다.

    이 말은 이 주소에 "검색 화면 페이지 파일"이 실제 존재한다는 말이 됩니다.

     

     

    그 뒤의 문장은 자원의 고유 식별자, 즉 URI가 됩니다.

    네이버 내부의 DB에 데이터가 저장되어 있고,

    거기에서 '네트워크'에 해당하는 데이터만 모아 가져온 것이기 때문입니다.

     

     

    정확하게는

    "https://search.naver.com/search.naver?where=nexearch&sm=top_hty&fbm=1&ie=utf8&query=네트워크"

    가 URI이고,

     

    "https://search.naver.com/search.naver"

    가 URL입니다.

     

    즉, URI가 URL을 포함(URI ⊃ URL)한 개념인 것입니다.

    일반적으로 우리는 주소를 URL이라고 부르지만 사실 URI가 맞는 것입니다.

     

     

    출처) https://inpa.tistory.com/

     

    URI의 구조는 위와 같습니다.

     

    • Protocol : 통신 방식을 말합니다. 
                        file, http, https 등 다양한 방식이 있지만 나중에 알아보도록 하겠습니다.

    • Host(Domain) : 웹 페이지, 이미지, 동영상 등 파일이 위치한 웹 서버, 도메인 또는 IP를 말합니다.
                                일반 사이트들 뿐만 아니라 심지어 우리가 사용하는 핸드폰, 컴퓨터도 호스트입니다.

    • Port : 웹 서버에 접속하기 위한 통로입니다.
                네트워크 통신을 하는 모든 프로그램은 포트를 할당받게 됩니다.

    • Path(URL-Path) : 웹 서버의 루트 디렉토리로부터 실제 파일이 위치하기까지의 경로입니다.
                                   \Users\de_Shaw\Desktop라면, 바탕화면 파일들을 뜻합니다.

    • Query String : 정보를 받기 위해 사용자가 웹 서버에 추가적으로 제공하는 질문입니다.

     

    Host와 Port에 대해 추가로 말해보자면

    Host는 "www.naver.com"과 같은 주소, 즉 IP 주소가 됩니다.

    인터넷에 연결된 모든 기기는 IP 주소를 가지고 있으며 서로의 IP 주소를 알아야만 통신할 수 있습니다.

     

    Port는 인터넷과 연결된 프로그램입니다.

    카카오톡의 포트번호가 6050일 때,

    192.168.0.1의 프로그램들 중에서 192.168.0.1:6050 으로 접근해야만 카톡에 접근할 수 있는 것입니다.

     

     

     

     

     

    참고

    https://all-young.tistory.com/20?category=915653 

    https://aal-izz-well.tistory.com/entry/%ED%8F%AC%ED%8A%B8%EC%99%80-%EC%86%8C%EC%BC%93%EC%9D%98-%EC%B0%A8%EC%9D%B4-%EB%B0%8F-%ED%98%B8%EC%8A%A4%ED%8A%B8

    https://velog.io/@torang/URL%EA%B3%BC-URI%EC%9D%98-%EC%B0%A8%EC%9D%B4%EC%A0%90

    https://hanamon.kr/%EB%84%A4%ED%8A%B8%EC%9B%8C%ED%81%AC-%EA%B8%B0%EB%B3%B8-url-uri-urn-%EC%B0%A8%EC%9D%B4%EC%A0%90/

     

     

     

     

     

     

     

    https://hanamon.kr/%EB%84%A4%ED%8A%B8%EC%9B%8C%ED%81%AC-%EA%B8%B0%EB%B3%B8-url-uri-urn-%EC%B0%A8%EC%9D%B4%EC%A0%90/

    '네트워크' 카테고리의 다른 글

    06. OSI 7계층  (0) 2022.09.04
    05. 프로토콜  (0) 2022.09.02
    04. HTTP  (0) 2022.09.02
    03. 쿠키와 세션  (0) 2022.09.02
    02. 웹 용어 정리  (0) 2022.09.02

    댓글

Designed by Tistory.