웹 개발에서 클라이언트와 서버 간에 데이터를 주고받는 방식에 대하여 알아보자.

이 포스팅으로 HTTP Method와 데이터의 형식에 대한 기본을 이해할 수 있기를 바란다.

'HTTP', 'HTTP Method', 'GET', 'POST', 'Query String', 'form'


1.Query String

1-1. 정의 : URL을 사용하여 서버로 데이터를 보내는 방식

1-2. 사용 : 통상 GET 메서드와 사용된다.

EX) "https://api.example.com/search?query=제목+쿼리&page=1"

1-3. 형식 : 키-값 구조 [?key1=value1&key2=value2] 

1-4. 한계

  • URL에 노출되기 때문에 보안 및 기밀성에 위배되지 않는 데이터만 사용한다.
  • URL 문자열이기 때문에 많은 양의 데이터 처리에 부적합하다.

 

2. form-body

2-1. 정의 : HTTP request body에 요청 데이터를 전달 한다.

2-2. 사용 : 통상 POST 메서드와 사용된다.

  • HTTP Form
<form action="https://api.example.com/user" method="POST">
  <label for="username">Username:</label>
  <input type="text" id="username" name="username"><br>
  <label for="password">Password:</label>
  <input type="password" id="password" name="password"><br>
  <input type="submit" value="Submit">
</form>

2-3. 형식 : URL-Encoded or JSON

  • URL-Encoded
Content-Type: application/x-www-form-urlencoded

username=yangJa&password=yangJaPwd
  • JSON
Content-Type: application/json

{
  "username": "yangJa",
  "password": "yangJaPwd"
}

2-3. 장점 : 더 나은 보안을 제공 받을 수 있고 많은 양의 데이터 처리가 가능하다.

3.결론

HTTP에 대한 심화나 RESTful API를 경험하였으면 HTTP Method나 데이터 처리에 대한 정확한 사용 및 고민을 해보게 된다.

그에 앞서 클라이언트 서버간 웹통신을 하게 될 경우 데이터 양식 사용에 대한 기본과 간단한 예제를 확인하였다.


https://developer.mozilla.org/ko/docs/Web/HTTP/Methods/GET

 

GET - HTTP | MDN

HTTP GET 메서드는 특정한 리소스를 가져오도록 요청합니다. GET 요청은 데이터를 가져올 때만 사용해야 합니다.

developer.mozilla.org

https://developer.mozilla.org/ko/docs/Web/HTTP/Methods/POST

 

POST - HTTP | MDN

HTTP POST 메서드는 서버로 데이터를 전송합니다. 요청 본문의 유형은 Content-Type 헤더로 나타냅니다.

developer.mozilla.org

 

+ Recent posts