사용자가 웹에서 특정 데이터를 요청했을 경우, 우리는 이 데이터를 어떻게 넘기고 결괏값을 보여줄 것인지를 정해야 한다. 이것을 진행하는 것이 바로 HTTP(Hyper Text Transfer Protocol)이다. HTTP는 브라우저와 서버가 통신할 수 있도록 만들어주는 여러 프로토콜(규약, 규칙) 가운데 한 종류로, 웹 브라우저와 웹 서버 사이에 HTML문서를 주고받는데 쓰이는 통신 프로토콜이다.
위와 같이 클라이언트(요청을 보내는 쪽, Requset)와 서버(요청을 받는 쪽, Respose)가 HTTP로 통신할 때, 데이터를 어떻게 넘길 것인가를 결정하는 것이 'GET'과 'POST'이다. 각 방식의 대표적인 특징을 먼저 살펴보고 이후 예시와 함께 직접 확인해 보자.
GET
GET방식의 대표적인 특징은 다음과 같다.
- 요청을 전송할 때 URL 주소 끝에 파라미터로 포함되어 전송된다.
- 데이터를 읽거나, 검색할 때에 사용된다. 따라서 데이터의 변형 위험이 없다.
- URL에 'key=value'값이 붙기 때문에 길이 제한이 있어 많은 양의 데이터를 보내기 어렵다.
- 값이 사용자에게 노출되어 보이므로 민감한 데이터를 다룰 때는 GET을 사용하면 안 된다.
- 동일한 요청을 여러 번 전송하더라도 동일한 응답이 돌아온다.
해당 웹페이지의 게시판 내 특정 카테고리를 선택했을 때, 사진의 주소창과 같이 URL 끝에 ?curPage=1이 붙는 것을 확인할 수 있다. 이를 쿼리스트링이라고 하는데, 사용자가 입력한 데이터를 전달하는 방법 중 하나로 URL 주소에 미리 협의된 데이터를 파라미터를 통해 넘기는 것을 말한다. curPage는 별도 설정해 둔 key의 이름으로 해당 페이지에서는 '페이징 번호' 값이 1페이지임을 나타내고 있다.
위와 같이 key=value값이 URL에 직접적으로 노출되므로 해당 주소값을 바로 북마크 처리하거나 인터넷 사용기록에 그대로 남는 것 또한 특징이다. 다만 민감한 데이터는 이와 같이 보이게 하면 안 되며, 길이 제한이 있어 많은 양의 데이터를 보내기 어렵다.
또한 주소값에 노출되어 있는 curPage의 값을 4로 변경하게 되면 4페이지로 화면이 변경된다. 이는 내가 4로 입력을 하든, 다른 사람이 4로 입력을 하던 4페이지로 변경되는 값은 동일하다. 또한 동일한 요청을 여러 번 요청하더라도 모두 동일한 결괏값을 받게 된다. (이를 멱등법칙 또는 멱등성이라고 한다.)
이와 같이 사용자가 해당 값을 확인할 수 있고, 조작할 수 있으므로 데이터를 읽거나 조회를 할 때는 GET방식을 이용해 데이터를 요청하게 된다.
POST
POST 방식의 특징은 다음과 같다.
- 전송해야 할 데이터를 HTTP 메시지의 Body안에 담아 전송한다.
- 길이 제한이 없으므로 상대적으로 대용량 데이터를 전송할 수 있다.
- GET방식과 다르게 북마크, 브라우저 히스토리에 남지 않는다.
- 서버에 동일한 여러 번 전송해도 응답은 매번 달라질 수 있다.
- 서버의 상태나 데이터를 변경시킬 때 사용된다.
티스토리에 게시글을 작성, 수정하고 저장버튼을 누르면 내가 작성한 글 데이터가 서버로 전달되어야 한다. 이전 GET의 예시와 같이 카테고리를 단순 조회할 때는 주소값에 해당 페이징 번호가 쿼리스트링으로 노출되었는데, 게시글 작성 후 저장할 때는 저장될 때나 그 후에 페이지가 넘어갈 때나 별다른 key=value값이 보이지 않는다. POST 방식은 HTTP의 Body 안에 담아 보내므로, 사용자에게 직접적으로 보여지지 않기 때문이다.
또한 내가 글을 작성했다면 내 이름으로 게시글이 발행되어야 하고, 다른 사람이 작성한다면 해당 이름으로 게시글이 발행되어야 한다. 따라서 동일한 글을 동시에 작성하여 저장하더라도 응답이 달라진다. 이와 같이 POST는 서버의 상태나 데이터를 변경시킬 때 사용된다. 다만, 완벽하게 데이터를 숨길 수는 없다. 개발자도구 등으로 확인할 수 있기 때문에 별도의 보안처리도 병행하는 것이 좋다.
[참고 자료]
https://hongsii.github.io/2017/08/02/what-is-the-difference-get-and-post/
https://developer.mozilla.org/ko/docs/Web/HTTP/Methods/POST
'Front-End > Web' 카테고리의 다른 글
[Browser] Web Storage(Local Storage, Session Storage) 알아보기 (0) | 2023.07.22 |
---|