HTTP 통신 request, response

요청 메시지

 

`GET /1.html HTTP/1.1`
- `GET` : 메소드. 웹 브라우저와 웹 서버가 어떤 방식으로 통신할 것인가
- `GET`은 데이터를 웹 서버로 가져올 때 씀. 주소 치고 엔터 치는 것
- `POST` 는 로그인 전송 버튼 누르면 데이터 전송
- `/1.html` : 웹 서버에게 요청하는 정보
- 웹 서버는 `/1.html`을 보고서 그것에 따라 웹 브라우저가 요청한 정보를 응답해주게 됨
- `HTTP/1.1` : 웹 브라우저가 현재 사용하고 있는/사용할 수 있는 HTTP의 버전이 1.1

`Host: localhost:8080`이라는 이 부분부터는 Request Header
- `Host: localhost:8080`: 여러 가지 Request Headers가 있지만 그 중에서 반드시 적어야 하는 필수적인 것
- Host : 인터넷에 연결되어 있는 컴퓨터 한 대 한 대를 식별하는 이름 (Host name)
- Host라고 적는 것은 우리가 요청하는 이 웹사이트 웹 서버의 주소를 적는 것
- Host가 있으면 하나의 웹 서버가 여러 개의 도메인을 서비스 할 수 있음
- 그런 경우에는 예를 들면 a라는 웹 서버가 a.com, b.com, c.com이라는 도메인을 호스팅하고 있고 각각의 주소별로 다른 웹사이트라고 한다면 웹 서버는 `Host: localhost:8080`에 적혀 있는 주소가 무엇이냐에 따라서 다른 정보를 보내줄 수 있음
- `8080` : 포트
- 한 대의 컴퓨터에는 여러 대의 서버가 설치되어 있을 수 있음. `8080`이라고 하면 `8080`이라는 포트 번호에 등록되어 있는 웹 서버

User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_5) AppleWebKit/537.36 ... Chrome/67.0.3396.99 Safari/537.36
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp;image/apng,*/*;...
- `User-Agent` : 웹 브라우저의 다른 표현. 즉 요청하는 웹 브라우저가 어떤 웹 브라우저인지를 보여줌
- `(Macintosh; Intel Mac OS X 10_13_5)` : 우리가 사용하고 있는 운영 체제가 Macintosh, Intel CPU를 쓰고 있고 Mac OS 버전이 어떻다고 하는 것
- 나중에 웹 서버를 잘 운영해보면 통계 같은 걸 내게 되는데 이 웹사이트에는 어떤 브라우저와 운영 체제를 쓰는 사람들이 많이 접속하고 있는가 이러한 정보들을 `User-Agent`를 통해서 볼 수 있음
- 경우에 따라서는 `User-Agent`가 Chrome이나 Firefox나 이런 것이 아니라 어떤 로봇이 접근할 수 있음 (검색 엔진 로봇 등) 그런 경우에는 웹 서버는 이 정보를 바탕으로 해서 그 요청을 차단할 수 있음 (본인이 원하지 않은 요청일 수도 있음)

Accept-Encoding: gzip, deflate, br
- `Accept-Encoding` : 웹 브라우저와 웹 서버가 서로 통신할 때 응답하는 데이터의 양이 많으면 그걸 압축해서 전송하면 웹 브라우저가 그것을 압축을 풀어서 처리해 네트워크의 자원을 아낄 수 있음
- 웹 브라우저는 어떤 압축 방식을 지원한다고 적어놓은 것
- 웹 브라우저는 여기에 있는 이 세 가지 방식 중의 하나, 본인이 선호하는 걸 보내줄 수 있음

If-Modified-Since: Tue ... GET
- `1.html`이라는 파일을 웹 서버에게 요청했는데 다시 요청을 할 수도 있다. 그러면 요청할 때마다 다운로드 받는 게 효율적이지 않음
- `If-Modified-Since`라고 되어 있는 부분이 이 정보를 우리가 서버에게 전송한다는 것은 내가 갖고 있는 이 파일은 마지막으로 언제 다운로드 받은 파일이다는 것을 서버에게 알려 줌
- 웹 서버는 응답할 때 본인이 갖고 있는 파일이랑 무엇이 더 최신인지를 비교해서 본인이 갖고 있는 파일이 최신이면 전송해주고 최신이 아니면(더 다운로드할 필요가 없으면) 전송하지 않아도 되는 것

 

<blank line>

- 블랭크로 헤더와 바디 구분

 

Request Message Body

 

---

응답 메시지

version (HTTP version), status code: 응답결과, phrase: 응답결과에 대한 설명

Response Headers

HTTP/1.1 200 OK  =>  `HTTP/1.1`이라는 포맷을 쓰고 있음, `200` : status code

 

- 1xx informational response : 어떤 정보를 주기 위한 것들은 100번대

- 2xx success : 200번대는 성공했다는 뜻
- 200 OK :성공
- 그 다음에 나오는 것들은 성공은 성공인데 디테일하게 사족을 다는 것들

- 3xx Redirection
- Redirection : a.com으로 접속하면 서버가 30x를 응답해주게 되면 웹 브라우저가 다른 곳으로 바로 다시 이동

 

- 4xx Client errors : 클라이언트 쪽 에러
- 404 Not Found
- 어떤 주소로 접속했는데 서버에 그게 없으면 서버가 왜 없는 거를 요청하냐, 찾을 수 없다고 나오는 것
- 403 Forbidden: 접속하면 안 되는 곳에 접속했을 경우 서버가 오면 안 된다, 오는 곳 아니다라고 하는 것

 

 

- 5xx Server errors : 서버 쪽에 문제가 있을 경우
- 500 Internal Server Error
-서버 내부적으로 어떤 문제가 있어서 지금은 서비스 할 수 없다는 정보를 보여줄 때 이것을 보내주는 것

 

 

 

 

 

 

 

 

2. headers
- `Content-Type: text/html` => 굉장히 중요한 헤더. 웹 서버가 응답할 때 이 응답은 `text`고 `html`이라는 컴퓨터 언어이다, 라고 하면 웹 브라우저는 저걸 보고서 그 정보를 HTML로 해석해서 화면에 표시해 줌
- `Content-Length: 1434` => 응답하는 이 컨텐츠의 전체 크기는 `1434`라는 사이즈. 단위는 byte (1434 bytes)
- `Content-Encoding: gzip` => `gzip`이라는 방식으로 압축해서 이것을 읽으려면 `gzip`으로 본문 압축을 풀어서 읽어야 한다는 내용
- `Last-Modified: Tue, 17 Jul 2018 23:28:26 GMT` => 마지막으로 언제 수정되었다는 것을 알려주는 내용

웹 브라우저와 웹 서버가 서로 소통하는 것을 우리가 직접 텍스트로 만들어 보면 웹 브라우저는 요청을 하기 전에 Request Headers를 생성
- 그 다음에 또 웹 브라우저가 웹 서버에게 보내야 할 정보가 있을 수 있음
- 첫 번째 줄이 `GET`이 아니라 `POST`인 경우 Request Headers 뒤에 한 줄 띄우고 웹 서버로 전송할 정보를 담음
- 메시지를 만든 다음에 인터넷을 통해서 웹 서버에게 보내주면 웹 서버는 Request Headers에 있는 정보를 해석해서 응답 메시지를 만들어 주게 되는 것
- 응답 메시지 : Response Headers
- Response Headers에서 한 칸 띄우고 실제로 HTML 코드 내용 전체를 인터넷을 통해서 요청한 컴퓨터로 보내주면 웹 브라우저는 Response Headers의 내용과 본문을 참조해서 사용자 화면에 표시해주는 것을 통해서 이 작업이 끝나게 되는 것

---

HTTP와 HTTPS의 차이점
- 주소창에 `http://`라고 시작하면 그것은 HTTP, `https://`로 시작하면 HTTPS 또는 SSL을 이용하고 있는 것
- HTTP를 통해서 통신을 하고 있다면 누군가 여러분의 정보를 보고 있는 것로 간주해야 함
- 하지만 HTTPS를 사용하면 전송하고 있는 내용을 가로챈다고 하더라도 암호화되어서 실제로 그 안에 무슨 내용이 담겨 있는지는 당사자들만 알 수 있음
- 웹에 대한 소비자라면 HTTPS가 아닌 사이트에서 만약에 로그인을 요구한다면 그 사이트를 이용하지 말아야 함
- 여러분이 서비스를 만드는 생산자라면 운영하고 있는 사이트가 중요한 정보를 사용자와 주고받고 있다면 HTTPS를 꼭 도입해야 함

Cache
- 한 번 웹사이트에 접속해서 어떠한 내용을 다운로드 받았다면 그 다음에 접속할 때 또 다운로드 받을 필요 없이 이미 다운로드 받은 저장된 파일을 읽어서 성능을 향상시키는 기법
- 풀기 어려운 문제 : 내용이 갱신되었을 때에도 웹 브라우저는 그 사실을 알아채지 못하게 된다는 것
- 이런 경우에 웹 브라우저에서 해당 키를 누르면강제로 캐시가 갱신됨  Windows : Ctrl + F5, MacOS : Cmd + R, Linux : F5
- 이런 문제를 해결하기 위한 기술들 : cache-control, pragma

Cookie
- 쇼핑몰 사이트에서 장바구니 이용 같은 개인화
- 로그인을 하면 그 다음에 접속할 때에는 로그인 상태가 유지
- 웹사이트를 방문할 때 이전에 처리했던 장바구니 담기, 로그인과 같은 기록들을 웹사이트와 웹 브라우저가 기억
- 쿠키를 이용해서 쿠키 값을 웹 브라우저에 설정하면 접속할 때마다 그 설정됐던 쿠키 값을 서버에 전송하는 것을 통해서 사용자의 상태를 유지할 수 있고 사용자를 식별
- 최근에는 쿠키보다도 훨씬 더 많은 정보를 저장하면서도 보안적으로 더 우수한 web storage라는 기술이 등장

Proxy
- 웹 브라우저와 웹 서버 사이에 프록시라고 불리는 이름의 중개 서버를 둘 수 있음
- 중간에 있는 서버가 캐시를 대신해 주거나, 보안과 관련된 공격을 막아 주거나, 적당히 사용자 요청을 여러 대의 서비스로 분산해주는 것과 같은 역할을 프록시 서버들이 대신해줄 수 있음
- 여러분의 서비스가 복잡해지고 중요해지고 있다면 프록시 서버라고 불리는 기술을 알아보기

네트워크 모니터링하는 도구들
- 가장 간편한 도구 : 웹 브라우저의 개발자 도구에 포함되어 있는 Network 모니터링 기능 (DevTools > Network)
- 오픈 소스이고 무료이면서 가장 강력한 기능을 가진 도구 : Wireshark