django商城网站开发的功能,海口网站制作,电脑网站转换手机网站怎么做,四子王旗建设局网站前言#xff1a;此项目使用达梦数据库#xff0c;以Qt制作服务器#xff0c;Html制作网页客户端界面#xff0c;可以通过任意浏览器访问。
1、Qt与网页进行数据交互
1.1、第一步#xff1a;准备qwebchannel.js文件
直接在qt的安装路径里复制即可
1.2、第二步#xf…前言此项目使用达梦数据库以Qt制作服务器Html制作网页客户端界面可以通过任意浏览器访问。
1、Qt与网页进行数据交互
1.1、第一步准备qwebchannel.js文件
直接在qt的安装路径里复制即可
1.2、第二步在Qt的.pro文件加载webchannel组件
在.pro文件添加如下组件
QT core gui sql webchannel widgets websockets1.3、第三步在main.cpp文件注册通信类
#include MainWindow.h
#include QApplication
#include QDesktopServices
#include QDialog
#include QDir
#include QFileInfo
#include QUrl
#include QWebChannel
#include QWebSocketServer
#include core.h
#include ../shared/websocketclientwrapper.h
#include ../shared/websockettransport.h
#include QObjectint main(int argc, char *argv[])
{QApplication a(argc, argv);//以下三行代码可有可无用来确保qwebchannel.js文件放在自己指定的文件夹里QFileInfo jsFileInfo(QDir::currentPath() /Web/js/qwebchannel.js);if (!jsFileInfo.exists())QFile::copy(:/qtwebchannel/qwebchannel.js,jsFileInfo.absoluteFilePath());// 设置QWebSocketServerQWebSocketServer server(QStringLiteral(QWebChannel Standalone Example Server), QWebSocketServer::NonSecureMode);if (!server.listen(QHostAddress::Any, 12345))//12345是端口号可以自己指定{qFatal(Failed to open web socket server.);return 1;}// 在QWebChannelAbstractTransport对象中包装WebSocket客户端WebSocketClientWrapper clientWrapper(server);// setup the channelQWebChannel channel;QObject::connect(clientWrapper, WebSocketClientWrapper::clientConnected,channel, QWebChannel::connectTo);MainWindow w;//MainWindow 类是我自己搭建的服务器界面类Core core(w);//Core 类是我自己搭建的用来作为Qt与Html通信的类channel.registerObject(QStringLiteral(core), core);//把Core注册成通信类w.show();//显示服务器界面return a.exec();
}1.4、第四步创建Core通信类
Core.h
#ifndef CORE_H
#define CORE_H#include MainWindow.h
#include QObject/*An instance of this class gets published over the WebChannel and is then accessible to HTML clients.该类的一个实例通过WebChannel发布然后HTML客户端可以访问它。
*/
class Core : public QObject
{Q_OBJECTpublic:Core(MainWindow *dialog, QObject *parent nullptr): QObject(parent), m_dialog(dialog){connect(dialog, MainWindow::sendText, this, Core::sendText);}signals:/*This signal is emitted from the C side and the text displayed on the HTML client side.该信号从Qt端发出并在HTML客户端显示文本。*/void sendText(const QString text);//html那边会监听这个信号Qt这边发送texthtml会直接接收到public slots:/*This slot is invoked from the HTML client side and the text displayed on the server side.此槽从HTML客户端调用并在服务器端显示文本。*/void receiveText(const QString text)//Html那边可以直接调用这个函数{qDebug()text;//text就是Html发过来的数据//m_dialog-displayMessage(MainWindow::tr(客户端: %1).arg(text));}private:MainWindow *m_dialog;
};#endif // CORE_H
1.5、第五步创建html客户端
chatRoom.html
!DOCTYPE html
htmlheadmeta http-equivContent-Type contenttext/html; charsetutf-8 /script typetext/javascript src../js/qwebchannel.js/scriptscript typetext/javascript//BEGIN SETUPfunction output(message) {var output document.getElementById(output);output.innerHTML output.innerHTML message \n;}window.onload function() {if (location.search ! )var baseUrl (/[?]webChannelBaseUrl([A-Za-z0-9\-:/\.])/.exec(location.search)[1]);elsevar baseUrl ws://localhost:12345;output(系统连接WebSocket服务器 baseUrl .);var socket new WebSocket(baseUrl);socket.onclose function() {console.error(web channel closed);};socket.onerror function(error) {console.error(web channel error: error);};socket.onopen function() {output(系统连接WebSocket设置QWebChannel.);new QWebChannel(socket, function(channel) {output(系统连接成功);// make core object accessible globallywindow.core channel.objects.core;document.getElementById(send).onclick function() {var input document.getElementById(input);var text input.value;if (!text) {return;}output(客户端 text);input.value ;core.receiveText(text);}core.sendText.connect(function(message) {output(服务器: message);});core.receiveText(客户端已连接准备发送/接收消息!);output(客户端客户端已连接准备发送/接收消息!);});}}//END SETUP/scriptstyle typetext/csshtml {height: 100%;width: 100%;}#input {width: 400px;margin: 0 10px 0 0;}#send {width: 90px;margin: 0;}#output {width: 500px;height: 300px;}/style/headbodytextarea idoutput/textareabr /input idinput /input typesubmit idsend valueSend οnclickjavascript:click(); //body
/html
2、问题
2.1、问题一Cannot invoke unknown method of index -1 on object webTransport(0x…)
问题描述运行时Qt向Js端发送消息没有问题Js端向Qt端发送消息时失败。 原因及解决办法使用Qt 5.11.2编译生成的可执行程序而网页端用的是Qt 5.14的qwebchannel.js文件版本不兼容导致的换成对应的qwebchannel.js文件就好了
2.2、问题二Qwebchannel is not defined at webSocket.socket.onopen
问题描述加载时无法连接qt。 原因及解决办法没有加载qwebchannel.js文件
script typetext/javascript src../js/qwebchannel.js/script
