React Native webview 디버그하기

Posted on Edited on In , Word count in article: 104 Reading time ≈ 1 mins.

리액트네이티브 Webview 디버그

웹뷰 WebView 에서 에러날때 어떻게 디버그 하는가

WebView Debug

Webview 깃허브에 친절하게 작성은 되어 있다

따라해보자

안드로이드 APP 을 크롬으로 디버그 할때

  1. /android/app/src/main/java/com/프로젝트이름/MainApplication.java 에 설정 추가
    1
    2
    3
    4
    5
    6
    7
    8
      import android.webkit.WebView;

      @Override
      public void onCreate() {
        super.onCreate();
    	  ...
    +   WebView.setWebContentsDebuggingEnabled(true);
      }

WebView.setWebContentsDebuggingEnabled(true); 이거 추가인데…나는 안해도 되긴 했다

  1. 애뮬레이터나 Android 디바이스에서 app 실행
  2. 크롬 웹 브라우저에서 chrome://inspect/#devices 실행
  3. 디바이스 리스트에서 디바이스를 찾아서 “Inspect” 선택
  4. 크롬 데브툴로 웹처럼 디버깅 할 수 있다

안드로이드 폰에서 미리 USB 디버깅 설정해줘야 한다

  • Settings -> System -> About Phone -> Developer options -> enable USB debugging