티스토리 뷰

Programming/HTML

[HTML]GET & POST

heyhyo 2018. 7. 30. 14:31

우리가 HTML로 어떤 양식의 데이터를 전송할 때 반드시 다음과 같은 형식으로 form 태그를 달아 주어야 한다.



<코드>

<form action="index.jsp" method="get">
</form>



여기서 우리는 '이 태그 안에 있는 폼 데이터들은 action 속성에 명시된 index.jsp 스크립트 파일에 의해서 method 속성에 명시된 get 방식으로 처리하시오.'라는 말로 받아들일 수 있다. 여기서 항상 궁금했던 부분이 있다. method 속성이다. 이 속성은 get 과 post 이 두 가지를 값으로 가질 수 있다. 그렇다면 각 값을 달리했을 때의 차이점을 알아보도록 하자.




GET vs POST



별 생각 없이 긴 글은 post, 몇 개의 짧은 데이터들은 get 방식으로 사용한다고 지금까지 생각했었다. 하지만 문득 겨우 이런 이유로 나눠놨을까? 하는 생각이 들었다. 찾아보니 각 방식의 차이점이 극명하게 보였다.


먼저 GET 방식으로 클라이언트에서 서버로 데이터를 전송할 때는 URL에 데이터를 넣어서 전송한다. 그 형식은 ? 연산자 뒤에 변수 이름과 그 을 넣어서 보내는 형식이다. 이 형식을 Query String 형식이라고 한다. 흔하게 볼 수 있는 방식으로 아래 스크린샷을 보면 알 수 있을 것이다.





현재 편집중인 블로그 페이지의 URL을 캡쳐한 사진이다. 뒤에 ? 연산자를 시작으로 여러가지 변수들과 그 값이 & 연산자로 연결되어 나열된 모습이다. 이 페이지에서는 id, type, returnURL이라는 세 가지 변수를 서버에게 GET 방식으로 넘기고 있다.



POST 방식으로 주고받을 때에는 URL이 아닌 HTTP 패킷에 그 값을 넣어서 보내게 된다. 따라서 URL을 통해서는 확인이 불가능하다. 패킷의 정보를 열어봐야만 그 데이터를 확인할 수 있다. 정확히 말하면 HTTP 패킷에 있는 Body 부분에 값을 넣어준다.


form 태그를 작성할 때 POST 방식은 GET 방식과 다른 점이 하나 있다. 인코딩 형식을 지정해 주어야 한다는 것이다. 인코딩 형식을 생략하면 기본 값으로 데이터가 전송되지만, 각 용도에 따라 다른 속성 값을 지정해 줄 수 있다. 아래의 예로 어떤 종류가 있는지 알아보자.



<코드>

<form action="index.jsp" method="post" enctype="text/plain">
</form>



위에서 GET 방식의 form 태그와 비슷하지만 뒤에 enctype이라는 속성이 추가된 것을 볼 수 있다. 생략했을 때는 기본값으로 자동 설정된다. encoding type의 준말로 이 속성 값은 폼을 전송할 때 그 폼의 인코딩 방식을 지정하는 역할을 한다. 이 속성의 값으로 올 수 있는 대표적인 세 가지 속성 값을 알아보자.



enctype="application/x-www-form-urlencoded"


이 값은 enctype을 지정해 주지 않을 경우에 기본값으로 설정되는 인코딩 형식이다. & 구분자로 각 변수와 값이 구분되며, id=24와 같은 형식으로 값이 전달된다. URL에 데이터를 함께 보내는 GET 방식에 과 같은 인코딩 형식이다.



enctype="text/plain"


이 값으로 지정해 주면 폼 데이터의 텍스트만 읽어와서 단순 txt 형태로 전송하는 형식이다.



enctype="multipart/form-data"


이 값은 파일 데이터 즉, 바이너리 데이터를 전송하고자 할 때 사용되는 값이다. 




HTTP 패킷



여기서 HTTP 패킷이라는 용어에 궁금증이 생길 수 있다. 먼저 브라우저는 서버에 요청을 하고 응답을 받을 때 HTTP(Hyper Text Transfer Protocol)라는 통신규약을 이용한다. 이 통신규약을 통해 데이터를 주고 받을 때 그 데이터를 HTTP 패킷의 형태로 주고 받게 된다. 이 패킷은 크게 두 부분으로 나뉜다.


HTTP Packet = Header + Body


헤더와 바디이다. 헤더에는 HTTP 패킷의 정보가 들어가게 되고, 바디에는 실제 보여지게 되는 데이터나, 실제로 데이터 처리에 필요한 데이터들이 들어가게 된다. form 태그에 post 형식을 지정해주면, 패킷의 body에 폼 데이터들이 동봉되어 전송되게 된다.


따라서 HTTP 패킷은 그 데이터의 양에 따라서 크기가 가변적이다.




보안성




GET방식은 URL에 데이터가 노출되어서 보안에 취약하지만, POST방식은 URL에 데이터가 노출되지 않기 때문에 일반사용자를 기준으로 생각하면 더 보안에 우수하다고 할 수 있다.


하지만 POST 방식도 만능은 아니다. 따라서 높은 수준의 보안이 필요한 데이터를 보내는 것은 위험하다. HTTP 패킷은 어렵지 않게 열어서 볼 수 있으므로, 보안성이 좋다고 착각해서는 안된다. 보안이 중요하다면 암호화는 두 방식 모두 필수로 수행해 줘야 한다.




언제 무엇을 사용하는 것일까?



GET 방식의 용도


GET 방식을 사용해야하는 이유는 URL를 다른 사람들과 공유할 때 확연히 드러난다. 만약 어떤 사이트에 특정한 게시글을 다른 사람들과 공유하고자 하면, URL에 어떤 개시글인지 경로를 함께 줄 필요가 있다. 이럴 때 GET 방식으로 파라미터를 받아서 게시글을 출력하는 페이지는 URL만 공유하면 게시글의 번호를 쿼리 스트링으로 함께 공유할 수가 있어서 링크를 공유하는 것에 있어 훨씬 효율적일 수 있다. 반면 POST 방식으로 사용했다면 게시글의 번호를 헤더에 숨겨서 전송하기 때문에 URL만으로는 그 게시글의 정확한 위치를 포함시킬 수 없다.


이와 연계하여 덧붙이자면, 폼을 사용하지 않아도 파라미터를 전송할 수 있다. 단순히 URL에 쿼리 문자열을 적어주기만 하면 되기 때문이다.


또한 GET 방식은 POST 방식에 비해 더 빠르다. 이는 GET 방식으로 데이터를 주고 받을 때 캐싱이라는 기술을 사용해서 이미 조회했던 사이트의 데이터를 저장시켜 놓을 수 있다.


GET 방식은 의미 그대로 '가져오다'라는 의미로 이해하면 쉬울 것 같다. 위의 예시들을 보면 어떤 게시판의 데이터를 쉽게 접근할 수 있는 장점을 가지고 있음을 알 수 있다. 따라서 어떤 특정한 페이지를 조회하고자 할 때는 GET을 사용하는 것이 바람직하다.



POST 방식의 용도


POST 방식으로 데이터를 전송할 때 데이터를 요청 URL에 붙여서 보내지 않아서 상대적으로 보안에 강하다는 점이다. GET 방식의 경우 URL에 쿼리 스트링 형식으로 데이터가 실리게 되므로 누구나 URL을 통해 데이터를 확인할 수 있다. 따라서 보안이 중요한 데이터를 보낼 때는 POST 방식으로 전송하는 것이 좋다.


다음으로는 전송할 데이터 길이가 매우 긴 경우에 사용하기에 알맞다. IE와 같은 브라우저의 경우 URL의 길이의 제한이 있어서 GET 방식으로 전송하는 데이터의 길이의 제한이 있다. 하지만, POST 방식은 HTTP 패킷의 Body부분에 삽입되어 전달되므로 그 길이는 제한이 없다.


따라서 로그인 데이터를 전송할 때, 블로그와 같이 긴 글을 게시할 때, 이 방식을 사용하여 전송하는 것이 좋다.



단순히 파라미터의 값을 URL에 실어서 보내느냐 HTTP 패킷에 포장하여 보내느냐의 차이가 아니라 애초에 용도가 다른 것이다. 처음 HTTP가 설계될 때도 GET은 말그대로 값을 가져오는 것, POST는 게시하는 것이라는 뜻이 있어서 이런 이름을 붙인 것이다.


물론 우리가 어떤 게시글을 포스팅할 때 서버로 GET방식으로 데이터를 전송해도 상관은 없다. 서버에서 파라미터 값을 읽어와서 DB에 저장하면 되기 때문이다. 하지만, 초기 HTTP 메소드의 설계 목적에 맞게, GET은 값을 가져오는 것, POST는 게시하는 것으로 이해하고 사용하는 것이 바람작히다.




URL의 길이제한



URL의 길이는 현재 각 브라우저에서 무제한으로 지원하는 추세이다. 물론 IE에서는 URL의 최대길이를 2048자로 제한을 하지만, IE를 제외한 주요 브라우저들은 GET 방식으로 URL길이의 제한이 없이 서버로 데이터 전송이 가능하다.


하지만 한국에서는 크롬 다음으로 높은 점유율을 가진 브라우저가 바로 IE이다. 따라서 IE에서 GET 방식으로 데이터를 전송하고 싶다면, 데이터의 길이가 길다면 가급적 POST방식을 사용하는 것이 좋다.


이렇게 모든 브라우저에서 데이터를 잘 표현하기 위한 웹 페이지 작성방법을 크로스 브라우징(Cross Browsing)이라고 한다.



HTTP Method



먼저 HTTP 메소드라는 것은 이 패킷이 서버에서 어떤 동작을 하느냐를 명시하는 역할을 한다. 따라서 GET으로 패킷이 전달되면 '이 패킷은 값을 가져오는 용도로 사용되는구나.'라고 서버에서 알 수 있고, POST로 패킷이 전달되면 '이 패킷은 데이터를 수정하는 패킷이구나.'라고 이해할 수 있는 것이다.


그렇다면 HTTP 패킷의 메소드의 종류는 GET 방식과 POST 방식만 존재할까? 아니다. 이 외에도 다른 방식이 존재하지만, 보안상의 이유로 서버에서 차단해 놓는 경우가 많다고 한다. 지원하는 메소드들은 아래와 같다.


GET, POST, DELETE, PUT, OPTIONS, CONNECT, HEAD, TRACE


보통 GET과 POST방식을 사용하지만, 다른 메소드들은 언제 사용되는지 다음 포스트의 주제로 다뤄보도록 하겠다.




참고



https://blog.outsider.ne.kr/312

http://interconnection.tistory.com/72

http://mommoo.tistory.com/60

https://en.wikipedia.org/wiki/HTTP_message_body

https://medium.com/@jongwonwoo/%ED%81%B4%EB%9D%BC%EC%9D%B4%EC%96%B8%ED%8A%B8-%EA%B0%9C%EB%B0%9C%EC%9E%90%EB%A1%9C%EC%84%9C-get%EA%B3%BC-post%EC%97%90-%EB%8C%80%ED%95%B4%EC%84%9C-%EC%95%8C%EC%95%84%EC%95%BC-%ED%95%A0-%EA%B2%83-cbaaa44a33b2

'Programming > HTML' 카테고리의 다른 글

[HTML]웹 퍼블리싱(Web Publilshing)  (0) 2018.08.09
[HTML]HTML의 역사  (8) 2018.07.27
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
«   2024/04   »
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30
글 보관함