c++ qt通过QWebChannel与JS html网页端交互通信_qwebchannel js

最新推荐文章于 2024-09-18 20:32:56 发布

2401_85013211

最新推荐文章于 2024-09-18 20:32:56 发布

阅读量561

点赞数 5

CC 4.0 BY-SA版权

分类专栏： 2024年程序员学习文章标签：物联网嵌入式硬件面试

本文链接：https://blog.csdn.net/2401_85013211/article/details/138965043

2024年程序员学习专栏收录该内容

30 篇文章

订阅专栏

收集整理了一份《2024年最新物联网嵌入式全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升的朋友。

如果你需要这些资料，可以戳这里获取

需要这些体系化资料的朋友，可以加我V获取：vip1024c （备注嵌入式）

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人

都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

    m_clientWrapper = new WebSocketClientWrapper(m_websocketServer);

// setup the channel
if(m_webchannel == NULL)
{
    m_webchannel = new QWebChannel();
    QObject::connect(this->m_clientWrapper,&WebSocketClientWrapper::clientConnected,m_webchannel,&QWebChannel::connectTo);
}
// 将通信类注册到channel
if(m_web_transport == NULL)
{
    m_web_transport = new WebTransport(this);
    m_webchannel->registerObject("MyWebTransPort",m_web_transport); //网页上调佣MyWebTransPort，即可连接槽函数通信
    qDebug()<<"register MyWebTransPort channel success!!!!";
    UpdateTextMessage("register MyWebTransPort channel success!!!!");
}

}


***2、MainWindow.h***

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include
#include
#include
#include <QtWebSockets/QWebSocketServer>
#include “websockettransport.h”
#include “websocketclientwrapper.h”
#include <QtWebChannel/qwebchannel.h>
#include

#include “WebTransport.h”

QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
Q_OBJECT

public:
MainWindow(QWidget *parent = nullptr);
~MainWindow();
void UpdateTextMessage(QString text);

private:
void initWebTransPort();

private:
Ui::MainWindow ui;
QWebSocketServer m_websocketServer{nullptr};
WebSocketClientWrapper* m_clientWrapper{nullptr};
QWebChannel* m_webchannel{nullptr};
WebTransport* m_web_transport{nullptr};

};
#endif // MAINWINDOW_H


***3、通信类***


**3.1 WebTransport .h**

#ifndef WEBTRANSPORT_H
#define WEBTRANSPORT_H
#include

//通信类对象
class WebTransport : public QObject
{
Q_OBJECT
public:
WebTransport(QObject*parent);
~WebTransport();

signals:
//用于发送给js页面的数据
void SignalSendToJs(QString text);
void SignalSendToUI(QString text);

public slots:
// js调用此函数由于是异步通信，js端使用promise方式调用
// 接收JS传递过来的字符串
void RecvTextFromJs(const QString &text);

};
#endif //


**3.2 WebTransport.cpp**

#include “WebTransport.h”
#include
#include
WebTransport::WebTransport(QObject*parent)
:QObject(parent)
{

}

WebTransport::~WebTransport()
{

}

void WebTransport::RecvTextFromJs(const QString &text)
{
qDebug()<<"********** get text from js: "<<text;
emit SignalSendToUI(text);
}


### **二、JS/HTML网页端**


**1、从qt安装目录获取qwebchannel.js并与index.html放在同级目录**


index.html

Vite App

发送

收集整理了一份《2024年最新物联网嵌入式全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升的朋友。

如果你需要这些资料，可以戳这里获取

需要这些体系化资料的朋友，可以加我V获取：vip1024c （备注嵌入式）

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人

都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

，可以戳这里获取](https://bbs.csdn.net/topics/618679757)**

需要这些体系化资料的朋友，可以加我V获取：vip1024c （备注嵌入式）

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人

都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！