일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- 자바
- 프디아
- 신한투자증권
- Flask 오류
- 타입스크립트
- 기본 타입
- 웹 클라이언트
- 쿠키
- 다양한 기능
- Visual Studio Code
- 웹
- 웹 기초
- 세션
- 정적 타입
- 웹 스크래핑
- 서버 통신
- 웹 렌더링
- gatsby.js
- prettier
- jwt
- eslint
- 동적 타입
- HTTP
- scss
- CORS
- Boxmodel
- 비동기기술
- 프로디지털아카데미
- 백그라운드 실행
- 예외 클래스
- Today
- Total
Moon Blog
Web Background - WEB 본문
- WEB
웹이란 인터넷을 기반으로 구현된 서비스 중 HTTP를 이용하여 정보를 공유하는 서비스를 의미함
웹 서버 (Web Server) | 웹 클라이언트 (Web Client) |
정보를 제공하는 주체 | 정보를 받는 이용자 |
웹 = 프론트엔드(Front-end) + 백엔드(Back-end) 로 구성됨
프론트엔드는 이용자의 요청을 받는 부분으로 우리가 보고 있는 웹을 담당함 이는 웹 리소스로 구성되어 있음
웹 리소스란, 웹에 갖춰진 정보 자산으로 모든 웹 리소스는 고유의 URI(Uniform Resource Indicator)를 가지고 이를 통해 식별됨 (HTML, CSS, Javascript 등)
+) Javascript는 클라이언트 실행 코드로 Client-Side-Script라고 불림
백엔드는 이용자의 요청을 처리하는 부분으로 우리가 보지 못하는 부분을 담당함
우리가 검색란에 특정 키워드를 넣고 검색을 누르면 이 검색어에 맞는 데이터를 찾는 일을 백엔드에서 담당함
- 웹 클라이언트와 서버 통신
Client | 유저가 브라우저를 이용하여 웹 서버에 접속 |
Client | 브라우저가 유저의 요청을 해석하여 HTTP 형식으로 웹 서버에 리소스 요청 |
Server | HTTP로 전달된 유저 요청을 해석 |
Server | 해석한 요청에 맞는 동작 수행 (리소스 요청 시 탐색, 리소스 동작 시 연산 처리) |
Server | 유저에게 전달할 리소스를 HTTP 형식 변환 후 전달 |
Client | 서버에게 응답받은 웹 리소스를 브라우저가 시각화함 |
- 웹 브라우저
웹 브라우저는 이용자 경험(User Experience, UX)을 제공하는 소프트웨어 중 하나로
이용자는 브라우저를 이용해 정보 검색, 영상 시청, 파일 다운 등을 하지만 연산 과정은 알지 못함
- URL
URL이란? Uniform Resource Locator로, 웹에 있는 리소스의 위치를 표현하는 문자
웹 브라우저로 특정 웹 리소스에 접근할 때는 URL을 사용하여 서버에게 요청함
- URL 구성 요소
Scheme | 웹 서버와 어떤 프로토콜로 통신할지 나타냄 |
Host | Authority의 일부로, 접속할 웹 서버의 주소에 대한 정보를 가짐 |
Port | Authority의 일부로, 접속할 웹 서버의 포트에 대한 정보를 가짐 |
Path | 접근할 웹 서버의 리소스 경로로 '/'로 구분됨 |
Query | 웹 서버에 전달하는 파라미터로 URL에서 '?' 뒤에 일치함 |
Fragment | 메인 리소스에 존재하는 서브 리소스에 접근할 때를 이를 식별하기 위한 정보를 담음 |
- Host
웹 서버에 대한 정보를 가지는 Host는 Domain Name, IP Address의 값을 가질 수 있음
Domain Name을 Host 값으로 이용할 경우 브라우저는 Domain Name Server(DNS)에 도멘인 이름을 질의하고, DNS가 응답한 IP Address를 사용함
즉, DNS는 Host의 도메인 이름을 IP로 변환하거나 IP를 도메인 이름으로 변환함
Ex) http://naver.com에 접속할 경우, DNS에 질의해 얻은 naver.com의 IP와 통신 함
- 웹 렌더링
웹 렌더링(Web Rendering)은 서버로부터 받은 리소스를 이용자에게 시각화하는 행위를 말함
즉, HTML이랑 CSS를 불러와 이를 적용하여 이용자에게 보여줌
웹 렌더링은 웹 렌더링 엔진에 의해서 이뤄지는데, 브라우저별로 각각 다른 엔진을 사용함
사파리 = 웹킷(Webkit) | 크롬 = 블링크(Blink) | 파이어폭스 = 개코(Gecko) |
Ref) https://dreamhack.io/ (dreamhack - Web Hacking)
'Web Hacking' 카테고리의 다른 글
Web Background - CSRF (0) | 2022.04.01 |
---|---|
Web Background - XSS (0) | 2022.03.30 |
Web Background - SOP, CORS (0) | 2022.03.28 |
Web Background - Cookie & Session (0) | 2022.03.28 |
Web Background - HTTP/HTTPS (0) | 2022.03.23 |