본문 바로가기
스프링/스프링 웹

[Spring] HTTP 요청 데이터 - POST HTML Form

by drCode 2023. 5. 17.
728x90
반응형

이번에는 HTML Form으로 POST 방식으로 데이터를 넘겨본다.

 

 

이 경로로 hello-form.html 을 생성한다

hello-form.html

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>Title</title>
</head>
<body>
<form action="/request-param" method="post">
 username: <input type="text" name="username" />
 age: <input type="text" name="age" />
 <button type="submit">전송</button>
</form>
</body>
</html>

 

데이터 입력 후 전송
서버 로그가 그대로 나온다

 

일일이 데이터를 폼에 입력해서 보내기 귀찮을 땐?

 

포스트맨을 이용하면 된다.

 

POST 전송시

Body는 x-www-form-urlencoded  를 선택해야하고,

Headers에서 content-type :  application/x-www-form-urlencoded로 지정된 부분을 꼭 확인해봐야 한다.

 

포스트맨 활용
포스트맨 콘솔로그 결과

 

※ 주의사항

웹 브라우저가 결과를 캐시하고 있어서, 과거에 작성했던 html 결과가 보이는 경우도 있다.

이 때는 웹 브라우저의 새로 고침을 직접 선택해주면 된다.

물론 서버를 재시작하지 않아서 그럴 수 있다.

 

POST의 HTML Form을 전송하면 웹 브라우저는 다음 형식으로 HTTP 메시지를 만든다.(웹 브라우저 개발자 모드 확인)

 - 요청 URL: http://localhost:8080/request-param

 - content-type: application/x-www-form-urlencoded

 - message body: username=hello&age=20

 

 

application/x-www-form-urlencoded 형식은 앞서 GET에서 살펴본 쿼리 파라미터 형식과 같다.

따라서 쿼리 파라미터 조회 메서드를 그대로 사용한다.

클라이언트(웹 브라우저) 입장에서는 두 방식 차이가 있지만, 서버 입장에서는 둘의 형식이 동일하므로,

request.getParameter()로 편리하게 구분없이 조회할 수 있다.

 

정리하면 request.getParameter()는 GET URL 쿼리 파라미터 형식도 지원하고, POST HTML Form 형식도 둘 다 지원한다.

 

참고로, content-type은 HTTP 메시지 바디의 데이터 형식을 지정한다.

GET URL 쿼리 파라미터 형식으로 클라이언트에서 서버로 데이터를 전달할 때는 HTTP 메시지 바디를 사용하지 않기 때문에 content-type이 없다.

POST HTML Form 형식으로 데이터를 전달하면 HTTP 메시지 바디에 해당 데이터를 포함해서 보내기 때문에

바디에 포함된 데이터가 어떤 형식인지 content-type을 꼭 지정해야 한다.

이렇게 폼 데이터를 전송하는 형식을 application/x-www-form-urlencoded 라 한다.

 

 

728x90
반응형

댓글