Qt WebEngine 디버깅 및 프로파일링

콘솔 로깅

Qt WebEngine 내에서 실행되는 자바스크립트는 Chrome 콘솔 API를 사용하여 정보를 콘솔에 로깅할 수 있습니다. 로깅 메시지는 js logging category 안에 있는 Qt의 로깅 기능으로 전달됩니다. 그러나 기본적으로 경고 및 치명적인 메시지만 인쇄됩니다. 이를 변경하려면 js 카테고리에 대한 사용자 정의 규칙을 설정하거나 QWebEnginePage::javaScriptConsoleMessage()을 다시 구현하거나 WebEngineView::javaScriptConsoleMessage()에 연결하여 사용자 정의 메시지 핸들러를 제공해야 합니다.

Qt WebEngine 개발자 도구를 통해서도 모든 메시지에 액세스할 수 있습니다.

Qt WebEngine 개발자 도구

Qt WebEngine 모듈은 모든 웹 콘텐츠의 레이아웃 및 성능 문제를 쉽게 검사하고 디버깅할 수 있는 웹 개발자 도구를 제공합니다.

개발자 도구는 크롬 브라우저와 같은 Chromium 또는 Qt WebEngine 기반 브라우저를 사용하여 로컬 웹 페이지로 액세스할 수 있습니다.

개발자 도구를 활성화하려면 --remote-debugging-port=<portnumber> 명령줄 인수를 사용하여 Qt WebEngine 를 사용하는 애플리케이션을 시작합니다.

--webEngineArgs --remote-debugging-port=<portnumber>

여기서 <port_number> 은 로컬 네트워크 포트를 나타냅니다. 그런 다음 http://localhost:<port_number> 주소에서 브라우저를 실행하여 웹 개발자 도구에 액세스할 수 있습니다.

또는 환경 변수 QTWEBENGINE_REMOTE_DEBUGGING을 설정할 수 있습니다. --remote-debugging-port 와 유사하게 작동하는 포트로 설정하거나 호스트 주소와 포트를 모두 지정할 수 있습니다. 후자는 원격 장치에서 개발자 도구에 액세스할 수 있도록 인터페이스를 내보낼 네트워크 인터페이스를 제어하는 데 사용할 수 있습니다.

원격 디버깅 중 WebSocket 오류를 방지하려면 추가 명령줄 인수를 추가하세요 --remote-allow-origins=<origin>[,<origin>, ...], 여기서 <origin> 은 요청 발신지를 나타냅니다. 모든 오리진으로부터의 연결을 허용하려면 --remote-allow-origins=* 을 사용합니다. 아무것도 지정하지 않으면 원격 디버깅이 활성화되면 Qt WebEngine 명령줄 인수에 --remote-allow-origins=* 을 추가하여 모든 오리진으로부터의 요청을 허용합니다.

개발자 도구의 기능에 대한 자세한 설명은 Chrome 개발자 도구 페이지를 참조하세요.

명령줄 인수 사용

디버깅 중에 다음 명령줄 인수를 사용하여 버그 보고서에 대한 입력을 제공할 수 있습니다:

• --disable-gpu GPU 하드웨어 가속을 비활성화합니다. 이 옵션은 OpenGL 문제를 진단할 때 유용합니다.
• --disable-logging 콘솔 로깅을 비활성화하며 디버그 빌드에 유용할 수 있습니다.
• --enable-logging --log-level=0 콘솔 로깅을 활성화하고 로깅 수준을 0으로 설정하면 심각도 info 이상의 메시지가 로그에 기록됩니다. 디버그 빌드의 기본값입니다. 다른 가능한 로그 수준은 경고의 경우 1, 오류의 경우 2, 치명적인 오류의 경우 3 입니다.
• --v=1 --log-level 이상으로 로그 수준을 높이고 디버그 메시지를 상세 수준 1 까지 로깅할 수 있습니다. 수치가 높을수록 상세도가 높아지지만 로그 메시지 수가 많아질 수 있습니다. 기본값은 0 (디버그 메시지 없음)입니다.
• --no-sandbox 렌더러 및 플러그인 프로세스에 대한 샌드박스를 비활성화합니다. 샌드박스를 비활성화하면 보안 위험이 발생할 수 있다는 점에 유의하세요.
• --single-process 브라우저와 동일한 프로세스에서 렌더러와 플러그인을 실행합니다. 이는 렌더러 충돌에 대한 스택 추적을 얻는 데 유용합니다.
• --enable-features=NetworkServiceInProcess 메인 프로세스에서 네트워킹을 실행합니다. 이렇게 하면 애플리케이션 실행 파일만 화이트리스트에 등록하고 QtWebEngineProcess는 등록하지 않아도 되므로 방화벽 관리에 도움이 될 수 있습니다. 하지만 네트워크 서비스의 샌드박싱 보안을 잃을 수 있습니다.

WebEngine 명령줄 옵션은 --webEngineArgs 옵션 뒤에 지정해야 하며, 이는 사용자의 애플리케이션별 옵션을 WebEngine 의 옵션과 구분하는 데 사용됩니다.

--webEngineArgs [WebEngine specific options]

또는 환경 변수 QTWEBENGINE_CHROMIUM_FLAGS를 설정할 수 있습니다. 예를 들어, 다음 값을 설정하여 mybrowser라는 애플리케이션을 디버깅하는 동안 로깅을 비활성화할 수 있습니다:

QTWEBENGINE_CHROMIUM_FLAGS="--disable-logging" mybrowser

응용 프로그램 내에서 QtWebEngineQuick::initialize() 전에 호출하는 경우 qputenv 을 사용하여 QTWEBENGINE_CHROMIUM_FLAGS를 설정할 수도 있습니다.

웹엔진 컨텍스트 정보 덤프

WebEngineContext 정보를 덤프하려면 QT_LOGGING_RULES 환경 변수를 "qt.webenginecontext.debug=true" 으로 설정하면 됩니다.

출력에는 그래픽 백엔드에 대한 정보와 애플리케이션에 대한 Qt WebEngine 초기화 방식이 포함됩니다. 이 정보는 문제를 재현하는 데 특히 유용합니다.