<순서>
- 인터넷은 어떻게 작동될까요?
- HTTP는 무엇일까요?
- 브라우저와 동작 원리
- 도메인 네임은 무엇일까요?
- DNS와 작동원리
- 호스팅은 무엇일까요?
1. 인터넷은 어떻게 작동될까요?
- 인터넷 변화 양상
① 컴퓨터 ↔ 컴퓨터
② 컴퓨터 ↔ 라우터 ↔ 컴퓨터
③ 컴퓨터 ↔ 라우터 ↔ 라우터 ↔ 컴퓨터
④ 컴퓨터 ↔ 라우터 ↔ 모뎀 ↔ 전화 시설 ~
⑤ 컴퓨터 ↔ 라우터 ↔ 모뎀 ↔ 전화 시설 ↔ ISP (↔ ISP) ↔ 전화 시설 ↔ 모뎀 ↔ 라우터 ↔ 컴퓨터
인터넷은
1:1 연결 => 多:多 연결 => 라우터 연결 과 같은 방식으로 발전했고, 아래는 라우터 연결의 예이다.
이후 라우터와 라우터를 연결하면서 점점 망의 크기를 키운것이 인터넷이다.
최종적으로는, 인터넷 서비스 제공 업체(ISP, Internet Service Provider)에 연결되어야 한다.
ISP는 모두 함께 연결되는 몇몇 특수한 라우터를 관리하고 다른 ISP의 라우터에도 액세스할 수 있는 회사이다. 우리나라에는 SK텔레콤, KT, LG유플러스 등이 있다.
인터넷은 이러한 방식으로 연결되어 서로 통신을 한다.
2. HTTP는 무엇일까요?
HTTP란? Hyper Text Transfer Protocol의 두문자어로, 인터넷에서 데이터를 주고받을 수 있는 프로토콜
(HTTPS : HTTP +Security)
한국어로 표기한다면, 일종의 통신 규약(약속)이다.
서버의 역할은 "요청에 대한 응답을 보내준다는 것"이다.
- 요청 : client -> server
- 응답 : server -> client
Request Method (요청의 종류)
- GET : 자료를 요청할 때 사용
- POST : 자료의 생성을 요청할 때 사용
- PUT : 자료의 수정을 요청할 때 사용
- DELETE : 자료의 삭제를 요청할 때 사용
요청코드 예시 및 설명 주석
GET https://skmouse.tistory.com HTTP/1.1 // 시작줄
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) ...//헤더 : 요청에 대한 정보
Upgrade-Insecure-Requests: 1 //본문 : 그냥 내용.
응답 Response Status Code (상태 코드)
상태 코드에는 굉장히 많은 종류가 있다. 모두 숫자 세 자리로 이루어져 있으며, 아래와 같이 크게 다섯 부류로 나눌 수 있다.
- 1XX (조건부 응답) : 요청을 받았으며 작업을 계속한다.
- 2XX (성공) : 클라이언트가 요청한 동작을 수신하여 이해했고 승낙했으며 성공적으로 처리했음을 가리킨다.
- 3XX (리다이렉션 완료) : 클라이언트는 요청을 마치기 위해 추가 동작을 취해야 한다.
- 4XX (요청 오류) : 클라이언트에 오류가 있음을 나타낸다.
- 5XX (서버 오류) : 서버가 유효한 요청을 명백하게 수행하지 못했음을 나타낸다.
응답코드 예시 및 설명
HTTP/1.1 200 OK // 시작줄: 버전 상태코드 상태메시지로 구성되어 있다. 200은 성공적인 요청
Connection: keep-alive // 헤더 : 응답에 대한 정보
Content-Encoding: gzip
Content-Length: 35653
Content-Type: text/html; // 헤더 끝.
<!DOCTYPE html><html lang="ko" data-reactroot=""><head><title...
//응답에는 대부분의 경우 본문이 있다.
//보통 데이터를 요청하고 응답 메시지에는 요청한 데이터를 담아서 보내주기 때문이다.
//응답 메시지에 HTML이 담겨 있는데 이 HTML을 받아 브라우저가 화면에 렌더링한다.3. 브라우저와 동작 원리
브라우저의 구성요소
- 사용자 인터페이스
- 브라우저 엔진 : 사용자 인터페이스와 렌더링 엔진 사이의 동작을 제어.
- 렌더링 엔진 : 요청한 콘텐츠를 표시.
- 통신 : HTTP 요청과 같은 네트워크 호출
- UI 백엔드 : OS 사용자 인터페이스 체계를 사용.
- 자바스크립트 해석기
- 자료저장소
렌더링 엔진
사용자가 요청한 내용을 서버로부터 받아 브라우저 화면에 표시하는 역할을 함
(1) 표시할 수 있는 것 : HTML 및 XML 문서 그리고 이미지를 표시할 수 있음
(2) 확장 : 플러그인이나 브라우저마다 확장 기능을 이용해 PDF와 같은 유형도 표시할 수 있음
(3) 종류 : 사파리, 크롬은 웹킷(Webkit)엔진에서 Blink로 변화. / 파이어폭스는 모질라에서 만든 게코(Gecko)엔진, EdgeHTML은 윈도우 10의 기본 브라우저인 마이크로소프트 엣지의 엔진이다.
p.s. IOS 한정으로 웹킷을 사용(웹킷2), 나머지는 Blink로 구글은 갈아탔다고 한다.
(4) 동작원리
기본적인 동작 과정
HTML 문서를 파싱 > 브라우저 화면에 랜더링하기위해 다루기 쉬운 구조로 바꿈
> css파일 파싱 > 렌더트리 구축 > 렌더트리 배치 > 렌더트리 그리기
- 스타일 정보와 HTML 표시 규칙은 렌더 트리라고 부르는 또 다른 트리를 생성함.
- 화면에 표시하기위한 위치, 크기, 그리기 순서 저장을 위한 별도의 트리 구조(렌더트리)가 필요함.
- 렌더링 엔진은 좀 더 나은 사용자 경험을 위해 가능하면 빠르게 내용을 표시하는데 모든 HTML을 파싱할 때까지 기다리지 않고 배치와 그리기 과정을 시작한다. 네트워크로부터 나머지 내용이 전송되기를 기다리는 동시에 받은 내용의 일부를 먼저 화면에 표시하는 것이다.
- 대표적으로 웹킷의 동작과정을 도식화 한 것이다.
4. 도메인 네임은 무엇일까요?
IP란?
인터넷에 연결되어 있는 장치(컴퓨터, 스마트폰, 타블릿, 서버 등등)들은 각각의 장치를 식별할 수 있는 주소를 가지고 있는데 이를 ip라고 한다. 예) 115.68.24.88, 192.168.0.1
도메인(domain)이란?
ip는 사람이 이해하고 기억하기 어렵기 때문에 이를 위해서 각 ip에 이름을 부여할 수 있게 했는데, 이것을 도메인이라고 한다.
- opentutorials.org -> 115.68.24.88
- naver.com -> 220.95.233.172
- daum.net -> 114.108.157.19
도메인 네임 시스템 (Domain Name System, DNS) 은 호스트의 도메인네임 (www.example.com)을 네트워크주소(192.168.1.0)로 변환하거나, 그 반대의 역학을 수행하는 시스템이다.
그렇다면 그 변환 작동의 원리를 살펴보자.
5. DNS와 작동원리
① 신뢰할 수 있는 DNS
- 개발자가 퍼블릭 DNS 이름을 관리하는 데 사용하는 업데이트 메커니즘을 제공한다.
- 이를 통해 DNS 쿼리에 응답하여 도메인 이름을 IP 주소로 변환한다.
- 신뢰할 수 있는 DNS는 도메인에 대해 최종 권한이 있다.
- 재귀적 DNS 서버에 IP 주소 정보가 담긴 답을 제공할 책임이 있다.
② 재귀적 DNS
- 보통 클라이언트는 신뢰할 수 있는 DNS 서비스에 직접 쿼리를 수행하지 않는다.
- 해석기 또는 재귀적 DNS 서비스라고 알려진 다른 유형의 DNS 서비스에 연결하는 경우가 일반적이다.
- 재귀적 DNS 서비스 는 호텔 컨시어지와 같은 역할을 한다.
- DNS 레코드를 소유하고 있지 않지만 사용자를 대신해서 DNS 정보를 가져올 수 있는 중간자의 역할을 한다.
- 일정 기간 동안 캐시된 또는 저장된 DNS 레퍼런스를 가지고 있는 경우, 소스 또는 IP 정보를 제공하여 DNS 쿼리에 답을 하거나, 해당 정보를 찾기 위해 쿼리를 하나 이상의 신뢰할 수 있는 DNS 서버에 전달한다.
아래는 DNS 동작원리이다.
.
Local DNS 서버가 여러 DNS 서버를 차례대로 (Root DNS 서버 -> com DNS 서버 -> naver.com DNS 서버) 물어봐서 그 답을 찾는 과정을 Recursive Query라고 부른다.
6. 호스팅은 무엇일까요?
호스팅(hosting)이란? 대형 서버의 기능을 빌려쓰는 것
전문 호스팅사의 서버를 빌려 그 안에 나만의 공간을 빌리는 것을 호스팅이라고 한다.
호스팅의종류
1. 웹 호스팅 : 여러 고객이 하나의 서버를 함께 사용하는 형태
2. 서버 호스팅 : 고객이 단독 서버를 사용하는 형태
3. 클라우드 호스팅 : 서버 호스팅을 가상화한 것으로, 가상 서버를 단독으로 사용할 수 있는 형태
가장 저렴하면서 일반적으로 사용하는 서비스가 웹호스팅 서비스이다.
'웹(Web) > 백엔드(Backend)' 카테고리의 다른 글
| 2. 기본적인 프론트엔드 지식 (0) | 2021.02.15 |
|---|---|
| JDBC, JPA/Hibernate, Mybatis의 차이 (0) | 2021.01.27 |
| 백엔드 로드맵 (0) | 2021.01.04 |
| 파이썬 구글 이미지 크롤링(uh oh! keywords is a required argument, unfortunately all 20 could not be downloaded because some images were not downloadable. 0 is all we got for this search filter!) (3) | 2020.12.16 |
| Intellij Spring JDBC시작하기 (4) | 2020.06.07 |