[안드로이드 - 휴대폰 본인인증] 뒤로가기 버튼 클릭시 하얀화면 / 페이지를 표시할 수 없습니다는 화면 렌더링 이슈

[SoleeChoi]

안녕하세요 아임포트 기술지원팀입니다.

현재 iamport_flutter v0.9.10에서 휴대폰 본인인증시 안드로이드 기기에서 뒤로가기 버튼을 누르면
하얀화면 또는 페이지를 표시할 수 없습니다라는 화면이 렌더링 되는 이슈가 있습니다.

두 이슈의 원인은 조금 다릅니다.

1. 하얀화면 이슈

iamport_flutter v0.9.10까지는 휴대폰 본인인증 화면을 iframe 방식으로 띄웠습니다.
맨 처음엔 빈 웹뷰를 렌더링 하고, 아임포트 관리자페이지에 설정된 PG모듈 개수 만큼 iframe(display: none)을 만들고
이 중 실제로 렌더링 하고자 하는 iframe을 찾아 display 속성을 block으로 바꿔 알맞은 결제/본인인증 창을 렌더링하는 방식입니다.

때문에 휴대폰 본인인증 화면이 렌더링 된 후, 뒤로가기 버튼을 누르면
맨 처음 비어있던, 즉 하얀 화면이 렌더링 되는 것입니다.

이를 해결하기 위해 v0.9.11부터는 휴대폰 본인인증 창을 렌더링 하는 방식을 iframe 방식에서 리디렉션 방식으로 변경하였습니다.
리디렉션 방식은 웹뷰 자체가 처음 렌더링 될 때부터 다날의 URL로 리디렉션 되기 때문에
뒤로가기를 누르면 더이상 뒤로 갈 곳이 없어 웹뷰가 destroy 되므로 이슈가 해결됩니다.
따라서 하얀화면 이슈를 해결하려면 iamport_flutter 패키지를 단순히 v0.9.11로 업데이트 해주시면 됩니다.

2. 페이지를 표시할 수 없습니다 이슈

안드로이드 네이티브 웹뷰는 화면을 렌더링할때 리소스를 어떤 방식으로 불러올 것인가를 설정할 수 있는 setCacheMode 인터페이스를 제공합니다.
기본값은 LOAD_DEFAULT이며 캐시가 유효하면 캐시를 참조하고, 그렇지 않은 경우엔 네트워크를 이용한다는 것을 의미합니다.
정확한 원인은 파악하지 못했지만 디버깅을 통해 이 값을 LOAD_CACHE_ELSE_NETWORK로 설정해야 뒤로가기를 했을때 정상적으로 동작하는 것으로 파악했습니다.

하지만 iamport_flutter가 dependent 하고 있는 flutter_webview_plugin이 cacheMode를 설정할 수 있는 인터페이스를 제공하고 있지 않습니다.
따라서 아임포트는 해당 인터페이스를 추가해 PR을 날렸으나, 장기간 머지가 되고 있지 않는 상황입니다.

구현이 시급한 고객님들을 위해 PR시 fork뜬 flutter_webview_plugin을 참조하고 있는 브랜치(feature/forked_flutter_webview_plugin)를 만들었습니다.
급하신 분들은 PR이 머지될때까지 아래와 같이 pubspect.yaml 파일에 위 브랜치를 선언하셔서 사용해주시면 됩니다.

dependencies:
  iamport_flutter:
    git:
      url: git://github.com/iamport/iamport_flutter.git
      ref: feature/forked_flutter_webview_plugin

이용에 참고 부탁드립니다.
감사합니다.