PRG 패턴 : Post → Redirect → Get

PRG 패턴이란?

웹 개발 패턴 중 자주 사용되는 패턴으로 HTTP POST 요청에 대한 응답이 GET 요청을 위한 URI로 리다이렉트되는 것이다.

 

현재 문제점

 

1. 상품 등록 버튼을 누르면 POST로 /add를 호출한다. 그 후 결과물이 POST로 남아있다.
2. 마지막으로 요청한 것은 POST/add이다.
3. 그 결과 새로고침을 하면 마지막 요청이 반복되므로 id만 증가하고 중복된 상품이 계속 등록된다.
4. 웹 브라우저의 새로고침은 마지막에 서버에 전송한 데이터를 다시 전송하기 때문이다.

 

등록완료 페이지에서 새로고침을 누르게되면 이런식으로 중복된 데이터가 계속 쌓이게 된다.

 

이것을 해결할 수 있는 방법이 PRG 패턴을 적용시키는 것이다.

 

PRG 패턴 적용 후 흐름

 

1. 상품 등록 버튼을 누르면 POST /add가 호출된다.
2. 저장이 처리가 되면 기존과 다르게 Redirect를 하고 /items/{itemId}를 호출한다.
3. Redirect 처리가 들어왔기때문에 GET /items/{itemId}를 요청하게 되고 상품 상세 페이지가 보이게 된다.
4. 여기서 새로고침을 했을 경우엔 기존과 다르게 GET /items{itemId} 이므로 같은 상품 상세 페이지에서 계속 새로고침이 될 것 이다.

 

코드로 구현을 해보자. 비교적 매우 간단하게 이 문제를 해결할 수 있다.

 

                                  [기존코드]                                                                                                   [변경한 코드]

 

기존에는 save()를 처리하고 return으로 뷰만 보여주었지만, redirect:/를 추가해 리다이렉트를 해주면 해결이 된다.

 

하지만 여기서 주의할 점이 있다.

 

위의 코드에서

return "redirect:/basic/items/" + item.getId();

 

이 부분이 문제가 있다.

 

URL에 변수를 더해서 반환하도록 했는데 이렇게 사용할 경우 한글이나 띄어쓰기가 있을 경우 URL 인코딩의 문제가 있어 위험하다.

 

그래서 이런 경우엔 RedirectAttributes를 사용해 해결해야 한다.

 

RedirectAttributes 적용한 코드