[HTTP] 데이터를 전달하는 기본 방식

가끔 웹 화면을 개발하면서 기본적인 내용이지만, 당연하게 생각하면서 사용하고 있던 내용을 다시 한번

정리하고 싶어서 구글링을 통해 정리해 보았다.

---

쿼리파라미터

• Get에서 많이 사용
• 정렬 필터(검색어)를 사용할 때 사용

메시지 Body 

• Post, Put, Patch
• 회원가입, 상품주문, 리소승 등록, 리소스 변경등에 주로 사용

---

클라이언트 -> 서버로 데이터가 전송되는 4가지 예시

1. 정적 데이터 조회
   이미지, 정적 텍스트 문서 등
2. 동적 데이터 조회
   검색, 게시판 목록에서 정렬 필터(검색어)
3. HTML Form을 통한 데이터 전송
   회원가입, 상품 주문, 데이터 변경
4. HTTP API를 통한 데이터 전송
   회원가입, 상품주문, 데이터변경
   서버 to 서버, 앱 클라이언트, 웹 클라이언트(Ajax)

---

정적 데이터 조회

쿼리 파라미터 미사용

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

 

서버에서 클라이언트로 별 이미지를 내려준다. 이런 경우에는 추가적인 데이터를 서버에 전달하지 않고,

그냥 단순히 URI 경로를 이용해 서버에서 내려받아서 이미지 리소스를 클라이언트로 내려받을 수 있다.

---

동적 데이터 조회

조회를 할 때, 데이터 전달이 필요한 경우

• 검색, 게시판 목록에서 정렬 필터(검색어)
• 조회 조건을 줄여주는 필터, 조회 결과를 정렬하는 정렬 조건에 주로 사용
• 조회는 Get 사용
• Get은 쿼리 파라미터를 사용해서 데이터를 전달 가능

 

위처럼, search라는 경로에 검색어와 추가 데이터(q=hello, hl=ko)를 전달해야 할 때, 쿼리 파라미터 사용

서버에서는 쿼리 파라미터를 받아서 key, value로 꺼내서 사용할 수 있다.

 

Get 방식으로 요청 시 Body는 원래 보낼 수 없었지만, 2014년도부터는 Body를 보낼 수 있게 되었다.
하지만, 일부 클라이언트에서는 지원되지 않을 수 있어서 권장되지 않는다.
그래서 서버에서도 @RequestBody로 데이터를 받지 않도록 하자. 

---

HTML Form을 통한 데이터 전송

순수하게 HTML만 가지고 기능을 구현할 때는 form을 이용해서 원하는 기능을 구현

• 회원가입, 상품주문, 데이터 변경
• HTML Form 전송은 Get, Post 방식만 지원

Post 전송 방법 - 저장

 

 

참고

보통 username=kim&age=20 형식의 Content-type을 application/x-www-form-unlencoded라고 한다.

unlencoded란, 한글 같은 문자열이 넘어가면 '%%%'와 같은 문자로 인코딩이 돼서 넘어간다.

 

Get 전송 방법 - 조회

 

Get 방법은 Message Body를 사용하지 않기에 내용물을 쿼리 파라미터로 전달한다.

 

Get은 리소스를 저장하는 용도로 사용하지 말자. 오직 조회용도로만 사용하자.
이유? 쿼리 파라미터로 전달되면 중요한 내용이 다 노출될 수 있기 때문이다.

 

파일을 전송할 때

 

multipart/form-data라는 메시지 바디에 넣는 형식을 사용해야 한다.

이 방법은 주로 바이너리 데이터를 전송할 때 사용

---

HTTP API를 통한 데이터 전송

• HTML Form을 쓰지 않는 거의 모든 상황
• 회원가입, 상품주문, 데이터 변경
• 서버 to 서버, 앱 클라이언트, 웹 클라이언트(Ajax)

안드로이드나, Ios에서 클라이언트에서 서버로 데이터를 바로 전송하는 경우에는 우리는 HTTP API로 전송

 

 

Json으로 데이터를 넘기는 경우에 사용하는 방식이다.

일반적으로 Form 방식이 아닌, Ajax를 통해서 데이터를 넘기는 경우이다.

 

Post, Put, Patch 방식은 메시지 바디를 통해 데이터를 전송

Get 방식은 조회, 쿼리 파라미터로 전송

 

Content-Type : application/json을 사용 (표준)