Html网页和C++ App通信 - qwebchannel

news2025/1/10 13:52:48

Qt5 引入了 Qt WebChannel 的概念。这是为了在不能影响各端代码执行的前提下实现 Qt 端于 client 端的无缝 双向 通信。
QWebChannel 提供了在 C++应用和 前端(HTML/JS)之间点对点的通信能力。通过向 前端的 QWebChannel 发布 QObject 的 派生对象,进而实现在 前端无缝读取来自 Qt 端的 公共插槽 和 QObject 的 属性值 和 方法。在整个通信过程中,无需任何手动序列化传入的参数。所有 Qt 端的 属性 更新,signal 触发,都会 自动且异步 更新到 前端。

QObject 是 Qt 中对象模型的核心。该模型的核心特性是被称为 signal 和 slot 的对象通信机制。

要实现 client 端的 QWebChannel,必须引入 Qt 官方提供的 qwebchannel.js 的 JS 库。该库的目的在于封装了一系列的 通信接口 和传输信息时的序列化信息的方法。

1. 在HTML网页中,调用C++代码,执行指定功能(如,print)

HTML通过JavaScript调用C++方法,需要建立qwebchannel通道。qwebchannel类的官方描述如下:

The QWebChannel fills the gap between C++ applications and HTML/JavaScript applications. By publishing a QObject derived object to a QWebChannel and using the qwebchannel.js on the HTML side, one can transparently access properties and public slots and methods of the QObject. No manual message passing and serialization of data is required, property updates and signal emission on the C++ side get automatically transmitted to the potentially remotely running HTML clients. On the client side, a JavaScript object will be created for any published C++ QObject. It mirrors the C++ object’s API and thus is intuitively useable.
The C++ QWebChannel API makes it possible to talk to any HTML client, which could run on a local or even remote machine. The only limitation is that the HTML client supports the JavaScript features used by qwebchannel.js. As such, one can interact with basically any modern HTML browser or standalone JavaScript runtime, such as node.js.

有两种情况:
1). 如果前端代码中已经嵌入了qwebchannel.js,需要在C++中创建 channel并且注册一个通信的对象,并设置到网页中。

    QWebChannel*_channel = new QWebChannel(this);
    _channel->registerObject(QStringLiteral("printManager"), MSBrowserMainView::m_pManager);
    page()->setWebChannel(_channel);

PS. 如何判断网页有没有嵌入qwebchannel.js?
用 Chrome浏览器打开该网页,并按F12键打开开发者模式,ctl+F搜索qwebchannel.js
在这里插入图片描述
2). 如果前端没有嵌入qwebchannel,需要在C++代码中把qwebchannel.js加载进网页。
在网页构造函数中创建channel,把要用到的对象注册进去,并加载到网页中:

    m_webChannel = new QWebChannel(this);
    m_webChannel->registerObject("webView", this);
    page()->setWebChannel(m_webChannel);

在合适的地方(确保网页加载完成之后)执行qwebchannel.js把qwebchannel加载进网页

    QFile file;
    QString webChannelJsApi = "";
    file.setFileName("../homepage/js/qwebchannel.js");
    if(file.exists())
    {
        file.open(QIODevice::ReadOnly);
        webChannelJsApi = file.readAll();
        file.close();
    }
    page()->runJavaScript(webChannelJsApi);

加入JavaScript代码,修改网页某个指定button的回调函数,让它执行C++代码:

   //handle the click event for the printer button.
    QString btClickCode = QStringLiteral("var oBtn=document.getElementsByTagName('button')[3];" \ // 这里需要跟前端约定好指定的button。
                                         "oBtn.οnclick=function(){" \
                                         "window.channel = new QWebChannel(qt.webChannelTransport,function(channel){" \
                                         "var webobj = channel.objects.webView;" \ // webView is the id of WebView, see registerObject(id, *obj)
                                         "webobj.printWebPage();" \ //printWebPage() is a C++ method in WebView class
                                         "});" \
                                         "}" \
                                        );
    page()->runJavaScript(btClickCode);

2. 在C++代码中插入Javascript代码,操作网页。

单纯地在C++中插入一段JavaScript代码,执行前端的方法,不需要建立通道。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/118475.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

开源版支持工作台展示,新增超级管理员用户组,MeterSphere开源持续测试平台v2.5.0发布

2022年12月27日,MeterSphere一站式开源持续测试平台正式发布v2.5.0版本。 在这一版本中,MeterSphere在工作台模块进行了UX交互升级,并将工作台模块由X-Pack增强功能开放为开源版功能。 在测试跟踪模块中,关联测试用例支持关联UI…

(四)RequestResponse

一、Request 和 Response 的概述 Request是请求对象,Response是响应对象。request:获取请求数据 (1)浏览器会发送HTTP请求到后台服务器 [Tomcat] (2)HTTP的请求中会包含很多请求数据[请求行请求头请求体] &…

26位前谷歌AI专家出走创业

细数近几年来高科技对现代社会的影响,人工智能(AI)无疑是排在前列。AI已经对人类社会行为、健康、教育和娱乐的方方面面都产生了巨大冲击。作为高科技的头部企业,谷歌的AI团队可能是AI行业最有影响的团队之一,他们的一…

第十三讲:MSTP技术应用

学校因为教师的人数越来越多,部门逐渐也增多,各部门之间都已经采用了vlan技术,但为了实现公司的稳定性和消除内部网络的环路,管理员小赵配合飞越公司去实现学校内部网络时刻不间断,来保证公司网络的运行。 为了解决校园…

【Lilishop商城】No4-3.业务逻辑的代码开发,涉及到:会员B端第三方登录的开发-微信小程序登录接口开发

仅涉及后端,全部目录看顶部专栏,代码、文档、接口路径在: 【Lilishop商城】记录一下B2B2C商城系统学习笔记~_清晨敲代码的博客-CSDN博客 全篇会结合业务介绍重点设计逻辑,其中重点包括接口类、业务类,具体的结合源代码…

工厂明火烟雾视频监控识别 烟火自动识别预警 yolo

工厂明火烟雾视频监控识别 烟火自动识别预警通过pythonyolo网络深度学习模型可以自动识别监控区域内的烟火,如pythonyolo网络深度学习模型发现火焰烟火可以立即抓拍告警。Python是一种由Guido van Rossum开发的通用编程语言,它很快就变得非常流行&#x…

Flink系列-2、Flink架构体系

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。 大数据系列文章目录 官方网址:https://flink.apache.org/ 学习资料:https://flink-learning.org.cn/ 目录Flink中的重要…

[ web基础知识点 ] 解决端口被占用的问题(关闭连接)(杀死进程)

🍬 博主介绍 👨‍🎓 博主介绍:大家好,我是 _PowerShell ,很高兴认识大家~ ✨主攻领域:【渗透领域】【数据通信】 【通讯安全】 【web安全】【面试分析】 🎉点赞➕评论➕收藏 养成习…

什么是文件描述符

Linux内核在各种不同的文件系统格式之上做了一个抽象层,使得文件、目录、读写访问等概念成为抽象层的概念,因此各种文件系统看起来用起来都一样,这个抽象层称为虚拟文件系统(VFS,Virtual Filesystem)。 内核数据结构 Linux内核的V…

【endnote学习】解决为什么文献引用后出现年/月/日格式(endnote对其他类型引用文件的不兼容导致)

为什么文献引用后出现年/月/日格式问题描述问题解决问题描述 在一次文献引用中发现,引用后的文献格式里面多了年/月/日格式,比如选择AIChE格式时,出现: Liu P, Nrskov JK. Kinetics of the Anode Processes in PEM Fuel Cells …

编译原理——基本块、流图、基本块优化、循环优化(代码优化)

一、划分基本块、画流图 找基本块的入口:一共有三类入口:①代码段的第一个指令;②条件跳转和无条件跳转的目标语句;③条件跳转语句的下一条语句;根据划分的入口画流图,一个基本块的区间:从入口…

C++: STL : 容器:set/multi set,map/multimap

一:set容器 1.1: set容器的构造和赋值 简介:所有元素都会在插入时自动被排序 本质:set/multiset 属于关联式容器 ,底层结构是二叉树实现 set与multiset区别: set: 不 允许容器中有重复元素 multiset :允…

Shader Graph(一)基本使用

一、如何使用Shader Graph 1.1 新建项目 通过创建URP或HDRP模板项目,可以自动配置好Shader Graph。 1.2 已有项目 在「Package Manager」中安装「Shader Graph」及URP或HDRP组件。然后在弹出的渲染管线向导面板中点击「Fix All」即可。如果项目中存在已经创建好…

three.js实战-Sprite实现标签效果

1. demo效果 2 .什么是精灵(Sprite) 按照Three.js官网的解释是:精灵是一个总是面朝着摄像机的平面,通常含有使用一个半透明的纹理。精灵不会投射任何阴影,即使设置了也将不会有任何效果。 3. 代码大致逻辑 创建一个canvas对象,首先调用ctx…

密码学_DES加密算法

目录 DES(Data Encryption Standard) IP置换: E盒扩展 S盒压缩 P盒置换 K密钥生成 PC-1置换表(通常用此表): PC-2置换表(通常用此表): IP-1逆置换表 DES&#x…

MyBatis的SQL执行结果和客户端执行结果不一致问题排查

MyBatis的SQL执行结果和客户端执行结果不一致问题排查问题引入测试表、测试数据问题介绍排查问题调试 MyBatis源码JDBC 执行 SQL解决问题待解决问题最近遇到一个调试很久的问题,MyBatis 查询 Oracle 数据库查询结果与在客户端查询结果不一致。 问题引入 测试表、测…

自动化审批流程有哪些?使用中的优点是什么

自动化审批对HR管理有多重要呢?相信每一位HR都会希望让审批流程实现自动化,从而释放更多的时间去处理更加复杂的工作。 在人力资源管理过程中,自动化审批可以有效帮助HR提高流程效率。当管理人员每天收到很多审批请求之后,如果不…

AVS3中的AMVR和EMVR

在AVS2中运动预测中使用的MV都是1/4像素精度,通过在整像素间插值能显著提升非整像素运动预测的精度,同时带来的问题是随着MV精度的提高编码MVD所需的比特数也会增加。 AMVR AMVR支持的MVD编码5种精度的MVR{1/4,1/2,1,2,4},索引为0到4&#x…

IU5706 外置MOS、33V输出大功率同步升压芯片产品介绍

概要 IU5706E是高性能宽输入范围(4.5V~24V)同步升压控制器,支持高达33V的输出电压。输出电压采用恒定频率电流模式脉宽调制(PWM)控制来实现调节。 芯片通过外部定时电阻器或通过与外部时钟信号同步来设置开关频率。在电…

PGL 系列(五)DeepWalk

DeepWalk 通过随机游走(truncated random walk)学习出一个网络的表示,在网络标注顶点很少的情况也能得到比较好的效果。随机游走起始于选定的节点,然后从当前节点移至随机邻居,并执行一定的步数,该方法大致可分为四个步骤: (a) 展示了原始的用户行为序列。(b) 基于这些用…