안녕하세요. 이번 시간에는 HTTP에 대해서 알아보겠습니다.
HTTP는 Hyper Text Transfer Protocol의 두문자어로, 인터넷에서 데이터를 주고받을 수 있는 프로토콜입니다. 프로토콜은 규칙이라고 생각하시면 됩니다. 이렇게 규칙을 정해두었기 때문에, 모든 프로그램이 이 규칙에 맞춰 개발해서 서로 정보를 교환할 수 있게 된 것이죠.
HTTP를 가장 많이 사용하는 개발자는 단언컨데 웹 개발자일 것입니다. 따라서 웹 개발자라면 HTTP에 대해서 잘 알고 있어야 하지만, 많이들 HTTP를 간과하십니다. 백엔드 개발자는 좀 덜하지만, 프론트엔드 개발자는 HTTP를 모르는 경우가 부지기수입니다. 하지만 프론트엔드 개발자의 역할 중 하나가 서버로 데이터를 전송하는 것이기 때문에, HTTP를 모른다면 역할을 다하고 있다고 말할 수 없습니다.
에러를 해결하는데도 HTTP 지식이 중요합니다. 데이터를 주고 받을 때 흔히 발생하는 CORS, CORB 같은 에러들은 HTTP만 잘 알아도 쉽게 해결할 수 있습니다.
그래서 이 강좌를 기획하게 되었습니다. 프로토콜이니만큼 양도 많고 복잡하지만, 웹 개발을 하는 데 있어 필수적인 것들만 알아보도록 하겠습니다.
그렇다면 무엇이 필수일까요?
크롬 개발자 도구 네트워크 탭의 정보를 해석할 정도만 되면 충분합니다. 위 이미지는 제 블로그 홈페이지를 가져오는 요청과 그에 대한 응답 정보를 담고 있는 헤더입니다. 저 각각의 줄들이 다 정보를 담고 있습니다. 정말 많죠? 저걸 다 알 필요는 없지만 대부분은 알고 계셔야합니다. 저걸 알려드리는 게 이 강좌의 목표이기도 하고요.
서버의 역할이 요청에 대한 응답을 보내준다는 것임을 기억하며 요청부터 알아보겠습니다. HTTP/1.1을 기준으로 합니다. 새로운 버전인 HTTP/2는 나중에 알아보겠습니다.
요청
위 이미지에서 제 블로그 서버에게 zerocho.com에 대한 정보를 달라고 요청했습니다. 요청을 보낼때는 요청에 대한 정보를 담아 서버로 보냅니다. 식당에서 주문서를 작성하는 것과 같다고 생각하시면 됩니다. 서버가 주문서를 받아 클라이언트가 어떤 것을 원하는지 파악할 수 있게 하는 것이죠.
서버도 응답할 때 응답에 대한 정보를 담아 클라이언트로 보냅니다. 이런 정보가 담긴 메시지를 HTTP 메시지라고 합니다. HTTP 메시지는 시작줄, 헤더, 본문으로 구성됩니다. 실제 요청 HTTP 메시지를 한 번 살펴볼까요.
GET https://www.zerocho.com HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) ...
Upgrade-Insecure-Requests: 1
(본문 없음)
첫 줄이 시작줄입니다. GET https://www.zerocho.com HTTP/1.1이라고 적혀 있습니다. GET같은 것은 HTTP 메서드로 다음 시간에 알아봅니다. www.zerocho.com은 주소고요. HTTP/1.1은 HTTP 버전입니다. 즉, 요청 메시지의 시작줄은 메서드 주소 버전으로 구성된 것이죠.
두 번째 줄부터는 헤더입니다. 요청에 대한 정보를 담고 있습니다. User-Agent, Upgrade-Insecure-Requests 등등이 헤더에 해당됩니다. 헤더 종류가 매우 많기 때문에 유명한 헤더들만 나중에 알아보도록 하겠습니다.
헤더에서 한 줄 띄고 본문이 시작됩니다. 본문은 요청을 할 때 함께 보낼 데이터를 담는 부분입니다. 지금은 단순히 주소로만 요청을 보내고 있기 때문에 따로 데이터를 담아 보내지는 않았습니다. 그래서 본문이 비어있습니다.
응답
이번에는 어떤 응답이 왔는지 살펴봅시다.
HTTP/1.1 200 OK
Connection: keep-alive
Content-Encoding: gzip
Content-Length: 35653
Content-Type: text/html;
<!DOCTYPE html><html lang="ko" data-reactroot=""><head><title...
요청과 마찬가지로 시작줄, 헤더, 본문으로 구성되어 있습니다.
첫 줄은 버전 상태코드 상태메시지로 구성되어 있습니다. 상태코드는 노드 강좌 에서 간단하게 알아봤습니다. 200은 성공적인 요청이었다는 뜻입니다.
두 번째 줄부터는 헤더입니다. 응답에 대한 정보를 담고 있습니다. 역시나 헤더 종류가 많기 때문에 나중에 따로 시간을 내어 유명한 헤더들만 알아보겠습니다.
이번에는 본문이 있네요. 응답에는 보통 본문이 있습니다. 보통 데이터를 요청하고, 응답 메시지에는 요청한 데이터를 담아서 보내주거든요. 응답 메시지에 HTML이 담겨 있습니다. 이 HTML을 받아 브라우저가 화면에 렌더링합니다.
대략적인 요청과 응답의 구조가 이해되시나요? HTTP 메시지만 봐도 많은 정보를 알 수 있습니다. 다음 시간부터는 요청과 응답 메시지의 한 파트씩을 알아봅니다. HTTP 메서드 차례입니다.
if ($host = api.cookingclasss.com) {
return 301 https://$host$request_uri;
} # managed
이런식으로 리다이렉트 시켜주는걸 말씀하시는 건가요?