[HTTP/네트워크] 기초

Jelkov Ahn·2021년 10월 18일

DNS PORT URI http ip url 도메인 클라이언트

HTTP / 네트워크

목록 보기

1/11

Achievement Goals

클라이언트-서버 콘셉트를 이해할 수 있다.
- 클라이언트-서버 아키텍처를 이해할 수 있다.
- HTTP를 이용한 클라이언트-서버 통신을 이해할 수 있다.
- API의 개념을 이해할 수 있다.
브라우저의 작동 원리를 이해할 수 있다.
- 보이지 않는 곳의 통신을 이해할 수 있다.
  - URL과 URI의 차이를 이해할 수 있다.
  - IP 주소와 PORT에 대해 이해할 수 있다.
  - DNS와 IP 주소의 관계를 설명할 수 있다.
  - 크롬 브라우저의 에러 메시지를 통해 문제를 파악할 수 있다.
- 보이는 곳의 통신을 이해할 수 있다.
  - AJAX의 개념을 이해할 수 있다.
  - SSR과 CSR의 차이를 이해할 수 있다.
  - CORS의 개념을 이해할 수 있다.
HTTP messages의 구조를 설명할 수 있다.
- HTTP의 동작 방식을 이해할 수 있다.
- HTTP requests와 responses를 구분할 수 있다.
- HTTP의 응답 메시지를 찾아볼 수 있다.
Chrome Network Tab을 이해할 수 있다.
- Chrome Network Tab 사용 방법을 익히고 사용할 수 있다.
Self Guided Lessons (Advanced)
- How the internet works
- DNS

클라이언트-서버 아키텍처

클라이언트-서버 아키텍쳐 (2tier-아키텍쳐): 리소스가 존재하는 곳/ 리소스를 사용하는 앱을 분리시키는 것!!

리소스를 사용하는 앱: 클라이언트
리소스를 제공하는 곳: 서버

3tier-아키텍쳐: 리소스를 사용하는 앱/ 리소스를 전달해주는 앱/ 리소스 저장공간

프론트엔드 & 백엔드

프로트엔드 : 클라이언트 앱 (사용자와 상호작용 중시)
백엔드: 서버 앱 (시스템설계/ 권한관리/ 서버 전달)

클라이언트 서버종류

클라이언트: 웹/ 앱
서버: 웹서버/ 파일서버/ 메일서버/ 데이터베이스 서버

HTTP를 이용한 클라이언트-서버 통신과 API

요청과 응답은 한쌍이다.: 클라이언트-서버 아키텍처에서는 서버 마음대로 클라이언트에 리소스를 전달하지 않습니다.

간혹 서버에서 일방적으로 클라이언트에 정보를 전달하는 경우 : 쿠기/ 팝업/ Warning 메세지

프로토콜 통신규약: 프로토콜은 통신규약이다. 클라이언트에서 올바른 요청을 해야 응답이 올수 있다.

HTTP 프로토콜: 웹 애프리케이션 아키텍쳐에서 사용해서 클라이언트와 서버가 대화를 나눌수 있다.

프로토콜의 종류

OSI 7 Layers
1.물리
2. 데이터링크
3. 네트워크 계층

4. 전송 계층

프로토콜 이름	설명
TCP	HTTP,FTP 통신의 등의 근간이 되는 인터넷 프로토콜
UDP	(양방향의 TCP와 다르게) 단뱡향으로 작동하는 훨씬 더 단순하고 빠르지만, 신뢰성이 낮은 인터넷 프로토콜

세션 계층
표현 계층

7. 응용 계층

프로토콜 이름	설명
HTTP	웹에서 HTML,JSO 등의 정보를 주고받는 프로토콜
HTTPS	HTTP에서 보안이 강화된 프로토콜
FTP	파일 전송 프로토콜
SMTP	메일을 전송하기 위한 프로토콜
SSH	CLI 환경의 원격 컴퓨터에 접속하기 위한 프로토콜
RDP	Windows 계열의 원격 컴퓨터에 접속하기 위한 프로토콜
WebSocket	실시간 통신, Push 등을 지원하는 프로토콜

API(Application Programming Interface)

서버는 클라이언트에게 리소스를 잘 활용할 수 있도록 인터페이스(interface)를 제공해줘야 합니다. 이것을 API라고 합니다.

즉, API문서를 작성해야 클라이언트가 이를 활용할 수 있습니다.

ex) API서버가 제공하는 적절한 URL로 디자인해서,

보통 인터넷에 있는 데이터를 요청할 때에는 HTTP라는 프로토콜을 사용하며, 주소(URL, URI)를 통해 접근할 수 있게 됩니다.

HTTP API 디자인을 잘 하는 방법

리소스와 관련된 행동(CRUD; create/read/update/delete)
ex) 사용자 관리 API

요청	적절한 메소드
Read	GET
Create	POST
Update	PUT 또는 PATCH
Delete	DELETE

브라우저의 작동 원리 (보이지 않는 곳)

URL과 URI

URL(Uniform Resource Locator)
네트워크 상에서 웹페이지, 이미지, 동영상등의 파일이 위치한 정보를 나타냅니다.
URL의 구분: scheme, hosts, url-path
file://127.0.0.1/Users/username/Desktop/
http://www.google.com:80/search?q=JavaScript
URI(Uniform Resource Identifier)
일반적으로 URL의 기본 요소인 scheme, hosts, url-path에 더해 query, bookmark를 포함합니다. query는 웹 서버에 보내는 추가적인 질문입니다.

URI>URL
브라우저의 검색창을 클릭하면 나타나는 주소가 URI입니다. URI는 URL을 포함하는 상위개념입니다.

부분	명칭	설명
file://, http://, https://	scheme	통신 프로토콜
127.0.0.1, www.google.com	hosts	웹 페이지, 이미지, 동영상 등의 파일이 위치한 웹 서버, 도메인 또는 IP
:80, :443, :3000	port	웹 서버에 접속하기 위한 통로
/search, /Users/username/Desktop	url-path	웹 서버의 루트 디렉토리로부터 웹 페이지, 이미지, 동영상 등의 파일이 위치까지의 경로
q=JavaScript	query	웹 서버에 전달하는 추가 질문

IP와 포트

네트워크 상에서 특정 PC를 나타내는 IP address(Internet Protocol address, IP 주소)와 그 주소에 진입할 수 있는 정해진 통로, PORT(포트)

IP
인터넷에 연결된 모든 PC는 IP 주소체계를 따라 네 덩이의 숫자로 구분됩니다.
이렇게 네 덩이의 숫자로 구분된 IP 주소체계를 IPv4라고 합니다. IPv4는 Internet Protocol version 4의 줄임말로, IP 주소체계의 네 번째 버전을 뜻합니다.
IPv4는 각 덩어리마다 0부터 255까지 나타낼 수 있습니다.
- localhost, 127.0.0.1 : 현재 사용 중인 로컬 PC를 지칭합니다.
- .0.0.0, 255.255.255.255 : broadcast address, 로컬 네트워크에 접속된 모든 장치와 소통하는 주소입니다.
PORT
로컬 PC의 IP 주소인 127.0.0.1 뒤에 :3000과 같은 숫자가 표현됩니다.
이 숫자는 IP 주소가 가리키는 PC에 접속할 수 있는 통로(채널)을 의미합니다.
포트 번호
- 22 : SSH
- 80 : HTTP
- 443: HTTPS
- 더 많은 포트 번호 확인하기

이미 정해진 포트 번호라도, 필요에 따라 자유롭게 사용할 수 있습니다. 잘 알려진 포트의 경우 URI 등에 명시하지 않지만, 그 외의 잘 알려지지 않은 포트(:3000과 같은 임시 포트)는 반드시 포함해야 합니다.

도메인과 DNS

도메인 (naver.com/ google.com)

터미널에서 도메인 이름을 통해 IP 주소를 확인하는 명령어 nslookup으로 naver의 IP 주소를 확인이 가능

nslookup naver.com
서버:    UnKnown
Address:  10.128.128.128

권한 없는 응답:
이름:    naver.com
Addresses:  223.130.195.95
          223.130.195.200
          223.130.200.104
          223.130.200.107  // 이 4개의 주소로 네어비로 접속이 가능하다.

DNS는 Domain Name System의 줄임말로 호스트의 도메인 이름을 IP 주소로 변환하거나 반대의 경우를 수행할 수 있도록 개발된 데이터베이스 시스템입니다.

크롬 브라우저 에러 읽기

chrome://network-errors/

출처 : 코드스테이츠

Jelkov Ahn

끝까지 ... 가면 된다.

다음 포스트

[HTTP/네트워크] 기초