PyQt5
60篇
PyQt5:Web页面交互初探2-2(QWebChannel和QWebEngineView的综合使用)
导读:QWebChannel的介绍
LEARN MORE
正文
接上一期我们继续来介绍QWebChannel和QWebEngineView的综合使用。
涉及到QWebEngineView的知识点我就不做介绍了,大家自己看源码就行了。
1
部分核心源码
PyQt5侧
QWebChannel的使用主要是涉及以下代码:
其中
创建一个QWebChannel对象,还需要使用qwebchannel.js正确设置HTML客户端。
使用给定父级构造QWebChannel对象。
请注意,只要将QWebChannel连接到QWebChannelAbstractTransport,它就可以完全运行。 还需要使用qwebchannel.js正确设置HTML客户端。
设置JavaScript API
要与QWebChannel或WebChannel通信,客户端必须使用并设置qwebchannel.js提供的JavaScript API。对于在Qt WebEngine中运行的客户端,您可以通过”./qwebchannel.js”加载该文件。对于外部客户端,您需要将文件复制到Web服务器。然后实例化一个QWebChannel对象并向其传递一个传输对象和一个回调函数,该函数将在通道初始化完成并且已发布的对象可用后调用。
传输对象实现最小的消息传递接口。它应该是一个带有send()函数的对象,该函数接受字符串化的JSON消息并将其传输到服务器端的QWebChannelAbstractTransport对象。此外,当收到来自服务器的消息时,应调用其onmessage属性。或者,您可以使用WebSocket实现该接口。
请注意,一旦传输对象完全运行,就应构建JavaScript QWebChannel对象。对于WebSocket,这意味着您应该在套接字的onopen处理程序中创建QWebChannel。
与QObjects交互
一旦调用传递给QWebChannel对象的回调,通道就完成了初始化,并且HTML客户端可以通过channel.objects属性访问所有已发布的对象。因此,假设一个对象是使用标识符“foo”发布的,那么我们可以与它进行交互,如下例所示。请注意,HTML客户端和QML / C ++服务器之间的所有通信都是异步的。属性缓存在HTML端。此外,请记住,只有可以转换为JSON的QML / C ++数据类型才能正确地(反)序列化,从而可以被HTML客户端访问。
上面的只是一个示例,我们在实现过程中尚未像这样的。
将单个对象注册到QWebChannel。
对象的属性,信号和公共方法将发布到远程客户端。 然后,构造具有标识符id的对象。
注意:当前限制是必须在初始化任何客户端之前注册对象。
这里标示符id是“connection”,对象是“shared”
设置此页面使用的Web通道实例,以便在JavaScript中引导和安装它。使用此方法,可以通过网页内容访问Web通道。
web_pyqt是我们实例化窗口后的对象。
共享类中完成值设置后发射信号并传递值给web_pyqt的setLineEdit()函数,用于自动填充PyQt5程序中的用户名和密码。
到目前为止PyQt5与Web页面之间的通道完成了一半了,剩下的部分还需在Web页面中配置。
Web页面侧
下面我们来看看自己写的Web页面,这里限于篇幅只展示涉及到的核心部分。
其他一些涉及控制类的JavaScript语句就不展示了。
当初始的 HTML 文档被完全加载和解析完成之后,DOMContentLoaded 事件被触发,而无需等待样式表、图像和子框架的完成加载。这样我们就新建一个QWebChannel对象(针对qwebchannel.js里的)
Web页面可以通过channel.objects属性访问所有已发布的对象,这里对象的id是“conncetion”。我们将其设置成JavaScript的全局变量:window.connection。
若window.connection存在,我们给第三方共享类里面的value设置成变量np的值。
现在我们再来回顾一下那个共享类。
当我们给value设置值的时候,调用了Web2PyQt5Value()函数。取得了用户名和密码,弹出对话框,并将其通过信号传递给PyQt5的主窗口用于用户名和密码输入栏的自动填充。
2
最后
好的,今天这期就这样结束吧。下期我们再继续。建议多看看源码,自己写写,可能更有体会。如果你喜欢本篇文章,请给我点赞
赞赏(推荐)
分享给你的好友们吧!
领取专属 10元无门槛券
私享最新 技术干货