散装码农,Qt加载QWebEngineView和js交互

您现在的位置是：网站首页> C/C++

Qt加载QWebEngineView和js交互

C/C++
2022-03-22
932人已阅读

摘要

Qt5之后竟然集成了chromium；测试验证技术是否可用，目前除了http音频无法播放，CPP和JS交互，包括网页调试，已完全OK；顺便吐槽一下“百度”，搜的都是一样，多少都少点东西，不是缺 qwebchannel.js 就是少了jquery-3.1.1.min.js，一般情况下肯定在本地调试！少了jquery，本地测试js无法调用Qt提供的方法(也是公共槽的方法);

点击下载qwebchannel

下面是主要代码和注意事项：

1.必须加载qwebchannel.js, 如果是本地调试还需要jquery-3.1.1.min.js;

2.打开本地调试：http://127.0.0.1:9999（Remote debugging server started successfully. Try pointing a Chromium-based browser to http://127.0.0.1:9999）

定义更新属性：

#ifndef JSCPP_H

#define JSCPP_H

#include <QObject>

#include <QMessageBox>

class JsCpp : public QObject

{undefined

Q_OBJECT

Q_PROPERTY(QString name MEMBER m_name NOTIFY sigNameChanged)

Q_PROPERTY(int age MEMBER m_age NOTIFY sigAgeChanged)

public:

JsCpp(QObject *parent = 0);

~JsCpp();

public:

void SetName(const QString name);

void SetAge(const int age);

public slots:

void ShowMsg(const QString& param1, const QString& param2);

signals:

void sigNameChanged(const QString& name);

void sigAgeChanged(int age);

private:

QString m_name;

int m_age;

};

#endif // JSCPP_H、

//>>>>>>>>>>>>>>>>>>......提供方法....的文件....................

#include "JsCpp.h"

JsCpp::JsCpp(QObject *parent)

: QObject(parent)

{undefined

m_name = "a_hua";

m_age = 16;

}

JsCpp::~JsCpp()

{undefined

}

void JsCpp::SetName(const QString name)

{undefined

m_name = name;

emit sigNameChanged(name);

}

void JsCpp::SetAge(const int age)

{undefined

m_age = age;

emit sigAgeChanged(age);

}

void JsCpp::ShowMsg(const QString& param1, const QString& param2)

{undefined

QMessageBox::information(nullptr, "Hello " + param1, "I'm here! " + param2, QMessageBox::Ok);

}

///主类中的方法///

####构造 ---- 初始化------

//打开调试..

qputenv("QTWEBENGINE_REMOTE_DEBUGGING", "9999");

m_pWebView = new QWebEngineView(ui.widget);//

connect(m_pWebView, SIGNAL(loadFinished(bool)), this, SLOT(webLoadFinished(bool)));

//打开本地缓存.

QString _strStoreage = QString("%1/local_storage").arg(QCoreApplication::applicationDirPath());

QDir _dir(_strStoreage);

if (!_dir.exists())

_dir.mkpath(_strStoreage);

m_pWebView->page()->profile()->setPersistentStoragePath(_strStoreage);

//提供的方法类

m_pJsCpp = new JsCpp();

//创建。。。。。。调用......

m_pWebChannel = new QWebChannel();

m_pWebChannel->registerObject("js_cpp", m_pJsCpp);//注册对象

//必须设置，否则无法调用方法....

m_pWebView->page()->setWebChannel(m_pWebChannel);

//加载页面

QString _testPath = QString("%1/HtmlTest/test.html").arg(QCoreApplication::applicationDirPath());

m_pWebView->load(QUrl(_testPath));、

###调用js

m_pWebView->page()->runJavaScript("showMessage()");

==================测试页面=====================

<!DOCTYPE html>

<html>

<head>

<div>

<br/>

</div>

</head>

</body>

function showMessage()

{undefined

QtCpp.ShowMsg("111", "2222");

}

var updateName = function(text)

{undefined

$("#name").val(text);

}

var updateAge = function(text)

{undefined

$("#age").val(text);

}

new QWebChannel(qt.webChannelTransport, function(channel){undefined

var _obj = channel.objects.js_cpp;

window.QtCpp = _obj;

updateName(_obj.name);

updateAge(_obj.age);

_obj.sigNameChanged.connect(updateName);

_obj.sigAgeChanged.connect(updateAge);

});

</script>

</html>

上一篇：qt开发的APP发布到appstore

下一篇：QString的数据转换

您现在的位置是：网站首页> C/C++

Qt加载QWebEngineView和js交互

相关文章