하이퍼텍스트 트랜스퍼 프로토콜(HTTP)

Sunny·2022년 8월 25일

✨ React.js, 스프링 부트, AWS로 배우는 웹 개발 101

🔅 01. 개발을 시작하기 전에

🔅 1.2 배경 지식

✔ 1.2.1 하이퍼텍스트 트랜스퍼 프로토콜
1.2.2 자바스크립트 오브젝트 노테이션
1.2.3 서버란?
1.2.4 정적 웹 서버
1.2.5 동적 웹 서버
1.2.6 자바 서블릿 컨테이너/엔진

🚩 1.2.1 하이퍼텍스트 트랜스퍼 프로토콜 (HTTP)

🐳 HTTP (HyperText Transfer Protocol)

애플리케이션 레벨의 네트워크 프로토콜
많은 웹 기반 App이 HTTP를 이용하고, HTTP로 서버와 클라이언트 간에 통신함
오늘날의 HTTP는 HTML 문서를 주고받던 간단한 프로토콜에서 벗어나 그림 파일, 동영상, 3D 등 다양한 미디어 리소스를 주고받는 형태로 발전함

cf. 하이퍼텍스트란?

다른 문서로 향하는 링크가 있는 텍스트

🐳 HTTP 요청과 응답

사용자는 브라우저라는 클라이언트를 통해 서버에 HTTP 요청을 전송할 수 있음
브라우저 주소창에 URL을 입력하고 엔터를 누르면 브라우저는 HTTP GET 요청을 해당 URL 서버로 전송하고 그 결과인 HTTP 응답을 브라우저에 렌더링(화면에 디스플레이 ) 함

🐳 HTTP 메서드와 기능

🟩 GET

리소스를 검색하고, 반환받기 위해 사용하는 메소드.
원하는 정보를 서버에 요청할 때 쓰임.
일반적으로 리소스의 위치를 URL에서 쿼리로 표현하기 때문에 RequestBody가 없음.
ex) url : localhost:8080/test/text.jsp?id=1&data=23

🟩 POST

요청된 자원을 생성하기 위해 사용하는 메소드
POST로 정보를 전송하면 URL에 파라미터로 나타나지 않으므로 각종 데이터를 전송하는데 쓰임

🟩 PUT

요청된 자원을 수정하기 위해 사용하는 메소드

🟩 DELETE

요청한 자원을 삭제하기 위해 사용하는 메소드
클라이언트에서 서버의 자원을 삭제할 수 있도록 허가하는 일은 매우 위험하다. 따라서 현실적으로 사용될 일이 거의 없고, 대부분의 서버는 이 메소드를 비활성화 시킨다.

🐳 실제 HTTP 요청 분석

GET / HTTP/1.1
Accept : text/html, application/xhtml+xml, application.xml; q=0.9, */*; q=0.8
Upgrade-Insecure-Requests : 1
Host : localhost:8080
User-Agent : Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.3 Safari/605.1.15
Accept-Language : en-us
Accept-Encoding : gzip, deflate
Connection : keep-alive

위의 HTTP 요청으로부터 알아낼 수 있는 정보는 다음과 같다.

송신자 : localhost:8080
👉 이 송신자는 GET 요청을 전송하려 함
프로토콜 버전 : HTTP/1.1
운영체제 : Mac OS X
사용한 브라우저 : Safari

🐳 실제 HTTP 응답 분석

HTTP/1.1 200
Content-Type: text/html; charset=UTF-8
Keep-Alive: timeout=60
Pragma: no-cache
X-XSS-Protection:1; mode=block
Expires: 0
Cache-Control: no-cache, no-store, max-age=0, must-revalidate
Date: Sat, 17 Apr 2021 05:28:42 GMT
Content-Length: 32
Connection: keep-alive
X-Content-Type-Options: nosniff
X-Frame-Options: DENY
Vary: Origin, Access-Control-Request-Method, Access-Control-Request-Headers

<html></html>

응답코드 : 200
200: 성공적으로 요청처리
404: 해당 리소스가 존재하지 않음
403: 서버에 요청이 전달되었지만 해당 리소스에 접근 할 권한이 없어 거절 되었음을 의미
500: 서버의 에러로 요청을 처리할 수 없음
Content-Type: 응답의 미디어 타입을 의미
text/html
text/css
application/json
video/mpeg
Connection: keep-alive
응답 바디:
가져올 실제 데이터 컨텐츠/메시지 본문이 나타남. 컨텐츠에는 요청한 리소스에 따라 HTML 코드, 이미지, CSS 스타일시트 또는 JavaScript 파일이 포함될 수 있음