하이브리드나 웹앱은 Native에서 Webview를 사용하여 웹형식의 컨텐츠를 표시하고 동작하는 앱을 말합니다.
( 참고 : '위키백과 - 웹 애플리케이션’, '나무위키 - 하이브리드 앱’ )
이번 포스팅은 하이브리드 앱 혹은 웹 앱에서 Webview안에 표시되는 웹 컨텐츠의 디버깅 방법을 다룹니다.
디버깅용 WebView 구성
애플리케이션 내에서 WebView 디버깅이 활성화되어 있어야 합니다. WebView 디버깅을 활성화하려면 WebView 클래스에서 정적 메서드 setWebContentsDebuggingEnabled를 호출합니다.if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
WebView.setWebContentsDebuggingEnabled(true);
}
DevTools에서 WebView 열기
chrome://inspect 페이지는 기기에 디버그 지원 WebView 목록을 표시합니다.
디버깅을 시작하려면 디버그하려는 WebView 아래에서 inspect를 클릭합니다. 원격 브라우저 탭에서와 마찬가지로 DevTools를 사용합니다.
출처 : https://developers.google.com/web/tools/chrome-devtools/remote-debugging/webviews?hl=ko
추가 팁!
WebChromeClient의 onConsoleMessage(), onJsAlert(), onJsConfirm()을 Override하여 Logcat에 로그를 남기면 위의 방법을 이용하지 않더라도 어느정도 디버깅에 필요한 정보를 얻을 수 있습니다.
public class CustomWebChromeClient extends WebChromeClient {
@Override
public boolean onConsoleMessage(ConsoleMessage consoleMessage) {
// TODO
return true;
}
@Override
public boolean onJsAlert(WebView view, String url, String message, final JsResult result) {
// TODO
return true;
}
@Override
public boolean onJsConfirm(WebView view, String url, String message, JsResult result) {
// TODO
return super.onJsConfirm(view, url, message, result);
}
}
반응형
'프로그래밍 > Android' 카테고리의 다른 글
| Android P 에서 Heads Up Notification 표시하는 방법. (0) | 2019.01.23 |
|---|---|
| Firebase Cloud Messaging(FCM) 제대로 알고 사용하자! (0) | 2019.01.23 |
| jarsigner/apksigner로 apk signing하기 (콘솔에서 Signing 하기) (0) | 2019.01.15 |
| RxAndroid로 리액티브 앱 만들기 #4 (1) | 2016.10.14 |
| RxAndroid로 리액티브 앱 만들기 #3 (0) | 2016.10.14 |