[7] 클라이언트에서 서버로 HTTP 데이터 전송 4가지

1. 정적 데이터 조회

쿼리 파라미터를 사용하지 않고 단순히 정적 데이터를 GET 메서드를 통해 조회 할 수 있다.

보통 정적 데이터 조회는 캐시를 사용하여 좀 더 효율적으로 조회할 수 있다.

 

ex) GET /index.html 

2. 동적 데이터 조회

쿼리 파라미터를 사용하여 클라이언트에서 원하는 정보를 조회할 수 있다. 주로 검색할 때 정렬필터를 쿼리파라미터로 사용한다.

POST로 조회한다면 바디에 정렬필터를 포함하여 요청할 수 있으나 주로 GET을 사용한다.

 

ex) GET /search?q=hello&hl=ko 

3. HTML Form 을 통한 데이터 전송

<form action="/save" method="post" class="form-example">
  <div class="form-example">
    <label for="name">Enter your name: </label>
    <input type="text" name="name" id="name" required>
  </div>
  <div class="form-example">
    <label for="email">Enter your email: </label>
    <input type="email" name="email" id="email" required>
  </div>
  <div class="form-example">
    <input type="submit" value="Subscribe!">
  </div>
</form>

만약 POST로 데이터를 전송한다면 아래와 같은 HTTP 메세지가 생성된다.

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

name=kim&email=hello@abc.com

 

Content-Type: application/x-www-form-urlencoded 는 HTML Form 의 input 값을 key=value 형태로 만들어서 바디에 추가한다.

만약 바이너리데이터 즉, 파일을 보내고 싶다면 Content-Type: multipart/form-data 를 사용한다. multipart 를 사용하기 위해서는 HTML form 태그에 아래처럼 추가한다.

<form action="/save" method="post" class="form-example" enctype="multipart/form-data">
...

-----  get 요청도 가능함 

<form action="/save" method="get" class="form-example">
  <div class="form-example">
    <label for="name">Enter your name: </label>
    <input type="text" name="name" id="name" required>
  </div>
  <div class="form-example">
    <label for="email">Enter your email: </label>
    <input type="email" name="email" id="email" required>
  </div>
  <div class="form-example">
    <input type="submit" value="Subscribe!">
  </div>
</form>

get 요청이라면 쿼리 파라미터로 자동으로 URI를 생성하여 요청을 보낸다. 요청은 아래와 같다.

GET /save?name=kim&email=hello@abc.com HTTP/1.1
Host: localhost:8080

4. HTTP API 사용 및 설계

 

HTTP API 사용하는 곳

1) 서버와 서버간의 통신 

2) 앱 클라이언트와 통신 (안드로이드, 아이폰)

3) 웹 클라이언트와 통신 (React , Vue 와 같은 웹클라이언트와 API 통신)

 

 

HTTP API 설계

restfulapi.net/resource-naming/

REST API Naming Conventions and Best Practices

- Document

단일 개념. 데이터베이스 행 하나 혹은 인스턴스를 의미한다. 

http://api.example.com/device-management/managed-devices/{device-id}
http://api.example.com/user-management/users/{id}
http://api.example.com/user-management/users/admin

- Collection

서버가 관리하는 리소스 디렉토리이다. 

POST 기반으로 등록한다.

http://api.example.com/device-management/managed-devices
http://api.example.com/user-management/users
http://api.example.com/user-management/users/{id}/accounts

- Store

클라이언트가 관리하는 리소스 디렉토리이다.

PUT 기반으로 등록한다.

http://api.example.com/song-management/users/{id}/playlists

 

- Controller

위의 내용으로 해결하기 어려울때 사용한다. API 이름을 동사형으로 지칭한다.

http://api.example.com/cart-management/users/{id}/cart/checkout
http://api.example.com/song-management/users/{id}/playlist/play