김미썸코딩

페이지에서 '좋아요' 를 하고 뒤로 가기 한 후 다시 돌아왔을때 처리 본문

빅데이터 플랫폼 구축을 위한 자바 개발자 양성과정/랜선여행 커뮤니티 프로젝트

페이지에서 '좋아요' 를 하고 뒤로 가기 한 후 다시 돌아왔을때 처리

김미썸 2021. 3. 29. 17:27
728x90

만약 페이지에서 '좋아요'를 한 후, 뒤로가기 버튼을 누르고 다시 돌아오면 '좋아요'했던것이 반영이 되어 있지 않다.

그때 다시 '좋아요'를 누르게 되면 데이터에 이상한 값이 들어가게 된다. 

이것을 해결하기 위한 방법이다.

 

아래 코드를 <script>에 추가하면 된다. 

뒤로가기후 다시 돌아왔을 때 페이지가 reload되는 동안 '좋아요'를 누르지 못하게 막는다.

//페이지가 뒤로가기 하면 하트버튼과 하트수 갱신이 안된다. 이때 하트를 누르면 디비에 중복으로 값이 들어가진다.
//방지하기 위해 페이지가 뒤로가기 할때마다 css로 클릭을 막고 새로고침을 통해 갱신된 하트버튼과 하트수가 나오도록 한다.
$(window).bind("pageshow", function (event) {
   //파이어폭스와 사파리에서는 persisted를 통해서 뒤로가기 감지가 가능하지만 익스와 크롬에서는 불가  ||뒤의 코드를 추가한다. 
   if (event.originalEvent.persisted || (window.performance && window.performance.navigation.type == 2)) {
      console.log('BFCahe로부터 복원됨');
      $(".heart-click").css("pointer-events","none");
      location.reload();//새로고침 
   }
   else {
      console.log('새로 열린 페이지');
   }
});
728x90
Comments