인프런 HTTP 강의 정리 #5

1 . 클라이언트에서 서버로 데이터 전송

- 데이터 전달 방식

• 쿼리 파라미터 : GET, 정렬 필터
• 메시지 바디 : POST, PUT, PATCH, 회원 가입, 상품 주문, 리소스 등록/변경

- 4가지 상황

• 정적 데이터 조회
• 동적 데이터 조회
• HTML Form을 통한 데이터 전송
• HTTP API를 통한 데이터 전송

1. 정적 데이터 조회

• 이미지, 정적 텍스트 문서
• 조회 : GET 사용
• 일반적으로 쿼리 파라미터 없이 리소스 경로로 단순하게 조회 가능

 

2. 동적 데이터 조회

• 검색, 게시판 목록에서 정렬 필터(검색어)
• 조회 : GET 사용
• 쿼리 파라미터를 사용해서 조회 가능

 

3. HTML FORM 데이터 전송

 

1) POST 전송 - 저장

• post method로 된 Form 태그의 submit 버튼을 누르면, 웹 브라우저가 HTML Form의 데이터를 읽어서 HTTP 요청 메시지를 생성한다.
• message-body에 key=value 형태로 form 의 데이터를 넣음
• 서버가 POST 메시지를 받으면 데이터를 저장(save)한다.
• ex) 회원 가입, 상품 주문, 데이터 변경

 

2) GET 전송 - 조회

• get method로 된 Form 태그의 submit 버튼을 누르면, 웹 브라우저가 HTML Form의 데이터를 읽어서 HTTP 요청 메시지를 생성해준다.
• 쿼리 파라미터에 key=value 형태로 form 의 데이터를 넣는다.
• 서버가 GET 메시지를 받으면 데이터를 필터링(조회)한 결과를 응답한다.
• 하지만 GET은 조회에서만 사용해야 한다. 리소스 변경이 발생하는 곳에서 사용하면 안된다!

GET 조회

GET 저장

 

3) multipart/form-data

• binary data를 전송할 때 사용  ex) 파일 업로드
• 다른 종류의 여러 파일과 폼의 내용을 함께 전송 가능 (multipart)
• HTML Form 태그의 enctype="multipart/form-data"로 설정하고 submit 버튼을 누르면 웹 브라우저가 username, age, file1 데이터를 분리하여 message-body에 담아 HTTP 요청 메시지를 생성해준다.

 

4. HTTP API 데이터 전송

 

• 응답 결과로 HTML이 아닌 데이터를 전달받는다
• 서버 to 서버  ex) 백엔드 시스템 통신
• 앱 클라이언트  ex) 아이폰, 안드로이드
• 웹 클라이언트  : HTML 에서 Form 전송 대신 자바 스크립트를 통한 통신에 사용
• POST, PUT, PATCH : 메시지 바디를 통해 데이터 전송
• GET : 조회, 쿼리 파라미터로 데이터 전달
• Content-Type : application/json을 주로 사용

 

2 . HTTP API 설계 예시

1. 회원 관리 시스템 - POST 기반

• 회원 목록 /members -> GET
• 회원 등록 /members -> POST
• 회원 조회 /members/{id} -> GET
• 회원 수정 /members/{id} -> PATCH, PUT, POST  (PATCH를 사용하는게 가장 좋음)
• 회원 삭제 /members/{id} -> DELETE

- POST 신규 자원 등록 특징

• 클라이언트는 등록될 리소스의 URI를 모른다   ex) POST /members
• 서버가 새로 등록된 리소스 URI를 생성한다   ex) Location: /members/100
• 컬렉션(Collection) : 서버가 관리하는 리소스 디렉토리. 서버가 리소스의 URI를 생성, 관리   ex) /member

 

2. 파일 관리 시스템 - PUT 기반 등록

• 파일 목록 /files -> GET
• 파일 조회 /files/{filename} -> GET
• 파일 등록 /files/{filename} -> PUT  (해당 파일이 있으면 기존 것을 덮어써야 하기 때문에 PUT 사용)
• 파일 삭제 /files/{filename} -> DELETE
• 파일 대량 등록 /files -> POST

- PUT 신규 자원 등록 특징

• 클라이언트가 리소스 URI를 알고 있어야 한다   ex) PUT /files/star.jpg
• 클라이언트가 직접 리소스 URI를 지정한다
• 스토어(Store) : 클라이언트가 관리하는 리소스 저장소   ex) /files

-> 실무에서는 대부분 POST 기반 자원 등록을 사용한다

 

 

3. HTML FORM 사용 

• 회원 목록 /members -> GET
• 회원 등록 폼 /members/new -> GET
• 회원 등록 /members/new, /members -> POST
• 회원 조회 /members/{id} -> GET
• 회원 수정 폼 /members/{id}/edit -> GET
• 회원 수정 /members/{id}/edit, /members/{id} -> POST
• 회원 삭제 /members/{id}/delete -> POST

-> 회원 등록 폼과 회원 등록의 URI를 일치하는 것을 추천한다

 

- HTML FORM 특징

• HTML FORM은 GET, POST만 지원하므로 제약이 있다 
• 문서, 컬렉션, 스토어로 해결하기 어려운 추가 프로세스 실행
• 제약 해결을 위해 컨트롤 URI 사용
• 컨트롤 URI : 동사로 된 리소스 경로 사용   ex) /new, /edit, /delete