[모든 개발자를 위한 HTTP 웹 기본 지식 - 17]

데이터 전송

클라이언트에서 서버로 데이터 전송시 크게 2가지 방법이다.
1. 쿼리 파라미터를 통한 데이터 전송
   - GET, 주로 정렬 필터(검색어)
2. 메시지 바디를 통한 데이터 전송
   - POST, PUT, PATCH (회원가입, 상품주문, 리소스등록, 변경)

예시 4가지 상황)
1. 정적 데이터 조회 - 이미지, 정적 텍스트 문서
2. 동적 데이터 조회 - 주로 검색, 게시판 목록에서 정렬 필터(검색어)
3. HTML Form을 통한 데이터 전송
4. HTTP API를 통한 데이터 전송

-정적 데이터 조회

저장된 이미지 경로를 요청하면 서버에서는 이미지를 내려준다. 조회는 GET을 사용하며 정적데이터는 일반적으로 쿼리 파라미터 없이 리소스 경로로 단순하게 조회가 가능하다.

동적 데이터 조회

쿼리파라미터를 사용하여 서버에게 동적으로 데이터를 요청할수 있다. 주로 검색, 게시판 목록에서 GET방식으로 쿼리파라미터를 추가하여 조회한다.

HTML Form

HTML form태그를 사용하여 서버로 데이터를 전송한다. 그림에서 전송버튼 클릭시 Http 메시지를 생성해준다.

파일 전송시 Content-Type은 multipart/form-data 형식을 사용해야합니다.

HTML Form 정리
-HTML Form submit시 POST 전송하며 회원가입, 상품주문, 데이터 변경시 사용
-Content-Type: application/x-www-form-urlencoded 사용
-form의 내용을 메시지 바디를 통해서 전송(key=value, 쿼리 파라미터 형식)
-HTML Form은 GET 전송도 가능
-파일 업로드 같은 바이너리 데이터 전송시 사용 (Content-Type: multipart/form-data)
-참고: HTML Form 전송은 GET, POST만 지원

HTTP API

위 그림과 같이 JSON형태로 데이터를 전송한다.

HTTP API 정리
-서버 to 서버
-백엔드 시스템 통신
-앱 클라이언트 (아이폰, 안드로이드), 웹 클라이언트
-HTML에서 Form 전송 대신 자바 스크립트를 통한 통신에 사용(AJAX)
-예) React, VueJs 같은 웹 클라이언트와 API 통신
-POST, PUT, PATCH: 메시지 바디를 통해 데이터 전송
-GET: 조회, 쿼리 파라미터로 데이터 전달
-Content-Type: application/json을 주로 사용 (사실상 표준)
-TEXT, XML, JSON 등등