PyQt5：Web页面交互初探2-1

PyQt5

59篇

PyQt5：Web页面交互初探2-1（QWebChannel和QWebEngineView的综合使用）

导读：共享类的介绍

LEARN MORE

正文

上期我们利用QWebEngineView和ECharts完成了一个漂亮的饼图，这篇可以看成是PyQt5向Web页面传递参数的。本期我们尝试Web页面向PyQt5传递相关的参数。本期涉及到的PyQt5类是QWebChannel。

1

总体介绍

QWebChannel填补了C++应用程序（这里是针对Qt，PyQt5是Python）和HTML / JavaScript应用程序之间的空白。通过将QObject派生对象发布到QWebChannel并在HTML端使用qwebchannel.js，可以透明地访问QObject的属性和公共函数和方法。不需要手动消息传递和数据序列化，Python端的属性更新和信号发射会自动传输到可能远程运行的HTML客户端。在客户端，将为任何已发布的QObject创建JavaScript对象。它反映了对象的API，因此直观易用。

QWebChannel API可以与任何可以在本地甚至远程计算机上运行的HTML客户端进行通信。唯一的限制是HTML客户端支持qwebchannel.js使用的JavaScript功能。因此，人们可以与基本上任何现代HTML浏览器或独立JavaScript运行时进行交互，例如node.js。

详细内容请见官网：

http://doc.qt.io/qt-5/QWebChannel.html

类归属

PyQt5->QtWebChannel->QWebChannel

继承关系

PyQt5->QObject->QWebChannel

2

小例子

本次的小例子我们自己写了一个简单的HTML页面，页面上就一个功能，填写用户名和密码，然后提交。

在这个小例子中我们分别实现以下两个功能：

1、通过Web页面提交后，PyQt5应用程序收到了Web页面中提交的用户名和密码，并完成PyQt5应用程序中用户名和密码的自动填充。效果如下：

2、通过PyQt5应用程序提交后，在Web页面中得到了PyQt5应用程序中传来的用户名和密码，并完成Web页面中自动填充。效果如下：

话说这个是怎么实现的呢？第二种方式我们可以采用上期介绍了通过运行JavaScript代码的方式完成传值。那么第一种呢？这个就是本期的重点了。

要完成这个功能，我们需要借助于“第三方共享类”，如下图：

借助“第三方共享类”，我们实现了Web页面到PyQt5值传递。

3

部分核心代码解析

共享类

我们先来看看共享类。

在这个共享类里面我们比以前多了一个新的知识点：pyqtProperty。

使用pyqtProperty()函数定义新的PyQt属性。 它的使用方式与标准的Python property()函数相同。 事实上，以这种方式定义的PyQt属性也表现为Python属性。

那么问题又来了，什么是Python property()函数？？

根据Python的帮助文档上的介绍，它的完全形式是这样的：

作用是返回Python的某一个属性。

fget是获取属性值的函数。 fset是用于设置属性值的函数。 fdel是用于删除属性值的函数。 doc为该属性创建了一个docstring。

典型用法是定义可被管理的属性x：

如果c是C的实例，c.x将调用getter，c.x = value将调用setter和del c.x将调用delx。

如果给定，doc将是property属性的docstring。 否则，该属性将复制fget的docstring（如果存在）。

这使得使用property()作为装饰器可以轻松创建只读属性：

@property装饰器将voltage()方法转换为具有相同名称的只读属性。

属性对象具有可用作装饰器的getter，setter和deleter方法，这些方法创建属性的副本，并将相应的访问函数设置为装饰函数。举例如下：

此代码与第一个示例完全等效:

请务必为其他函数指定与原始属性相同的名称（在本例中为x）。

返回的属性对象还具有与构造函数参数对应的属性fget，fset和fdel。

在PyQt5中，它是这么用的：

感觉很复杂！

创建一个既作为Python属性又作为PyQt属性的属性。

参数：

type - 属性的类型。 它是Python类型对象或字符串。

fget - 用于获取属性值的，可选。

fset - 用于设置属性值的，可选。

freset - 用于将属性值重置为其默认值的，可选。

fdel - 用于删除属性的，可选。

doc - 属性的docstring，可选。

designable - 设置Qt DESIGNABLE标志，可选。

scriptable - 设置Qt SCRIPTABLE标志，可选。

stored - 设置Qt STORED标志，可选。

user - 设置Qt USER标志，可选。

constant - 设置Qt CONSTANT标志，可选。

final - 设置Qt FINAL标志，可选。

notify - 未绑定通知信号，可选。

revision - 导出到QML的修订版。

返回类型：属性对象。

也可以使用pyqtProperty()作为装饰器，方法与标准Python property()函数相同。 以下示例显示如何使用getter和setter定义int属性：

好了，现在我们回过头来再看下我们自己定义的共享类。

写上，但是后面我们没用。

当我们得到从Web页面传来值的时候，我们处理一下，分成用户名和密码，并将其通过自定义信号发射出去。

形成一个属性。具体哪里使用，我们后面会介绍。

可能到这里你有点云里雾里的感觉，不要急，接下来的更精彩！

4

最后

好的，今天这期就这样结束吧。下期我们再继续。如果你喜欢本篇文章，请给我点赞

赞赏（推荐）

分享给你的好友们吧！