required
| Header | #include
|
|---|---|
| qmake: | QT += webchannel |
| Since: | Qt 5.4 |
| Inherits: | QObject |
簡介
QWebChannel 類的作用是向遠端Html客戶端暴露 QObject。
QWebChannel 填補了c++應用程序和 HTML/JavaScript 應用程序之間的空白。通過將QObject派生對象發布到QWebChannel並在html中引入qwebchannel.js腳本可從此處獲取。在HTML端，可以透明地訪問QObject的屬性、公共槽和方法。不需要手動消息傳遞和數據序列化，c++方面的屬性更新和信號發射將自動傳輸到可能遠程運行的HTML客戶機。在客戶端，將為任何發布的c++ QObject創建JavaScript對象。它反映了c++對象的API，因此可以直觀地使用。
成員函數
| QWebChannel(QObject *parent = Q_NULLPTR) | |
|---|---|
| virtual | ~QWebChannel() |
| bool | blockUpdates() const |
| void | deregisterObject(QObject *object) |
| void | registerObject(const QString &id, QObject *object) |
| void | registerObjects(const QHash<QString, QObject *> &objects) |
| QHash<QString, QObject *> | registeredObjects() const |
| void | setBlockUpdates(bool block) |
- registerObject 函數可以向 html 中注冊 QObject 對象，可以指定對象 ID。
- deregisterObject 函數解除注冊。
- blockUpdates 函數 和 setBlockUpdates 分別用來 獲取和 設置 對象更新的阻塞標志。當設置為true時，更新將被阻塞，遠程客戶端將不會收到有關屬性更改的通知。
更新將被記錄下來，通過將此屬性設置為false解除阻塞將記錄發送到客戶機。默認情況下，更新不會被阻止。
槽函數
| void | connectTo(QWebChannelAbstractTransport *transport) |
|---|---|
| virtual | disconnectFrom(QWebChannelAbstractTransport *transport) |
- connectTo 函數連接 QWebChannel到指定的 transport 對象。然后 transport 對象將負責C++ App 與 遠端Html客戶端之間的通信。
- disconnectFrom 函數 QWebChannel 與 transport 對象的連接。
使用實例
c++ 代碼
connect(ui->editor, &QPlainTextEdit::textChanged, [this]() {
m_content.setText(ui->editor->toPlainText());
});
QWebChannel *channel = new QWebChannel(this);
channel->registerObject(QStringLiteral("content"), &m_content);
PreviewPage *page = new PreviewPage(this);
page->setWebChannel(channel);
ui->preview->setPage(page);
ui->preview->setUrl(QUrl("qrc:/index.html"));
html 端
<!doctype html>
<html lang="en">
<meta charset="utf-8">
<head>
<link rel="stylesheet" type="text/css" href="3rdparty/markdown.css">
<script src="3rdparty/marked.min.js"></script>
<script src="qwebchannel.js"></script>
</head>
<body>
<div id="placeholder"></div>
<script>
'use strict';
var placeholder = document.getElementById('placeholder');
var updateText = function(text) {
placeholder.innerHTML = marked(text);
}
new QWebChannel(qt.webChannelTransport,
function(channel) {
var content = channel.objects.content;
updateText(content.text);
content.textChanged.connect(updateText);
}
);
</script>
</body>
</html>
更多實例見 qt example webchannel 部分