HTTP - 메서드와 요청

HTTP API만들기

URI는 리소스만 매핑하고, 나머지 기능은 HTTP 메서드에 포함하면된다.

HTTP 주요 메서드

GET : 리소스 조회

쿼리파라미터, 쿼리스트링을 통해서 전달 한다.
메세지바디를 사용해서 데이터 전달도 가능하나 지원하지않는 서버도 많아서 권장하지 않음

클라이언트가 get메서드를 보내서 서버에서 받아서 members의 100번을 달라 하면 json혹은 다른 형태의 데이터를 만든다음 응답메세지를 만들어서 보내줌
버전, contenttype, 길이 34이런식으로 전달해서 준다.

POST : 요청 데이터 처리, 주로 등록에 사용

요청 데이터 처리
메세지 바디를 통해 서버로 내 요청 데이터를 받아서 처리해줘야함
신규 리소스 등록, 프로세스 처리에 사용

POST메서드는 HTML form에 입력한 정보로 회원가입, 주문, 게시판에 글쓰기, 댓글달기, 신규주문생성, 데이터 추가
프로세스가 변경되어야하는경우 (예, 결제완료,배달시작)
다른 메서드로 처리하기 애매한 경우
JSON으로 조회 데이터를 넘겨야 하는데 GET 메서드를 사용하기 어려운 경우

리소스로 최대한URI를 설계하고 어쩔수 없는 부분은 컨트롤 URI으로 처리한다.

PUT : 리소스를 대체, 해당 리소스가 없으면 생성

리소스가 있으면 대체, 없으면 생성 즉 더덮어버린다는 뜻 (firebase update랑비슷하게 작용한다)

PUT/members/100 HTTP/1.1
Content-Type: application/json

{
"username": "hello",
"age":20
}

PATCH : 리소스 부분 변경

리소스를 부분 변경 할 수 있게 만든 것이다.merge하는것
PATCH를 못읽는 서버에서는 POST를 사용하면된다. POST는 무적

DELETE : 리소스 삭제

HTTP 메서드의 속성

출처

안전(Safe)

여러번 호출했을때 리소스가 변경되지 않는것을 안전하다고 함
GET 안전함
안전은 호출해서 로그가 쌓이는 장애에 대한건 고려하지 않고, 리소스만 고려했을때 변하지 않는것으로 이해하면 된다.
POST,PUT,DELETE는 변경이 일어나는 메서드이기 때문에 안전하지 않가.

멱등 메서드 (Idempotent)

여러번 호출했을때 결과가 똑같아야 한다.
멱등 메서드
GET : 한번 조회하든 두번 조회하든 같은결과가 조회된다
PUT : 결과를 대체한다. 같은요청을 여러번해도 최종결과는 같다.
DELETE : 삭제하라는 요청이므로 같은 요청이므로 삭제되있는 상태는 최종적으로 같으므로 멱등하다.
POST : 멱등이 아니다! ,두번 호출하면 결제가 두번되거나 배송이 두번되거나 등

캐시가능 (Cachable)

응답결과 리소스를 캐시해서 사용해도 되는지?
GET,HEAD,POST,PATCH 캐시 가능
실제로는 GET,HEAD 정도만 캐시로 사용
캐시를 하려면 키가 맞아야 하는데, POST나 PATCH는 본문내용까지 캐시 키로 고려해야하는데 쉽지않다
GET은 URL만 키로잡고 캐싱하면 되기때문에 심플하다.

HTTP 메서드 활용

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

쿼리 파라미터를 통한 데이터 전송

• GET
• 주로 정렬 필터(검색어)

메세지 바디를 통한 데이터 전송

• POST,PUT,PATCH
• 회원가입, 상품주문, 리소스등록, 상품 변경

정적 데이터 조회

쿼리 파라미터 미사용

경로만 넣으면 이미지 리소스를 만들어서 다시 클라이언트한테 전달해준다.

• GET을 사용하고, 쿼리 파라미터를 사용하지 않는다.

GET/static/star.jpg HTTP/1.1 
HOST: localhost:8080

동적 데이터 조회

쿼리 파라미터 사용

GET/ search?q=hello&hl=ko HTTP/1.1 
HOST : www.google.com

쿼리파라미터를 기반으로 해서 정렬필터해서 결과를 동적으로 생성

• 주로 검색이나 게시팜목록 정렬 필터
• 조회는 GET사용
• GET은 쿼리 파라미터 사용해서 데이터 전달

HTML Form 데이터 전송

POST전송-저장

<form action="/save" method="post">
  <input type="text" name="username" />
  <input type="text" name="age" />
  <button type="submit">전송</button>
</form>

으로 전송하면 웝브라우저는 아래와 같은 HTTP메세지를 만든다

POST/save HTTP/1.1
HOST: localhost:8080
Content-Type : application/x-www-form-urlencoded

username=kim&age=20

GET전송- 저장

<form action="/members" method="get">
  <input type="text" name="username" />
  <input type="text" name="age" />
  <button type="submit">전송</button>
</form>

으로 전송하면 웝브라우저는 아래와 같은 HTTP메세지를 만든다

// 멤버중에서 이름이 김이고 나이가 20인 사람을 필터링해서 보여줄때 
GET/members?username=kim&age=20 HTTP/1.1
HOST: localhost:8080

multipart/form-data

<form action="/save" method="post" enctype="multipart/form-data">
  <input type="text" name="username" />
  <input type="text" name="age" />
  <input type=
  <button type="submit">전송</button>
</form>

으로 전송하면 웝브라우저는 아래와 같은 멀티파트를 둔 HTTP메세지를 만든다

POST/save HTTP/1.1
HOST: localhost:8080
Content-Type : multipart/form-data; boundary = ---XXX
Content-length : 11111

------XXX
Content-Disposition:form-data; name = "username"

kim
------XXX
Content-Disposition:form-data;name="age"

20
------XXX
Content-Disposition:form-data;name="file1";filename="intro.png"
Content-Type:image/png

sdifsjfmldgjlmdkvdlfsdfj
------XXX--

HTML Form 데이터 전송

정리

• HTML Form submit시 POST전송
  예) 회원가입, 상품주문,데이터 변경
• Content-type : application/x-www-form-urlencoded 사용
  form 내용을 메시지 바디를 통해서 전송(key=value, 쿼리파라미터 형식)
  전송 데이터를 url encoding처리
  예) abe김 => abc%EA%B9%80
• HTML Form은 GET전송도 쿼리파라미터 형식으로 가능
• Content-Type은 파일 업로드같은 바이너리 데이터 전송시 사용 가능하고 다른종류의 여러파일 과 폼의 내용을 함께 전송이 가능하다 (그래서 이름이 multipart)
• HTML의 Form전송은 GET과 POST만 지원 가능하다

HTML API 데이터 전송

웹클라이언트
자바스크립트를 통한(AJAX)통신, react 같은 웹 클라이언트와 API통신
Content-Type : application/json을 주로 사용( 사실상 표준)

정리

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

1. 쿼리 파라미터
   • GET
   • 주로 정렬 필터
2. 메세지 바디를 통한 데이터 전송
   • POST,PUT,PATCH
   • 회원가입 상품주문, 리소스 등록, 리소스 변경

클라이언트에서 서버로 데이터 전송 4 가지 상황

1. 정적 데이터 조회
2. 동적 데이터 조회
3. HTML Form을 통한 데이터 전송
   • 회원가입, 상품주문, 데이터 변경
4. HTTP API를 통한 데이터 전송
   • 회원가입, 상품주문, 데이터 변경
   • 서버 to 서버, 앱클라이언트, 웹클라이언트(ajax)