2024年最全Qt与Web混合开发：实现双向通信_qt与web交互，2024年最新没想到一个Handler还有中高级几种问法

2401_85014385

于 2024-05-14 04:39:17 发布

阅读量400

点赞数 3

分类专栏：程序员文章标签：物联网嵌入式硬件学习

本文链接：https://blog.csdn.net/2401_85014385/article/details/138831570

版权

程序员专栏收录该内容

16 篇文章 0 订阅

订阅专栏

收集整理了一份《2024年最新物联网嵌入式全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升的朋友。

如果你需要这些资料，可以戳这里获取

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人

都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

qDebug() << message;

}

void MyObject::sendMessage(const QString &message)
{
emit sig_sendMessage(message);
qDebug() << message;
}


#### 注册QObject派生类


在C++端，我们创建一个QWebEngineView，并将MyObject对象添加到Web通道中：

#include
#include
#include

#include “myobject.h”

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

QWebEngineView *webView = new QWebEngineView();
QWebChannel *channel = new QWebChannel();

MyObject *myObject = new MyObject();
channel->registerObject(QStringLiteral("myObject"), myObject);

webView->page()->setWebChannel(channel);
webView->load(QUrl("file:///C:/Users/yxc/Desktop/untitled/bmdemo.html")); // 路径根据实际情况
webView->show();

return app.exec();

}


### Web端


在Web端，我们需要在HTML页面中加载QWebChannel的JavaScript库，并使用JavaScript与Qt进行交互。通过使用Qt对象的名称（在本例中为"myObject"），我们可以访问Qt对象的函数和信号：

bm qt + web test

function myFunction() {
// 调用Qt函数
myObject.myFunction(“Hello from Web”);
}

function sendMessage() {
// 发送信号到Qt
myObject.sendMessage(“Message from Web”);
}

my function send message


### 运行和测试


运行应用程序，Qt应用程序将加载Web页面，并在控制台上显示来自Web的消息。通过Qt对象的槽函数，我们可以处理从Web发送的消息，或者通过信号与Web进行通信。


测试结果如图所示：


![在这里插入图片描述](https://img-blog.csdnimg.cn/9069404941344988b4eb20a15f25836f.png#pic_center)


### 结论


通过使用Qt WebChannel和JavaScript桥接，我们可以实现Qt与Web之间的双向通信。这种混合开发的方法可以让我们充分利用Qt的强大功能和Web技术的灵活性，开发出功能丰富、交互性强的应用程序。本文介绍了QWebChannel的基本概念和用法，并提供了一个简单的示例来演示如何在Qt和Web之间进行通信。希望这篇博客能够为您深入了解Qt与Web混合开发提供一个良好的起点。


在实际开发中，你可以根据具体需求进一步扩展和定制这种通信机制，并结合您的创意和应用场景，实现更多功能丰富的交互体验。祝你在Qt与Web混合开发的旅程中取得成功。






![img](https://img-blog.csdnimg.cn/img_convert/50fdee2ef672bc964f0af72f85644af1.png)
![img](https://img-blog.csdnimg.cn/img_convert/18b817c41d081072da086bbbcac7e47a.png)

**既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上物联网嵌入式知识点，真正体系化！**

**由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、电子书籍、讲解视频，并且后续会持续更新**

**[如果你需要这些资料，可以戳这里获取](https://bbs.csdn.net/topics/618679757)**

里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、电子书籍、讲解视频，并且后续会持续更新**

**[如果你需要这些资料，可以戳这里获取](https://bbs.csdn.net/topics/618679757)**