김영한 님의 『모든 개발자를 위한 HTTP 웹 기본 지식』 강의를 추천받고 수강하게 되었다. 마침 이전에 내가 HTTP 관련하여 공부하고 싶어서 구매한 『HTTP 완벽 가이드』 책을 같이 참고하면서 기록한다. "웹은 어떻게 동작하는가?" 뿐만 아니라 "왜 이것을 이해하는 것이 중요한가?"를 생각하며 공부할 것이다.
HTTP (Hypertext Transfer Protocol)
WHY?
월드 와이드 웹을 지탱하는 가장 중요한 기술 두 가지는 HTML과 HTTP이다.
이 두 기술은 팀 버너스 리가 웹을 발명할 때 함께 만들어졌다.
이 둘 중 하나라도 빠지면 웹은 성립하지 않는다.
HTTP는 웹의 구성요소들이 서로 대화를 할 때 사용하는 프로토콜이다.
HTTP를 이해한다는 것은 웹이 어떻게 동작하는지를 이해한다는 것이며,
이는 정확한 근거에 기반한 올바른 기술적 판단을 내려야 할 때 큰 도움이 된다.
서버와 클라이언트
네트워크에서 데이터를 주는 컴퓨터를 서버(Server), 데이터를 요청하고 받는 컴퓨터를 클라이언트(Client)라고 했다.
컴퓨터가 데이터를 주고 받는 목적은 무엇일까?
특정한 기능, 즉 서비스를 제공하고 사용하기 위한 것이다. 따라서 서비스를 제공하는 쪽이 서버이고, 서비스를 요청하고 받는(사용하는) 쪽을 고객, 클라이언트라고 부른다.
사람들의 필요, 욕구를 채우는 가치를 제공할 때 두 가지 형태로 나뉜다. 물리적 형태를 가진 제품(product)를 생산하는 것 그리고 물리적인 형태 없이 사람의 노동을 통해 제공하는 서비스(service)로 구분한다. 하지만 IT에서는 하드웨어와 소프트웨어가 함께 동작하기 때문에 제품과 서비스를 구분짓기가 어렵다. 제품과 서비스를 구별 않고 IT를 기반으로 경험을 통해 가치를 제공하는 것을 프로덕트 Product라고 한다.
클라이언트는 서비스가 필요할 때 네트워크에 접속해 서버로 요청하면 되지만, 서버는 언제 어떤 클라이언트가 요청을 해도 서비스를 제공할 수 있도록 준비하고 있어야 한다.
서버와 클라이언트는 성능과 상관없이 역할에 따라 구분된다. 한 대의 서버에 다수의 클라이언트가 접속하여 서비스를 이용할 수 있는 방식을 서버 클라이언트 구조 (1:N)라고 한다. 팀 버너스 리는 HTML로 만든 웹페이지를 컴퓨터와 컴퓨터가 인터넷을 통해 주고 받을 수 있도록 웹 브라우저와 웹 서버를 개발했다.
웹 브라우저는 웹 페이지를 보기 위해 사용하는 애플리케이션으로 간단히 Browser 브라우저라고도 한다. 웹 서버는 웹 페이지를 저장하고 웹 브라우저에게 웹 페이지를 보내주는 애플리케이션 또는 그 애플리케이션을 실행하는 컴퓨터를 말한다.
서버-클라이언트 구조를 사용함으로써 월드 와이드 웹은 웹 서버가 저장하고 있는 웹 페이지를 다수의 웹 브라우저가 볼 수 있는 형태의 서비스가 되었다.
웹 콘텐츠는 웹 서버에 존재한다. 클라이언트는 서버에게 HTTP 요청을 보내고, 서버는 요청된 데이터를 HTTP 응답으로 돌려준다. 웹 브라우저는 서버에게 HTTP 객체를 요청하고 사용자의 화면에 보여준다.
웹 서버는 웹 리소스를 관리하고 제공한다. 이는 웹에 콘텐츠를 제공하는 모든 것이라 생각하면 된다.
웹 페이지는 여러 객체로 이루어질 수 있다.
애플리케이션은 보통 하나의 작업을 수행하기 위해 여러 HTTP 트랜잭션을 수행한다. 웹 브라우저는 시각적으로 풍부한 웹페이지를 가져올 때 대량의 HTTP 트랜잭션을 수행한다. 페이지 레이아웃을 서술하는 HTML 프레임을 한 번의 트랜잭션으로 가져온 뒤, 이미지, 그래픽 조각 등을 가져오기 위해 추가로 HTTP 트랜잭션들을 수행한다. 이 리소스들이 존재하는 서버는 각각 다른 곳에 위치할 수도있다. 즉, 웹페이지는 보통 하나의 리소스가 아닌 리소스의 모음이다.
URI (Uniform Resource Identifier)
웹 서버의 리소스는 각자 이름을 갖고 있기 때문에, 클라이언트는 관심 있는 리소스를 지목할 수 있다. 이를 통합 자원 식별자(Uniform Resource Identifier), 혹은 URI로 불린다. 이는 인터넷의 우편물 주소 같은 것으로, 정보 리소스를 고유하게 식별하고 위치를 지정할 수 있다.
HTTP는 주어진 URI로 객체를 찾아온다.
URI는 로케이터(Locator), 이름(Name) 또는 둘다 추가로 분류될 수 있다.
Uniform : 리소스를 식별하는 통일된 방식
Resource : 자원, URI로 식별할 수 있는 모든 것 (제한 없음)
Identifier : 다른 항목과 구분하는 데에 필요한 정보
URL (Uniform Resource Locator)
리소스 식별자의 가장 흔한 형태, URL은 특정 서버의 한 리소스에 대한 구체적인 위치를 서술한다. 리소스가 정확히 어디에 있고 어떻게 접근할 수 있는지 분명히 알려준다.
요즘에는 대부분의 인터넷 자원은 URL을 사용하여 식별하고 접근한다.
URN (Uniform Resource Name)
리소스의 위치에 영향 받지 않는 유일무이한 이름 역할을 한다.
리소스가 그 이름을 변하지 않게 유지하는 한, 여러 종류의 네트워크 접속 프로토콜로 접근해도 문제없다.
이는 인터넷 자원이 물리적인 위치나 프로토콜에 따라 다양한 방식으로 접근되기 때문. URN은 개념적으로는 아직도 유효하지만, 현실적으로는 URL이 더 널리 사용되고 있음.
URL 기본 형식
scheme://[userinfo@]host[:port][/path][?query][#fragment]
- 프로토콜(https)
- 호스트명(www.google.com)
- 포트번호(443) 생략 가능!
- 패스(/search)
- 쿼리 파라미터(q=hello&hl=ko)
scheme 스키마
scheme://[userinfo@]host[:port][/path][?query][#fragment]
- 주어진 리소스에 어떻게 접근하는지 알려주는 중요한 정보.
- URL을 해석하는 애플리케이션이 어떤 프로토콜을 사용하여 리소스를 요청해야 하는지 알려준다.
- 주로 프로토콜을 사용한다
- 프로토콜: 어떤 방식으로 리소스에 접근할 것인가 하는 약속, 규칙.
- http, https, ftp 등
- https는 http에 보안을 추가한 것 (HTTP Secure)
userinfo
scheme://[userinfo@]host[:port][/path][?query][#fragment]
- URL에 사용자 정보를 포함해서 인증
- 거의 사용하지 않는다.
host & port
scheme://[userinfo@]host[:port][/path][?query][#fragment]
- 애플리케이션이 인터넷에 있는 리소스를 찾으려면, 리소스를 호스팅하고 있는 장비와 그 장비 내에서 리소스에 접근할 수 있는 서버가 어디에 있는지 알아야 한다.
- URL의 호스트와 포트 컴포넌트는 그 두가지를 제공해준다.
- 호스트는 접근하려고 하는 리소스를 가지고 있는 인터넷상의 호스트 장비를 가리킨다. 해당 값은 호스트 명이나 IP 주소로 제공한다.
- 포트는 서버가 열어놓은 네트워크 포트를 가리킨다.
path
scheme://[userinfo@]host[:port][/path][?query][#fragment]
- URL의 경로 컴포넌트는 리소스가 서버의 어디에 있는지 알려준다.
- 경로는 계층적 파일 시스템 경로와 유사한 구조를 가진다.
- /home/file1.jpg
- /members
- /members/100, /items/iphone12
- 경로는 서버가 리소스의 위치를 찾는데 사용하는 정보다. HTTP URL에서 경로 컴포넌트는
/문자를 기준으로 경로조각으로 나뉜다. 각 경로 조각은 자체만의 파라미터 컴포넌트를 가질 수 있다.
query parameter
scheme://[userinfo@]host[:port][/path][?query][#fragment]
- 많은 스키마가 객체에 대한 호스트 및 경로 정보만으로는 리소스를 찾지 못한다. 프로토콜 파라미터가 없으면 다른 한편에 있는 서버는 그 요청을 잘못 처리하거나 처리하지 않을 것이다.
- key=value 형태
- ?로 시작, &로 추가 가능 ?keyA=valueA&keyB=valueB
- query parameter, query string 등으로 불림, 웹서버에 제공하는 파라미터, 문자 형태
fragment
scheme://[userinfo@]host[:port][/path][?query][#fragment]
- html 같은 리소스 형식들은 본래의 수준보다 더 작게 나뉠 수 있다. 리소스에 대한 URL은 텍스트 문서 전체를 가리키겠지만 이상적으로는 리소스 안에 있는 특정 절을 가리킬 수 있어야 한다.
#문자에 이어서 나온다- html 내부 북마크 등에 사용된다.
- 서버에 전송하는 정보가 아님.URN (Uniform Resource Name)
- URN은 콘텐츠를 이루는 한 리소스에 대해, 그 리소스의 위치에 영향을 받지 않는 유일무이한 이름 역할을 한다. 이 위치 독립적인 URN은 리소스를 여기저기로 옮기더라도 문제 없이 동작한다.
- 리소스각 그 이름을 변하지 않게 유지하는 한, 여러 종류의 네트워크 접속 프로토콜로 접근해도 문제가 없다.
- 이름만으로 실제 리소스를 찾을 수 있는 방법이 보편화 되어 있지 않음
- 통상적으로 URI와 URL을 같은 의미로 사용함.
URL과 HTTP
웹 브라우저를 설치한 컴퓨터가 URL을 알면 원하는 웹페이지가 있는 웹 서버를 찾아 접속할 수 있게 되었다.
웹 브라우저를 설치한 여러 대의 컴퓨터가 동시에 웹 서버에 접속하여 웹 페이지를 볼 수 있도록 웹 브라우저와 웹 서버 간의 통신 규칙인 HTTP 프로토콜이 만들어졌고 이로써 전 세계의 웹 브라우저와 웹 서버가 인터넷에서 HTTP 프로토콜에 따라 HTML 파일을 전송할 수 있는 시스템이 만들어진 것이다.
1990년 팀 버너스리는 자신의 컴퓨터와 동료의 컴퓨터에 자신이 개발한 *웹 브라우저를 설치하고 info.cern.ch(세계 최초의 웹사이트)라는 URL을 가진 **웹 서버와 성공적으로 통신을 하였고, 1991년 세계 최초의 웹페이지를 공개했다.
*. 세계 최초의 웹 브라우저
팀 버너스리가 개발한 웹 브라우저의 명칭이 `World Wide Web`이었으나 이후 웹 서비스와 구분하기 위해 넥서스로 이름을 변경했다.
**. 세계 최초의 웹 서버
세계 최초의 웹 서버는 1990년 CERN에서 만든 CERN httpd (W3C httpd)이다. CERN httpd는 NeXT 컴퓨터에서 동작하였다. NeXT 컴퓨터는 스티브 잡스가 1985년에 설립한 NeXT라는 회사에서 만든 컴퓨터이다. 스티브 잡스가 애플에서 쫓겨난 이후 만든 넥스트(NeXT) 컴퓨터가 웹서버로 사용되었다. 본체에는 다음과 같이 적혀 있다. "이 기계는 서버입니다. 끄지 마세요!"
웹 브라우저의 개발과 보급
팀 버너스리가 만든 웹 브라우저는 연구소나 대학에 설치되어 있는 대형, 고성능의 컴퓨터에서만 사용이 가능했기에 전문가가 아닌 일반 사용자들은 접근하기 어려웠다.
1992년 웹의 가능성을 본 한 대학생이 개인용 컴퓨터를 사용하는 일반인도 웹을 사용할 수 있도록 모자이크(Mosaic)라는 웹 브라우저를 개발한다. 그 대학생은 바로 넷스케이프 창업자로 유명한 마크 앤드리슨*(Marc Andreesen)!
팀 버너스리가 만든 웹 브라우저가 텍스트 위주였던 것과 달리 모자이크는 이미지를 표시할 수 있는 최초의 그래픽 웹 브라우저, 즉 최초의 GUI(Graphical User Interface) 방식의 브라우저였다. 또한 키보드의 명령어가 아닌 마우스의 포인트 앤 클릭(Point and Click)만으로 웹을 사용할 수 있게 만들었다. 인터넷에서 마우스 클릭만으로 이미지를 볼 수 있는 시대를 연 것.
*. 마크 앤드리슨은 벤 호로위츠와(Ben Horowitz) IT 벤처 투자 전문 회사인 앤드리슨 호로위츠(Andreessen Horowitz)를 공동 설립하여 페이스북, 트위터, 인스타그램, 에어비앤비 등 수많은 IT 스타트업에 투자하여 큰 성공을 거둔 투자자이기도 하다.
모자이크는 넷스케이프 내비게이터(Netscape Navigator)로 발전하였고, 마이크로소프트는 모자이크의 저작권료를 지불하고 이를 기반으로 인터넷 익스플로러(internet explorer)를 만들게 된다.
1995년 출시한 윈도우(Windows) 95에 인터넷 익스플로러 브라우저를 표준 탑재하면서 인터넷의 이용자는 더욱 확대되었다.
🤔💭
HTML을 처음 배우기 시작했을 때 이 공간에 흔적을 남길 수 있다는 것에 스스로 감명 깊었던 기억이 난다. 팀 버너스 리가 전달해준 모두를 위한 웹에 대한 가치관을 나도 이어가고 싶다!
📚 『HTTP 완벽 가이드』
쉽게 이해하는 네트워크 3. 인터넷과 월드 와이드 웹(ft. 팀 버너스 리의 위대한 결단)
ChatGPT🤖
'Network' 카테고리의 다른 글
| DNS Domain Name System을 깊게 알아보자 (0) | 2023.09.24 |
|---|---|
| 2. 애플리케이션과 플랫폼, 웹 서비스 (2) | 2023.08.24 |