✏️ 오늘 학습한 내용
1. HTTP
2. 웹페이지와 HTML
3. HTTP 통신
4. 웹 스크래핑, 크롤링
5. DOM
🔎 HTTP
-
Client : 정보를 요청하는 컴퓨터 (HTTP Request)
-
Server : 정보를 제공하는 컴퓨터 (HTTP Response)
-
HTTP : 웹 상에서 정보를 주고 받기 위한 약속
-
택배(HTTP) -> 송장 + 내용물
- 송장(Head) : 보내는 사람, 받는 사람, ...
- 내용물(Body) : 내용물
-
HTTP Request
GET / HTTP 1.1
Host: www.program.com
User-Agent: Mozilla/5.0- GET : 요청
- / : Root(최상단을 의미)
- Host : 요청 대상(server)
- User-Agent : 사용자를 대표하는 키워드
결과 : 나는 Mozilla/5.0인데,
Host(program.com)에 있는 /HTTP 1.1 정보를 줘- HTTP Response
HTTP/1.1 200 OK
-
<html>_</html>- 200 OK : 요청이 성공적으로 왔다.
- <html> : Body에 요청 결과물이 담겨서 옴🔎 웹페이지와 HTML
-
웹페이지와 웹사이트의 차이
- 웹페이지 : 웹 속의 문서 하나 (HTML 형식)
- 웹사이트 : 웹페이지들의 모음
-
웹 브라우저의 역할
- HTML 요청을 보내고
- HTTP Response에 담긴 HTML 문서를 시각화하는 역할 (렌더링)
-
HTML의 여러 특징
<!DOCTYPE html> -> HTML 5임을 명시
<tag> contents </tag>
HTML은 여러 태그로 감싼 요소의 집합으로 이루어짐
웹 브라우저마다 지원하는 태그와 속성이 다름🔎 HTTP 통신 - Python
- GET : 정보 요청
import requests
res = requests.get("https://www.naver.com")
res # HTTP의 응답이 담김
# Body를 텍스트 형태로 확인
res.text[:200] - POST : 정보 제공 및 요청 진행 ex) 로그인
# json이 python의 dictionary와 매우 유사
payload = {"name":"Hello", "age":13}
# payload의 정보 갱신을 요청
res = requests.post("https://~.com", payload)
# 요청이 잘 들어왔는지 확인
res.status_code
🔎 웹 스크래핑, 크롤링
-
웹 스크래핑
-
웹 페이지들로부터 원하는 정보를 추출
-
핵심 : 데이터 추출
-
e.g.) 날씨 데이터 가져오기, 주식 데이터 가져오기, ...
-
-
웹 크롤링
-
크롤러(Crawler)를 이용해서 웹 페이지의 정보를 인덱싱
-
핵심 : 데이터 색인
-
URL을 타고다니며 반복적으로 데이터를 가져오는 과정
-
e.g) 검색 엔진의 웹 크롤러
-
-
고려해야 할 것
-
웹 스크래핑/크롤링을 통해 어떤 목적을 달성하고자 하는가?
-
서버에 영향을 미치지는 않는가?
-
-
로봇 배제 프로토콜(REP)
- 사람이 아닌 로봇도 정보를 취득할 수 있음
- 모든 사이트의 모든 정보를 취득하는게 합당한가?
- 로봇들의 무단 접근을 방지하기 위한 REP 규칙의 탄생
- 웹 크롤러들은 이 규칙을 지키면서 크롤링을 진행해야함
# 모든(*) user-agent에 대해서 모든 데이터(/, root)에 대한 접근을 거부 User-agent: * Disallow: / # 모든(*) user-agent에 대해서 모든 데이터(/, root)에 대한 접근을 허가 User-agent: * Allow: / # MussgBot에 대해서 모든 데이터(/, root)에 대한 접근을 거부 User-agent: MussgBot Disallow: / -
나의 User Agent 확인
https://www.whatismybrowser.com/detect/what-is-my-user-agent/
-
웹 페이지의 REP 확인
/robots.txt를 통해 확인 가능
import requests res = requests.get("https://www.naver.com/robots.txt") print(res.text)
🔎 DOM
-
DOM(Document Object Model)
-
Browser에 대한 넓고 얇은 지식
-
브라우저의 랜더링 과정
=> 렌더링 엔진이 웹 문서(코드)를 로드한 후, 파싱을 진행
=> 이 결과 모델을 DOM이라고 함
=> 이 DOM의 각 노드를 객체로 생각하면 문서를 관리하기 용이
-
-
DOM Tree를 순회해서 특정 원소를 추가 가능
// javascript
// img 원소를 추가
var imgElement = document.createElement("img");
document.body.appendChild(imgElement);- DOM Tree를 순회해서 특정 원소를 조회 가능
// Tag명이 h2인 원소를 조회
document.getElementsByTagName("h2")-
브라우저는 왜 HTML을 DOM으로 바꿀까?
- 원하는 요소를 동적으로 변경해줄 수 있음 (추가,삭제,변경)
- 원하는 요소를 쉽게 찾을 수 있음
=> html 파일을 parsing을 해서 다룬다는 점을 응용하여 써먹어보자
-
정리
- 브라우저는 HTML을 파싱해서 DOM을 생성
- 이를 바탕으로 요소를 변경하거나 찾을 수 있음
- 파이썬으로 HTML을 분석하는 HTML Parser가 필요
