[iOS] WKWebView 웹뷰를 백그라운드에 오래 두면 흰 화면만 보이는 백화현상 해결 (webViewWebContentProcessDidTerminate)

 

웹뷰화면을 사용하다가 백그라운드로 내려둔 채 다른 앱들을 사용한 후 다시 웹뷰화면이 띄워져있는 앱을 실행하면

간혹 웹뷰영역이 하얗게 변한 채 아무런 컨텐츠도 보이지 않는 현상이 발생할 때가 있습니다.

 

 

요렇게요..🤦‍♀️

 

 

📌  원인

iOS의 WKWebView는 웹뷰가 너무 많은 리소스를 사용할 경우 크래시가 일어나 웹뷰 프로세스를 종료시켜버립니다.

이 때 웹뷰 프로세스가 종료되면서 빈 하얀색 화면만이 뜨게 되는 것입니다.

(UIWebview는 크래시가 나면 앱을 종료시켜버렸는데, WKWebView는 크래시가 나면 웹뷰만 종료된다고 합니다.)

 

 

📌  재현방법

웹뷰를 사용하는 앱을 백그라운드에 내려 놓고,

기기의 메모리 리소스 사용량을 높이기 위해 다른 앱들을 10~20개 정도 실행합니다.

그리고 다시 백그라운드에 있던 앱을 실행하면! 보고 싶었던(?) 흰 화면을 만날 수 있습니다.

 

이 상황에 Xcode의 로그를 확인해보면 다음과 같이 로그가 찍혀 있는 것을 확인할 수 있습니다.

WebProcessProxy::processDidTerminateOrFailedToLaunch: reason=Crash

 

나: 메모리 막 쓸게

웹뷰: ㅇㅇ 죽어줄게

 

 

 

📌  해결방법

 

다행히도 WKNavigationDelegate에 해당 현상에 대한 콜백함수가 존재합니다.

 

바로

webViewWebContentProcessDidTerminate

웹뷰의 웹 content 프로세스가 종료되었음을 알리는 함수입니다.

 

https://developer.apple.com/documentation/webkit/wknavigationdelegate/1455639-webviewwebcontentprocessdidtermi

 

이 함수에 다음과 같이 원하는 동작을 구현해주시면 됩니다.

보통은 웹뷰를 리로드해주면 웹 컨텐츠들을 다시 받아올 수 있습니다.

 

func webViewWebContentProcessDidTerminate(_ webView: WKWebView){
    webView.reload()
}

 

 

---

 

참고

https://jinhongstar.tistory.com/98?category=599627 

https://velog.io/@young_mason/React-Native-ios%EC%97%90%EC%84%9C-%ED%9D%B0%ED%99%94%EB%A9%B4%EC%9D%B4-%EB%9C%A8%EB%8A%94-%EB%AC%B8%EC%A0%9C