QT5 通过 webview2 加载网页

官方文档参考：https://learn.microsoft.com/zh-cn/microsoft-edge/webview2/get-started/win32

Webview2依赖的头文件和库

头文件主要为：WebView2和WixLibrary，存储在include/external

库主要为：WebView2LoaderStatic.lib和WebView2Loader.dll，存储在lib/external

初始化项目加载webview2

CMakeLists文件

#工程名
project(uXXXXSoftware)

#cmake最低版本
cmake_minimum_required(VERSION 3.17)

#设定cmake模块的路径
set(CMAKE_MODULE_PATH
        ${PROJECT_SOURCE_DIR}/cmake # 项目cmake
        ${PROJECT_SOURCE_DIR}/cmake/base # 通用cmake
        ${CMAKE_MODULE_PATH})

#加载配置项
include(set_env)

#加载项目配置
include(init_project)

#加载编译配置
include(set_compile_arg)

base/set_env.cmake

message(STATUS "====================set_env.cmake===================")

# 处理编译字符集问题
add_compile_options("$<$<C_COMPILER_ID:MSVC>:/utf-8>")
add_compile_options("$<$<CXX_COMPILER_ID:MSVC>:/utf-8>")

#C++标准
set(CMAKE_CXX_STANDARD 11)

# 开启QT用于预处理的组件
set(CMAKE_AUTOMOC ON)
set(CMAKE_AUTORCC ON)
set(CMAKE_AUTOUIC ON)

#设置全局系统变量
set(PROJECT_EXTERNAL_DIR "D:/MyCPP")
set(PROJECT_EXTERNAL_INCLUDE_DIR "${PROJECT_EXTERNAL_DIR}/include/external")
set(PROJECT_EXTERNAL_LIB_DIR "${PROJECT_EXTERNAL_DIR}/lib/external")
message(STATUS "PROJECT_EXTERNAL_INCLUDE_DIR is ${PROJECT_EXTERNAL_INCLUDE_DIR}")
message(STATUS "PROJECT_EXTERNAL_LIB_DIR is ${PROJECT_EXTERNAL_LIB_DIR}")

#配置QT位置
message(STATUS "CMAKE_SYSTEM_NAME is ${CMAKE_SYSTEM_NAME}")
if (CMAKE_SYSTEM_NAME MATCHES "Windows")
    #下面是Windows下Qt的默认前缀
    set(CMAKE_PREFIX_PATH "D:/Library/Qt5.14.2/5.14.2/msvc2017_64/lib/cmake")
elseif (CMAKE_SYSTEM_PROCESSOR MATCHES "aarch64" AND CMAKE_SYSTEM_NAME MATCHES "Linux")
    #下面是aarch64 Linux下Qt的默认前缀
    set(CMAKE_PREFIX_PATH /opt/Qt5.14.2_aarch64/)
elseif (CMAKE_SYSTEM_NAME MATCHES "Linux")
    #下面是Linux x64下Qt的默认前缀
    set(CMAKE_PREFIX_PATH /opt/Qt5.14.2/5.14.2/gcc_64)
endif ()
message(STATUS "CMAKE_PREFIX_PATH is ${CMAKE_PREFIX_PATH}")

message(STATUS "====================set_env.cmake end===================")

init_project.cmake

message(STATUS "====================init_project.cmake===================")

# 查找QT的模块
find_package(Qt5 COMPONENTS
        Core
        Gui
        Widgets
        REQUIRED)

#外部头文件的路径
include_directories(SYSTEM
        ${PROJECT_EXTERNAL_INCLUDE_DIR}
)
#外部库文件的路径
link_directories(${PROJECT_EXTERNAL_LIB_DIR})

# 把目录Packages/MainFrame/src下面的所有文件作为变量存储
aux_source_directory(Packages/MainFrame/src SOURCES)
# 添加源文件
add_executable(uXXXXSoftware ${SOURCES})

# 添加模块
target_link_libraries(uXXXXSoftware 
        Qt5::Core
        Qt5::Gui
        Qt5::Widgets
        WebView2LoaderStatic
)

message(STATUS "====================init_project.cmake end===================")

base/set_compile_arg.cmake

message(STATUS "====================set_compile_arg.cmake===================")

# 默认的编译配置（可选）
if (WIN32 AND NOT DEFINED CMAKE_TOOLCHAIN_FILE)
    set(DEBUG_SUFFIX)
    if (MSVC AND CMAKE_BUILD_TYPE MATCHES "Debug")
        set(DEBUG_SUFFIX "d")
    endif ()
    set(QT_INSTALL_PATH "${CMAKE_PREFIX_PATH}")
    if (NOT EXISTS "${QT_INSTALL_PATH}/bin")
        set(QT_INSTALL_PATH "${QT_INSTALL_PATH}/..")
        if (NOT EXISTS "${QT_INSTALL_PATH}/bin")
            set(QT_INSTALL_PATH "${QT_INSTALL_PATH}/..")
        endif ()
    endif ()
    if (EXISTS "${QT_INSTALL_PATH}/plugins/platforms/qwindows${DEBUG_SUFFIX}.dll")
        add_custom_command(TARGET ${PROJECT_NAME} POST_BUILD
                COMMAND ${CMAKE_COMMAND} -E make_directory
                "$<TARGET_FILE_DIR:${PROJECT_NAME}>/plugins/platforms/")
        add_custom_command(TARGET ${PROJECT_NAME} POST_BUILD
                COMMAND ${CMAKE_COMMAND} -E copy
                "${QT_INSTALL_PATH}/plugins/platforms/qwindows${DEBUG_SUFFIX}.dll"
                "$<TARGET_FILE_DIR:${PROJECT_NAME}>/plugins/platforms/")
    endif ()
    foreach (QT_LIB Core Gui Widgets)
        add_custom_command(TARGET ${PROJECT_NAME} POST_BUILD
                COMMAND ${CMAKE_COMMAND} -E copy
                "${QT_INSTALL_PATH}/bin/Qt5${QT_LIB}${DEBUG_SUFFIX}.dll"
                "$<TARGET_FILE_DIR:${PROJECT_NAME}>")
    endforeach (QT_LIB)
endif ()

message(STATUS "====================set_compile_arg.cmake end===================")

main函数

#pragma execution_character_set("utf-8")

#include <QApplication>
#include <QFont>
#include "main_windows.h"

int main(int argc, char *argv[]) {
    QApplication a(argc, argv);

    //设置字体
    QFont font;
    font.setFamily("Microsoft Yahei UI");
    font.setPixelSize(13);
    a.setFont(font);

    MainWindow mainWindow;
    mainWindow.show();

    return QApplication::exec();
}

MainWindow函数

#include "main_windows.h"
#include "main_windows_layout.h"
#include "web_display_widget.h"


MainWindow::MainWindow(QWidget *parent) : QMainWindow(parent) {
    this->setWindowTitle("XXXX");
    this->resize(1024, 960);

    QWidget* centralWidget = new QWidget(this);
    auto webview2Widget = new WebDisplayWidget(centralWidget);
    webview2Widget->resize(1024, 960);
    this->setCentralWidget(centralWidget);
}

WebDisplayWidget，显示web的widget核心函数

web_display_widge.h

#pragma execution_character_set("utf-8")


#include <wrl.h>
#include <QWidget>
#include "WixLibrary/wil/com.h"
#include "WebView2/WebView2.h"

class WebDisplayWidget : public QWidget {
public:
    WebDisplayWidget(QWidget *parent = nullptr);

    ~WebDisplayWidget() override;

public:
    HRESULT OnEnvironmentCompleted(HRESULT result, ICoreWebView2Environment *env);

    HRESULT OnControllerCompleted(HRESULT result, ICoreWebView2Controller *controller);

    HRESULT OnNavigationStarting(ICoreWebView2 *sender, ICoreWebView2NavigationStartingEventArgs *args);

    HRESULT OnNavigationCompleted(ICoreWebView2 *sender, ICoreWebView2NavigationCompletedEventArgs *args);

    HRESULT OnWebResourceRequested(ICoreWebView2 *sender, ICoreWebView2WebResourceRequestedEventArgs *args);

private:
    void InitWebView2();

private:
    wil::com_ptr<ICoreWebView2Controller> m_webViewController;
    wil::com_ptr<ICoreWebView2> m_webView;

    EventRegistrationToken m_navigationStartingToken;
    EventRegistrationToken m_navigationCompletedToken;
    EventRegistrationToken m_webResourceRequestedToken;
};

web_display_widget.cpp

#include "web_display_widget.h"

WebDisplayWidget::WebDisplayWidget(QWidget *parent) : QWidget(parent) {
    InitWebView2();
}


WebDisplayWidget::~WebDisplayWidget() {

}

void WebDisplayWidget::InitWebView2() {
    CreateCoreWebView2EnvironmentWithOptions(nullptr, nullptr, nullptr,
                                             Microsoft::WRL::Callback<ICoreWebView2CreateCoreWebView2EnvironmentCompletedHandler>(
                                                     [this](HRESULT result, ICoreWebView2Environment *env) -> HRESULT {
                                                         return OnEnvironmentCompleted(result, env);
                                                     }
                                             ).Get());
}

HRESULT WebDisplayWidget::OnEnvironmentCompleted(HRESULT result, ICoreWebView2Environment *env) {
    env->CreateCoreWebView2Controller(reinterpret_cast<HWND>(this->winId()),
                                      Microsoft::WRL::Callback<ICoreWebView2CreateCoreWebView2ControllerCompletedHandler>(
                                              [this](HRESULT result, ICoreWebView2Controller *controller) -> HRESULT {
                                                  return OnControllerCompleted(result, controller);
                                              }).Get());

    return S_OK;
}

HRESULT WebDisplayWidget::OnControllerCompleted(HRESULT result, ICoreWebView2Controller *controller) {
    if (controller == nullptr) {
        return S_FALSE;
    }

    //初始化webview2的依赖对象
    m_webViewController = controller;
    m_webViewController->get_CoreWebView2(&m_webView);

    //定义窗口
    RECT rect = {0, 0, this->width(), this->height()};
    m_webViewController->put_Bounds(rect);

    //导航地址
    m_webView->Navigate(L"https://www.baidu.com");

    //开始
    m_webView->add_NavigationStarting(
            Microsoft::WRL::Callback<ICoreWebView2NavigationStartingEventHandler>(
                    [this](ICoreWebView2 *webview, ICoreWebView2NavigationStartingEventArgs *args) -> HRESULT {
                        return OnNavigationStarting(webview, args);
                    }).Get(), &m_navigationStartingToken);

    //完成
    m_webView->add_NavigationCompleted(
            Microsoft::WRL::Callback<ICoreWebView2NavigationCompletedEventHandler>(
                    [this](ICoreWebView2 *webview, ICoreWebView2NavigationCompletedEventArgs *args) -> HRESULT {
                        return OnNavigationCompleted(webview, args);
                    }).Get(), &m_navigationCompletedToken);

    m_webView->add_WebResourceRequested(
            Microsoft::WRL::Callback<ICoreWebView2WebResourceRequestedEventHandler>(
                    [this](ICoreWebView2 *webview, ICoreWebView2WebResourceRequestedEventArgs *args) -> HRESULT {
                        return OnWebResourceRequested(webview, args);
                    }).Get(), &m_webResourceRequestedToken);
    return 0;
}

HRESULT WebDisplayWidget::OnNavigationStarting(ICoreWebView2 *sender, ICoreWebView2NavigationStartingEventArgs *args) {
    return S_OK;
}

HRESULT
WebDisplayWidget::OnNavigationCompleted(ICoreWebView2 *sender, ICoreWebView2NavigationCompletedEventArgs *args) {
    return S_OK;
}

HRESULT
WebDisplayWidget::OnWebResourceRequested(ICoreWebView2 *sender, ICoreWebView2WebResourceRequestedEventArgs *args) {
    return S_OK;
}