안드로이드/ios webview 자바스크립트로 뒤로가기 감지하기

안드로이드/ios의 webview에서 자바스크립트로 뒤로가기를 감지하는 방법

 

* 앱에서 뒤로가기가 시작되면 자바스크립트에서 뒤로가기 이벤트를 블로킹 할 수는 없습니다.

* 아래 코드를 사용하면 뒤로 가기 이벤트를 감지 해서 앱에서 제공하는 javascriptinterface를 호출하는 방식으로 중간에 코드를 실행할 수 있습니다.

 

아이폰에서 뒤로 가기 감지

//  뒤로가기 이벤트 감지 - ios 전용
window.onpageshow = function (event) {
    if (event.persisted || 
    	(window.performance && window.performance.navigation.type == 2)) {
              // 실행할 이벤트 - javascriptinterface 호출 등...
    }
}

안드로이드에서 뒤로 가기 감지

//  안드로이드에서 뒤로 감기 감지를 위한 플래그 값
var checkPageShow = false;

window.onpageshow = function (event) {
	checkPageShow = true;
    
    if (event.persisted || 
    	(window.performance && window.performance.navigation.type == 2)) {
              // 실행할 이벤트 - javascriptinterface 호출 등...
    }
}



//  뒤로가기 이벤트 감지하여 웹뷰 화면 내리기 - aos 전용
window.onpagehide = function (event) {
	if ((window.performance.navigation.type == 0 || 
    	window.performance.navigation.type == 2) && checkPageShow) {
        // 실행할 이벤트 - javascriptinterface 호출 등...
    }
 }
    	

안드로이드에서는 onpageshow로 감지를 못해서 onpageshow이벤트 발생시 플래그 값을 선언하고 

onpagehide 이벤트가 실행될 때 플래그 값을 확인하여 사용해야 합니다.

 

 

* 다른 방식으로 앱에서 뒤로가기 이벤트를 감지한 후 웹에 있는

특정 자바스크립트를 호출하여 뒤로 가기 이벤트를 웹에서

처리할 수 있게 하는 방법이 있습니다.