개발 머신에서 실행되는 Chrome 브라우저에 내장된 DevTools를 사용하여 앱에서 실행되는 WebView를 원격으로 검사하고 디버깅할 수 있습니다. WebView의 원격 디버깅에 관한 자세한 가이드는 WebView 원격 디버깅을 참고하세요.
DevTools에 대해 자세히 알아보려면 Chrome DevTools 개요를 참고하세요.
Chrome DevTools에서 연결 사용 설정
앱의 WebView는 기본적으로 Chrome DevTools의 연결을 사용 설정하지 않습니다. 애플리케이션 코드에서 WebView 디버깅을 사용 설정해야 합니다.
- 하드웨어 또는 가상 기기에서 앱을 실행하도록 설정되어 있는지 확인합니다.
setWebContentsDebuggingEnabled를 호출하여 애플리케이션 코드에서 WebView 디버깅을 사용 설정합니다. 이 작업은 일반적으로 WebView가 초기화되는Activity또는Application클래스에서 실행됩니다.
프로덕션이 아닌 개발 빌드에서만 디버깅이 사용 설정되도록 조건부 검사에서 setWebContentsDebuggingEnabled를 래핑하는 것이 좋습니다. 이 설정은 앱의 모든 WebView에 적용됩니다.
WebView 디버깅은 애플리케이션 매니페스트의 debuggable 플래그 상태의 영향을 받지 않습니다. debuggable 플래그가 true로 설정된 경우에만 WebView 디버깅을 사용 설정하려면 다음 예와 같이 런타임에 이 플래그를 테스트하세요.
Kotlin
if (applicationInfo.flags and ApplicationInfo.FLAG_DEBUGGABLE != 0) {
WebView.setWebContentsDebuggingEnabled(true)
}
자바
if (0 != (getApplicationInfo().flags & ApplicationInfo.FLAG_DEBUGGABLE)) {
WebView.setWebContentsDebuggingEnabled(true);
}
WebView 디버깅 시작
애플리케이션 코드에서 WebView 디버깅을 사용 설정하고 앱이 실제 기기나 Android Emulator에서 실행 중인 경우 Chrome DevTools를 WebView에 연결합니다.
- 개발 머신에서 Chrome을 엽니다.
chrome://inspect(으)로 이동합니다.chrome://inspect페이지에서 USB 기기 검색이 선택되어 있는지 확인합니다. 원격 타겟 섹션에서 기기를 찾습니다.
그림 1. 디버깅에 사용할 수 있는 원격 타겟을 보여주는 Chrome DevTools 검사 페이지 기기 이름 아래에 Chrome은 해당 기기에서 실행되는 모든 디버그 지원 WebView를 나열합니다. 일반적으로 WebView in 뒤에 앱의 패키지 이름이 표시됩니다. 디버그하려는 WebView를 찾아 검사 링크를 클릭합니다.
WebView를 검사하는 데 사용할 수 있는 새 DevTools 인스턴스가 열립니다.
개발 머신의 로컬 웹 서버에서 콘텐츠를 제공하는 경우 WebView에서 로컬 개발 서버 액세스를 참고하여 기기 또는 에뮬레이터에서 연결하는 방법을 알아보세요. 문제 해결은 Android 기기 원격 디버그 및 WebView 원격 디버깅을 참고하세요.