使用Qt WebEngine和WebChannel实现嵌入式系统中HTML与C++双向通信。1. 在.pro文件添加webengine webchannel模块，创建QWebEngineView加载本地HTML；2. 定义QObject派生类作为JS调用接口，通过QWebChannel注册对象；3. HTML引入qwebchannel.js，初始化后调用C++方法并监听信号；4. C++触发信号即可向JS发送消息。该方案适用于嵌入式设备的界面交互，需注意平台对WebEngine的支持。
在嵌入式系统中，使用Qt开发的应用常需要与HTML界面进行交互。这种交互通常通过Qt的Web引擎模块（如 Qt WebEngine 或 Qt WebKit）实现，将HTML页面嵌入到Qt应用中，并通过JavaScript桥接实现双向通信。
1. 使用Qt WebEngine加载HTML页面
Qt推荐使用 Qt WebEngine 模块替代旧的WebKit，它基于Chromium，支持现代HTML5/CSS3/JS功能，适合嵌入式设备上的富界面展示。
基本步骤：
- 在项目文件（.pro）中添加：
QT += webengine webchannel - 创建 QWebEngineView 并加载本地HTML文件：
#include <QWebChannel>
QWebEngineView *view = new QWebEngineView(this);
view->load(QUrl("qrc:/html/index.html")); // HTML可打包进资源文件
view->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
this->layout()->addWidget(view);
2. 实现C++与JavaScript双向通信（Qt WebChannel）
Qt WebChannel 提供了一种机制，让HTML中的JavaScript可以直接调用Qt C++对象的方法，反之亦然。
立即学习“前端免费学习笔记（深入）”；
步骤如下：
- 定义一个可被JS调用的C++类，继承 QObject，并使用 Q_OBJECT 宏：
Q_OBJECT
public:
explicit HtmlBridge(QObject *parent = nullptr) : QObject(parent) {}
public slots:
void jsCallCppMethod(const QString &msg) {
qDebug() << "JS传来的消息:" << msg;
}
signals:
void sendToJS(const QString &response);
};
- 将该对象注册到 WebChannel，并与页面共享：
HtmlBridge *bridge = new HtmlBridge(this);
channel->registerObject("qtHtmlBridge", bridge);
view->page()->setWebChannel(channel);
3. HTML/JavaScript中调用Qt方法
在HTML页面中引入 qwebchannel.js（Qt提供，需复制到资源或路径中），然后建立连接。
- 引入脚本（可从Qt安装目录拷贝）：
- JavaScript初始化通道并调用C++方法：
var bridge = channel.objects.qtHtmlBridge;
// 调用C++方法
bridge.jsCallCppMethod("Hello from JS!");
// 监听来自C++的信号
bridge.sendToJS.connect(function(response) {
console.log("收到C++消息:", response);
});
});
4. C++向HTML发送消息
通过触发信号，JavaScript可以监听并响应。
// 在某个地方触发信号emit bridge->sendToJS("这是来自Qt的消息");
基本上就这些。只要配置好WebChannel，HTML就能像调用本地JS函数一样操作Qt逻辑，Qt也能实时推送数据到页面，适合做嵌入式设备的配置界面、状态监控等场景。注意在嵌入式平台编译时确保WebEngine支持，部分轻量系统可能需裁剪或选用WASM方案替代。
