pro文件
文件中需要加入”QT += core gui webenginewidgets”這句話，不然提示找不到文件
QT += core gui
QT += core gui webenginewidgets
greaterThan(QT_MAJOR_VERSION, 4): QT += widgets
TARGET = WebEngine
TEMPLATE = app
# The following define makes your compiler emit warnings if you use
# any feature of Qt which has been marked as deprecated (the exact warnings
# depend on your compiler). Please consult the documentation of the
# deprecated API in order to know how to port your code away from it.
DEFINES += QT_DEPRECATED_WARNINGS
# You can also make your code fail to compile if you use deprecated APIs.
# In order to do so, uncomment the following line.
# You can also select to disable deprecated APIs only up to a certain version of Qt.
#DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000 # disables all the APIs deprecated before Qt 6.0.0
SOURCES += \
main.cpp \
mainwindow.cpp \
cwebconnct.cpp
HEADERS += \
mainwindow.h \
cwebconnct.h
FORMS += \
mainwindow.uimain.cpp
#include "mainwindow.h"
#include <QApplication>
#include <QWebEngineView>
#include <QWebChannel>
#include "cwebconnct.h"
int main(int argc, char *argv[])
{
QApplication a(argc, argv);
QWebEngineView view;
//view.setUrl(QUrl(QStringLiteral("http://html5test.com")));
view.setUrl(QUrl("file:///C:/Users/Documents/QT/WebEngine/html/test.html"));
view.resize(1024, 768);
view.show();
QWebChannel* webchannel= new QWebChannel(&view);
CWebConnct webconnet(NULL);
webchannel->registerObject(QStringLiteral("content"),&webconnet);
view.page()->setWebChannel(webchannel);
return a.exec();
}橋接類
#ifndef CWEBCONNCT_H
#define CWEBCONNCT_H
#include <QObject>
#include <QDebug>
class CWebConnct : public QObject
{
Q_OBJECT
public:
explicit CWebConnct(QObject *parent = nullptr);
signals:
void sendText(const QString &text);
public slots:
void receiveText(const QString &r_text);
};
#endif // CWEBCONNCT_H#include "cwebconnct.h"
CWebConnct::CWebConnct(QObject *parent) : QObject(parent)
{
}
void CWebConnct::receiveText(const QString &r_text)
{
qDebug()<<(QObject::tr("Received message: %1").arg(r_text));
emit sendText(r_text);//此處是異步通信
qDebug()<<(QObject::tr("Received message end"));
}測試的html文件
需要在html中引用qwebchannel.js文件
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>彈窗</title>
<script type="text/javascript" src="./qwebchannel.js"></script>
<script type="text/javascript">
window.onload = function() { //所有的必須在裏面進行寫嗎？？？
var content;
new QWebChannel(qt.webChannelTransport, function(channel) {
// make dialog object accessible globally
content = channel.objects.content; //把對象賦值到JS中
document.getElementById("sendtest").onclick=function (){
content.receiveText("sss");
}
content.sendText.connect(function(message) { //連接QT中發出的信號，裏面的message是參數;只需要在QT中調用此函數也就是sendText就可以調用JS函數
alert("Received message: " + message);
});
});
}
</script>
</head>
<body>
<button id="sendtest" >測試webchannel</button>
</html>