PRG Post/Redirect/Get와 RedirectAttributes

PRG Post/Redirect/Get

Post/Redirect/Get 패턴은 사용자가 페이지를 새로고침하거나 브라우저에서 뒤로 화살표를 클릭할 때 중복된 양식 제출을 방지하는 패턴이다.
Post 방식으로 온 요청에 대해서 Get 방식으로 웹페이지를 Redirect 시키는 패턴이라고 말할 수 있다.

 

중복 등록 예시

사용자가 회원가입을 완료한 다음, 바로 확인 페이지로 이동된다고 가정

• 사용자가 회원가입을 위해 회원가입 페이지로 이동
• 회원가입에 필요한 여러 데이터 입력
• 회원가입 버튼 클릭 (POST 요청)
• 회원가입 성공 (서버에서 회원가입 로직 성공)
• 회원가입 성공 확인 페이지로 이동 (성공 확인 페이지로 forward)
• 사용자가 브라우저에서 "새로 고침" 또는 "뒤로"를 클릭
• 만약 Post/Redirect/Get이 구현되지 않으면 POST 양식(즉, 회원가입)이 서버로 다시 전송됨. 중복된 데이터 등록
  • 새로 고침 시 마지막에 서버에 전송한 데이터가 다시 전송되기 때문

이때 브라우저는 alert창으로 사용자에게 데이터를 정말로 다시 보낼 것인지 묻지만, 그러나 질문을 이해하지 못하고 다시 전송하게 된다면 중복된 데이터가 서버에 등록되게 된다.

 

해결 방법

사용자가 회원가입을 완료한 다음, 바로 확인 페이지로 이동한다고 가정

• 사용자가 회원가입을 위해 회원가입 페이지로 이동
• 회원가입에 필요한 여러 데이터 입력
• 회원가입 버튼 클릭 (POST 요청)
• 회원가입 성공 (서버에서 회원가입 로직 성공 후 성공 확인 페이지로 forward가 아닌, 새 URL로 redirect - 상태코드 3xx 포함)
• 회원가입 성공 확인 페이지로 이동 (브라우저에서 서버에게 다시 GET 방식으로 성공 확인 페이지 요청)
• 사용자가 브라우저에서 "새로 고침" 또는 "뒤로"를 클릭 (이전에 서버에 전송한 데이터가 GET 방식으로 요청한 성공 확인 페이지이기 때문에 다시 GET 요청 보냄)
• 회원가입 성공 확인 페이지로 다시 이동

 

/**
 * PRG - Post/Redirect/Get
 */
@PostMapping("/member")
public String createMember(Member member) {
 memberRepository.save(member);
 return "redirect:/member/+ member.getId()"; // 회원가입 성공 페이지로 redirect
}

 

RedirectAttributes (Spring)

/**
 * RedirectAttributes
 * URL 인코딩도 해주고 PathVariable, Query Parameter도 설정해서 리다이렉트 해준다.
 */
@PostMapping("/member")
public String createMemberVer2(Member member, RedirectAttributes redirectAttributes) {
 Member savedMember = memberRepository.save(member);
 redirectAttributes.addAttribute("memberId", savedMember.getId());
 redirectAttributes.addAttribute("status", true);
 return "redirect:/member/{memberId}"; // memberId는 바인딩, 나머지는 쿼리 파라미터로 처리
}