[Javascript] 아이패드 아이폰에서는 onbeforeunload 대신 onpagehide 사용

아이패드에서 특정 기능이 수행되지 않는 버그가 있었다.

의견을 입력하고 확인 버튼을 누를 수 있는 창이 있었는데(의견창), 이 의견창이 문제였다.

윈도우 PC, 맥 PC, 안드로이드 폰 모두 잘 동작하는 기능이었는데 아이패드에서만 동작하지 않았다.

창은 잘 열렸으나(window.open으로 창을 띄웠음) 확인 버튼을 누르면 아무 반응이 없고 그다음 로직을 타지 않았다.

알고보니 해당 윈도우 창의 js 콜백함수 호출이 onbeforeunload 안에 들어있었기 때문이었다.

아이패드, 아이폰의 사파리 브라우저는 onbeforeunload 가 동작하지 않고, onpagehide 라는 함수를 타는 것으로 보인다.

아이패드, 아이폰의 경우 창 닫힘 시 이벤트를 부여하려면 window.onpagehide = function() {} 또는 window.addEventListener(“pagehide”, function(event) {}); 식으로 코딩하면 된다.

실제로는 window.onbeforeunload 함수 안에 있던 콜백함수 호출 코드를 잘라내고, 확인 버튼 클릭 시의 이벤트 안으로 옮겨서 OS 및 브라우저 디펜던시 상관없이 동작하도록 수정했다.

참고할만한 코드는 아래.

var isOnIOS = navigator.userAgent.match(/iPad/i)|| navigator.userAgent.match(/iPhone/i);
var eventName = isOnIOS ? “pagehide” : “beforeunload”;

window.addEventListener(eventName, function(event) {
…
});