Qt WebEngine の概要

Qt WebEngine モジュールは Web ブラウザエンジンを提供し、ネイティブの Web エンジンを持たないプラットフォームでも、World Wide Web のコンテンツを Qt アプリケーションに簡単に埋め込むことができます。

Qt WebEngine は、HTML、XHTML、SVG ドキュメントをレンダリングするための C++ クラスと QML タイプを提供し、CSS (Cascading Style Sheets) を使用してスタイルを設定し、JavaScript を使用してスクリプトを記述します。HTML ドキュメントは、HTML 要素のcontenteditable 属性を使用して、ユーザーが完全に編集できるようにすることができます。

Qt WebEngine のアーキテクチャ

Qt WebEngine の機能は、以下のモジュールに分かれています：

• Qt WebEngine Widgets モジュールウィジェットベースの Web アプリケーションを作成します。
• Qt Quick ベースのウェブアプリケーションを作成するQt WebEngine モジュール
• Chromium と連携するQt WebEngine Core モジュール

ページのレンダリングと JavaScript の実行は、GUI プロセスから Qt WebEngine プロセスに分離されています。Qt WebEngine コアモジュールは、Qt ライブラリがアプリケーションにバンドルされている場合、アプリケーションと共に出荷される必要があるライブラリです。

Qt WebEngine ウィジェットモジュール

ウェブエンジンビューは、Qt WebEngine モジュールのメインウィジェットコンポーネントです。ウェブコンテンツを読み込むために、様々なアプリケーションで使用することができます。ビューの中で、Web エンジン・ページは、Web コンテンツ、ナビゲートしたリンクの履歴、およびアクションを担当するメイン・フレームを保持します。ビューとページは共通の機能を提供するため、よく似ています。

すべてのページは、共有設定、スクリプト、およびクッキーを含むウェブエンジンプロファイルに属します。プロファイルは、ページを互いに分離するために使用できます。典型的な使用例は、情報が永久に保存されないプライベートブラウジングモード専用のプロファイルです。

コンテンツは、グラフィックカード（GPU）の機能を使用してレンダリングされます。シーングラフは、GPU が持つさまざまな機能やAPIを抽象化するレイヤとしてQt Rendering Hardware Interfaceに依存しています。レンダリングパイプラインを調整する方法については、Qt Rendering Hardware Interface によるレンダリングを参照してください。

Qt WebEngine モジュール

Qt WebEngine QML 実装には、Qt WebEngine Widgets 実装と同じ要素が含まれています。サポートされているページの機能は、Web エンジン ビューに統合されています。

Qt WebEngine コアモジュール

Qt WebEngine コアはChromium Project をベースにしています。Chromium は独自のネットワークエンジンとペインティングエンジンを提供し、依存モジュールと緊密に連携して開発されています。QtNetwork スタックは使用しませんが、Qt WebEngine と同期してセットアップを行うことができます。詳細はProxy Support、Managing Certificates、Client Certificates、QWebEngineCookieStore を参照してください。

使用されている Chromium のバージョンは、Qt WebEngine の現在のバージョンで Qt の機能がフリーズした時点で、最新の安定した Chrome のバージョンで使用されているものです。追加のセキュリティパッチは、パッチリリースのたびに新しい Chrome リリースから選択されますが、Qt パッチリリースの凍結に合わせてリリースされたセキュリティパッチも含まれます。Qt WebEngine のパッチリリースの凍結に間に合うようにリリースされたセキュリティパッチは、Qt のパッチリリースの凍結に含まれます。Chrome がリリースウィンドウ外で重要な修正をリリースした場合、次のパッチリリースは、パッチの詳細が公開される前にパッチが適用された Qt WebEngine がリリースされるように早められます。

Qt WebEngine は、Qt LTS まで遡った古いバージョンの Qt でのビルドをサポートしています。例えば、Qt WebEngine 6.3、6.4、6.5 はすべて Qt 6.2 でビルドできます。Qt LTS のリリースでは、Qt WebEngine はセキュリティパッチを適用しやすくするために、このような新しいバージョンに完全に置き換えられるかもしれません。

該当する Chromium のバージョンは、qWebEngineChromiumVersion() メソッドを使って実行時に読み込むこともできます。また、qWebEngineChromiumSecurityPatchVersion() を使って、現在のセキュリティパッチレベルを読み込むこともできます。また、Qt WebEngine のソースの CHROMIUM_VERSION ファイルでもバージョンを確認できます。

Qt WebEngine プロセス

Qt WebEngine プロセスは、Web ページのレンダリングと JavaScript の実行に使用される独立した実行ファイルです。これにより、セキュリティの問題が軽減され、特定のコンテンツに起因するクラッシュが隔離されます。

ウィジェットベースのアプリケーションへの Web コンテンツの埋め込み

最も簡単な方法でウェブページを表示するには、QWebEngineView クラスを使用します。ウィジェットなので、QWebEngineView をフォームに埋め込み、その便利な機能を使用して Web サイトをダウンロードして表示することができます。

QWebEngineView *view = new QWebEngineView(parent);
view->load(QUrl("http://www.qt.io/"));
view->show();

QWebEngineView のインスタンスは、QWebEnginePage を1つ持っています。QWebEnginePage は、ページのナビゲーション履歴へのアクセスを提供するQWebEngineHistory と、ウェブページにアクションを適用するQAction オブジェクトをいくつか持つことができます。さらに、QWebEnginePage は、ページのメインフレームのコンテキストで JavaScript コードを実行したり、カスタム認証ダイアログの表示など、特定のイベントに対するハンドラのカスタマイズを可能にする機能を持っています。

各QWebEnginePage はQWebEngineProfile に属し、ページ設定を指定するためのQWebEngineSettings 、ページ上でスクリプトを実行するためのQWebEngineScriptCollection 、Chromium の HTTP Cookie にアクセスするためのQWebEngineCookieStore を持つことができます。QWebEnginePage は、スクリプトコレクションを直接指すこともできます。

ウィジェットベースのアプリケーションの場合、ウェブエンジンは自動的に初期化されます。その場合、アプリケーションのメイン・ソース・ファイルでQtWebEngineQuick::initialize を使用して初期化する必要があります：

int main(int argc, char **argv)
{
    QtWebEngineQuick::initialize();

    QApplication app(argc, argv);

    QMainWindow window;
    window.show();

    return app.exec();
}

Qt Quick アプリケーションへの Web コンテンツの埋め込み

WebEngineView QML タイプを使うことで、Qt Quick アプリケーションで動的な Web コンテンツの領域をレンダリングすることができます。A WebEngineViewタイプは、他の QML タイプと画面を共有することも、Qt Quick アプリケーション内で指定された画面全体をカバーすることもできます。

GUIプロセスとレンダリングプロセスの間でOpenGLコンテキストを共有できるようにするには、アプリケーションのメインソースファイルでQtWebEngineQuick::initialize 、Webエンジンを初期化する必要があります：

int main(int argc, char *argv[])
{
    QGuiApplication app(argc, argv);

    QtWebEngineQuick::initialize();

    QQmlApplicationEngine engine;
    engine.load(QUrl("qrc:/main.qml"));

    return app.exec();
}

アプリケーションは、URL または HTML 文字列を使用してWebEngineView にページをロードし、セッション履歴内を移動することができます。デフォルトでは、異なるページへのリンクは同じWebEngineView オブジェクト内にロードされますが、Webサイトでは新しいタブ、ウィンドウ、ダイアログとして開くように要求されることがあります。

以下のサンプルQMLアプリケーションでは、url プロパティを使用してWebページを読み込んでいます：

import QtQuick
import QtQuick.Window
import QtWebEngine

Window {
    width: 1024
    height: 750
    visible: true
    WebEngineView {
        anchors.fill: parent
        url: "https://www.qt.io"
    }
}

スクリプト・インジェクション

Qt WebEngine では、ページのドキュメントオブジェクトモデル(DOM)に直接アクセスすることはできません。しかし、スクリプトをインジェクションすることで、DOMを検査し、適合させることができます。

ページの DOM は、ドキュメントの準備ができたとき、通常はページが完全に読み込まれたときに構築されます。したがって、ドキュメントが作成されるとすぐにスクリプトを実行することは、DOMが準備できるまで待たなければならないDOM操作には適していません。

さらに、注入されたスクリプトは、ページ上で実行される他のスクリプトと同じ世界を共有するため、競合が発生する可能性があります。これを避けるために、QWebEngineScript クラスとWebEngineScript QML タイプは Chromium API forContent Script Extensions を実装しています。これらは、実行するスクリプト、注入ポイント、スクリプトが実行されるワールドを指定します。これにより、ワールド内で DOM にアクセスして操作できるようになります。

Qt 5.8 以降、Qt WebEngine は、以下のGreasemonkey のような属性を使用したスクリプトの拡張をサポートしています：

• @exclude <regexp>
• @include <regexp>
• @match <regexp>
• @name <free text>
• @run-at [document-start|document-end|document-idle]

この属性は、ユーザースクリプトが実行されるかどうか、またいつ実行されるかを決定します。この属性は、ユーザースクリプトが実行されるかどうか、またいつ実行されるかを決定します。これらの属性は、スクリプトの冒頭で、==UserScript== コメントの中に記述する必要があります：

// ==UserScript==
// @include http://*.qt.io/*
// @exclude http://wiki.qt.io/*
// ==/UserScript==

window.alert("Page is from qt.io, but not wiki.qt.io");

WebEngine アプリケーションが Qt Quick Compiler を使ってビルドされ、.qrc リソースの中に JavaScript ファイルが含まれている場合は、Qt Resource Files の JavaScript Files を読んでください。

証明書の管理

Qt WebEngine は独自のネットワークスタックを使用しているため、QSslConfiguration を使用して SSL 接続を開くことはありません。その代わりに、Qt WebEngine はオペレーティングシステムのルート CA 証明書を使用して、相手の証明書を検証します。

WebEngineCertificateError::type とQWebEngineCertificateError::Type の列挙は、発生する可能性のある証明書エラーの種類に関する情報を提供します。このエラーは、WebEngineView::certificateError QML メソッドを使うか、QWebEnginePage::certificateError シグナルに接続することで対処できます。

プロキシのサポート

Qt WebEngine はQt Network のプロキシ設定を使用し、Chromium のネットワーキングスタックに転送します。QNetworkProxy::applicationProxy が設定されている場合、Qt WebEngine でも使用されます。QNetworkProxyFactory::usesSystemConfiguration() が有効な場合、プロキシ設定は自動的にシステムから取得されます。ただし、インストールされているQNetworkProxyFactory からの設定は無視されます。

QNetworkProxy::user() とQNetworkProxy::password() が設定されている場合、これらの認証情報は自動的にプロキシ認証に使用されます。エラー処理のコールバックがないため、有効な認証情報を提供できるかどうかはユーザー次第である。

QNetworkProxy で認証情報が設定されていないが、プロキシが認証を要求している場合、QWebEnginePage::proxyAuthenticationRequired が発行されます。Qt Quick の場合はダイアログが表示されます。

QNetworkProxy のすべてのプロパティが Qt WebEngine でサポートされているわけではありません。つまり、QNetworkProxy::type （）、QNetworkProxy::hostName （）、QNetworkProxy::port （）が考慮されます。QNetworkProxy::rawHeader() のような他のプロキシ設定はすべて無視されます。

高 DPI サポート

高 DPI デバイスをサポートするには、アプリケーション属性Qt::AA_EnableHighDpiScaling を設定して、モニタのピクセル密度に基づいて自動スケーリングを有効にすることをお勧めします。Qt WebEngine アプリケーションでは、スケーリングはデフォルトの拡大率とスクロールバーサイズに影響します。

例えば

int main(int argc, char *argv[])
{
  QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
  QApplication app(argc, argv);
  // ...
}

Qt WebEngine では、通常解像度と高解像度用の画像をqtwebengine_resources_100p.pakとqtwebengine_resources_200p.pakファイルにバンドルしています。ターゲット解像度に応じて、これらのファイルの1つまたは両方を配置する必要があります。

詳細については、High DPI を参照してください。

WebEngine Core の使用

Qt WebEngine Core は、Qt WebEngine と Qt WebEngine Widgets が共有する API を提供し、Chromium のネットワーキングスタックに対して発行された URL リクエストの処理や HTTP Cookie へのアクセスを行います。

QWebEngineUrlRequestInterceptor インタフェースを実装し、プロファイルにインターセプタをインス トールすることで、URL リクエスト (QWebEngineUrlRequestInfo) が Chromium のネットワーキングスタッ クに到達する前にインターセプト、ブロック、変更が可能になります。

QWebEngineUrlSchemeHandler をプロファイルに登録することで、カスタムURLスキームのサポートを追加できます。スキームに対するリクエストは、QWebEngineUrlRequestJob オブジェクトとしてQWebEngineUrlSchemeHandler::requestStarted() に発行されます。

QWebEngineCookieStore クラスは、Chromium の HTTP Cookie にアクセスするための関数を提供します。この関数を使用して、QNetworkAccessManager とクッキーを同期させたり、ナビゲーション中にクッキーを設定、削除、遮断したりすることができます。

プラットフォーム

Qt WebEngine は現在、Windows、Linux、macOS のみをサポートしています。Chromium のビルド要件により、Qt の他の部分よりも新しいコンパイラが必要になることがよくあります。詳細はQt WebEngine Platform Notesを参照してください。

関連モジュール

Qt WebEngine はQt WebKitモジュールに取って代わります。QtWebEngine は WebKit プロジェクトをベースにしていますが、Qt 5.2 以降、上流の WebKit コードと積極的に同期しておらず、Qt 5.5 で非推奨となりました。Qt WebKit ウィジェットアプリケーションを Qt WebEngine ウィジェットに変更する方法については、Qt WebKit から Qt WebEngine への移植を参照してください。

Qt WebViewモジュールは、ネイティブの Web ブラウザが利用可能なプラットフォームで使用することができます。

Qt WebChannelモジュールは、C++ 側のQObject オブジェクトと QML 側の JavaScript との双方向通信チャネルを作成するために使用できます。