https://stackoverflow.com/questions/5673827/is-there-an-example-websockets-for-qt
QT項目中
.pro文件：
QT += core gui #獲取串口列表倒包 QT += serialport #創建websocket倒包 QT += websockets
inspection_server.h :
#ifndef __INSPECTION_SERVER_HPP__
#define __INSPECTION_SERVER_HPP__
#include <QWebSocketServer>
#include <QWebSocket>
#include <QObject>
#include <iostream>
#include <memory>
class InspectionServer;
typedef std::shared_ptr<QWebSocketServer> QWebSocketServerPtr;
typedef std::shared_ptr<QWebSocket> QWebSocketPtr;
typedef std::shared_ptr<InspectionServer> InspectionServerPtr;
class InspectionServer: public QObject
{
Q_OBJECT
QWebSocketServerPtr websocketServer;
QList<QWebSocketPtr> clients;
public:
InspectionServer(uint16_t port);
signals:
void closed();
private slots:
void onNewConnection();
void processTextMessage(const QString& message);
void socketDisconnected();
};
#endif
inspection_server.cpp文件：
#include "inspection_server.h" #include <QDebug> InspectionServer::InspectionServer(uint16_t port) : websocketServer(new QWebSocketServer(QStringLiteral("Inspection server"), QWebSocketServer::NonSecureMode)) { if(this->websocketServer->listen(QHostAddress::Any, port)) { QObject::connect(websocketServer.get(), SIGNAL(newConnection()), this, SLOT(onNewConnection())); } else { throw std::runtime_error("InspectionServer: failed to listen"); } } void InspectionServer::onNewConnection() { qInfo() << "InspectionServer::onNewConnection"; QWebSocketPtr socket(this->websocketServer->nextPendingConnection()); QObject::connect(socket.get(), SIGNAL(textMessageReceived(const QString&)), this, SLOT(processTextMessage(const QString&))); QObject::connect(socket.get(), SIGNAL(disconnected()), this, SLOT(socketDisconnected())); this->clients.append(socket); } void InspectionServer::processTextMessage(const QString& message) { qInfo() << "InspectionServer::processTextMessage: " << message; } void InspectionServer::socketDisconnected() { qInfo() << "InspectionServer::socketDisconnected"; }
在main.cpp中調用、開啟服務：
#include "mainwindow.h" #include <QApplication> //導入串口包 #include <QCoreApplication> #include <QList> #include <stdio.h> #include <QDebug> #include <QtSerialPort/QSerialPort> #include <QtSerialPort/QSerialPortInfo> //創建websocket #include <QWebSocketServer> #include "inspection_server.h" int main(int argc, char *argv[]) { QApplication a(argc, argv); // MainWindow w; // w.show(); qDebug()<< "main.cpp執行了"; InspectionServer server(1234); return a.exec(); }
打開一個網頁index.html (必須使用node等腳本開啟html服務 , http://localhost:5050/)
start.js :
var http = require('http');//創建服務器的 var fs = require('fs'); //引入進來的是模塊，模塊中有方法，下一步就是使用方法 //Node.js一個最主要的特點：執行的基本都是函數 //創建服務 var myServer = http.createServer(function(req,res){ //req->請求變量：客戶端請求服務器的 //res->響應變量:服務器要給客戶端寫回的變量 //前端頁面應該給客戶端顯示，即寫回去 //這之前應該先把文件內容讀出來 var html = fs.readFileSync('./index.html') res.write(html); //結束寫的操作 res.end(); }) //服務端等着客戶端請求需要做一個監聽。通過創建的服務。 //監聽 myServer.listen('5050',function(err){ if(err){ console.log(err); throw err; } console.log("服務器已開啟。端口號為:5050"); }) //瀏覽器請求服務器。知道當前計算機的ip地址。例如，127.0.0.1:3000
index.html :
<html> <body> <button onClick="initWebSocket();">Connect</button> <br> <input type="text" id="messageInput"> <button onClick="sendMessage();">Send message</button> </body> </html> <script type="text/javascript"> var websocket = null; var start = function () { websocket = new WebSocket("ws://localhost:1234"); } websocket.onopen = function () { console.log('鏈接開始了') } ws.onmessage = function (evt) { var received_msg = evt.data; console.log("數據已接收...", received_msg); }; ws.onclose = function () { // 關閉 websocket alert("連接已關閉..."); }; //直接開啟websocket start(); function sendMessage() { websocket.send(document.getElementById("messageInput").value); } </script>
最后一步，執行腳本命令開啟服務：
node start.js
效果：
在瀏覽器中打開http://localhost:5050/這個地址的網頁，如下圖。
在QT的IDE控制台中會打印出LOG：
