Qt文档阅读笔记-Simple Chat Example解析

转x33g5p2x  于2022-06-06 转载在 其他  
字(6.2k)|赞(0)|评价(0)|浏览(623)

这个实例使用QWebSocket和QWebSocketServer去构造WebSocket协议的极简聊天室。

官方对于这个实例给出的文档方面的介绍就这么多，下面是对应的代码，我自己补充下：

文件一共如下：

我们由简入深分析下，首先是simplechat.pro

  1. QT = websockets
  3.  TARGET = chatserver
  4.  CONFIG   += console
  5.  CONFIG   -= app_bundle
  7.  TEMPLATE = app
  9.  SOURCES += \
  10.      main.cpp \
  11.      chatserver.cpp
  13.  HEADERS += \
  14.      chatserver.h
  16.  EXAMPLE_FILES += chatclient.html
  18.  target.path = $$[QT_INSTALL_EXAMPLES]/websockets/simplechat
  19.  INSTALLS += target

这里主要是包含websockets模块，使用的语法是 QT = websockets

main.cpp就是实例化ChatServer在此不再说明。

下面是chartserver.h和chartserver.cpp

  1. #ifndef CHATSERVER_H
  2. #define CHATSERVER_H
  4. #include <QtCore/QObject>
  5. #include <QtCore/QList>
  7. QT_FORWARD_DECLARE_CLASS(QWebSocketServer)
  8. QT_FORWARD_DECLARE_CLASS(QWebSocket)
  9. QT_FORWARD_DECLARE_CLASS(QString)
  11. class ChatServer : public QObject
  12. {
  13.     Q_OBJECT
  14. public:
  15.     explicit ChatServer(quint16 port, QObject *parent = nullptr);
  16.     ~ChatServer() override;
  18. private slots:
  19.     void onNewConnection();
  20.     void processMessage(const QString &message);
  21.     void socketDisconnected();
  23. private:
  24.     QWebSocketServer *m_pWebSocketServer;
  25.     QList<QWebSocket *> m_clients;
  26. };
  28. #endif //CHATSERVER_H
  1. #include "chatserver.h"
  3. #include <QtWebSockets>
  4. #include <QtCore>
  6. #include <cstdio>
  7. using namespace std;
  9. QT_USE_NAMESPACE
  11. static QString getIdentifier(QWebSocket *peer)
  12. {
  13.     return QStringLiteral("%1:%2").arg(peer->peerAddress().toString(),
  14.                                        QString::number(peer->peerPort()));
  15. }
  17. //! [constructor]
  18. ChatServer::ChatServer(quint16 port, QObject *parent) :
  19.     QObject(parent),
  20.     m_pWebSocketServer(new QWebSocketServer(QStringLiteral("Chat Server"),
  21.                                             QWebSocketServer::NonSecureMode,
  22.                                             this))
  23. {
  24.     if (m_pWebSocketServer->listen(QHostAddress::Any, port))
  25.     {
  26.         QTextStream(stdout) << "Chat Server listening on port " << port << '\n';
  27.         connect(m_pWebSocketServer, &QWebSocketServer::newConnection,
  28.                 this, &ChatServer::onNewConnection);
  29.     }
  30. }
  32. ChatServer::~ChatServer()
  33. {
  34.     m_pWebSocketServer->close();
  35. }
  36. //! [constructor]
  38. //! [onNewConnection]
  39. void ChatServer::onNewConnection()
  40. {
  41.     auto pSocket = m_pWebSocketServer->nextPendingConnection();
  42.     QTextStream(stdout) << getIdentifier(pSocket) << " connected!\n";
  43.     pSocket->setParent(this);
  45.     connect(pSocket, &QWebSocket::textMessageReceived,
  46.             this, &ChatServer::processMessage);
  47.     connect(pSocket, &QWebSocket::disconnected,
  48.             this, &ChatServer::socketDisconnected);
  50.     m_clients << pSocket;
  51. }
  52. //! [onNewConnection]
  54. //! [processMessage]
  55. void ChatServer::processMessage(const QString &message)
  56. {
  57.     QWebSocket *pSender = qobject_cast<QWebSocket *>(sender());
  58.     for (QWebSocket *pClient : qAsConst(m_clients)) {
  59.         if (pClient != pSender) //don't echo message back to sender
  60.             pClient->sendTextMessage(message);
  61.     }
  62. }
  63. //! [processMessage]
  65. //! [socketDisconnected]
  66. void ChatServer::socketDisconnected()
  67. {
  68.     QWebSocket *pClient = qobject_cast<QWebSocket *>(sender());
  69.     QTextStream(stdout) << getIdentifier(pClient) << " disconnected!\n";
  70.     if (pClient)
  71.     {
  72.         m_clients.removeAll(pClient);
  73.         pClient->deleteLater();
  74.     }
  75. }
  76. //! [socketDisconnected]

这里解释几个点：

①m_pWebSocketServer是QWebSocketServer，指定其名和mode以及开通的端口号；

②newConnection中，使用m_pWebSocketServer获取nextPendingConnection，然后得到这个与客户端相连的socket后，设置信号与槽。

③processMessage，将获取到用户发来的信号与槽，发送给所有连接到服务器的用户。

④socketDisconnect，当用户断开连接后，把其用户移除m_clients。

下面是chartclient.html

  1. <html>
  2.     <head>
  3.         <title>WebSocket Chat Client</title>
  4.     </head>
  5.     <body>
  6.         <h1>WebSocket Chat Client</h1>
  7.         <p>
  8.             Host: <input id="webSocketHost" type="text" value="localhost:1234"/>
  9.         </p>
  10.         <p>
  11.             <button onClick="initWebSocket();">Connect</button>
  12.             <button id="disconnectButton" onClick="stopWebSocket();" disabled>Disconnect</button>
  13.             <button onClick="checkSocket();">State</button>
  14.         </p>
  15.         <p>
  16.             <textarea id="debugTextArea" style="width:400px;height:200px;" readonly></textarea>
  17.         </p>
  18.         <p>
  19.             <input type="text" id="inputNick" value="nickname" />
  20.             <input type="text" id="inputText" onkeydown="if(event.keyCode==13)sendMessage();"/>
  21.             <button id="sendButton" onClick="sendMessage();" disabled>Send</button>
  22.         </p>
  24.         <script type="text/javascript">
  25.             var debugTextArea = document.getElementById("debugTextArea");
  26.             function debug(message) {
  27.                 debugTextArea.value += message + "\n";
  28.                 debugTextArea.scrollTop = debugTextArea.scrollHeight;
  29.             }
  31.             function sendMessage() {
  32.                 var nickname = document.getElementById("inputNick").value;
  33.                 var msg = document.getElementById("inputText").value;
  34.                 var strToSend = nickname + ": " + msg;
  35.                 if ( websocket != null )
  36.                 {
  37.                     document.getElementById("inputText").value = "";
  38.                     websocket.send( strToSend );
  39.                     console.log( "string sent :", '"'+strToSend+'"' );
  40.                     debug(strToSend);
  41.                 }
  42.             }
  44.             var websocket = null;
  46.             function initWebSocket() {
  47.                 try {
  48.                     if (typeof MozWebSocket == 'function')
  49.                         WebSocket = MozWebSocket;
  50.                     if ( websocket && websocket.readyState == 1 )
  51.                         websocket.close();
  52.                     var wsUri = "ws://" + document.getElementById("webSocketHost").value;
  53.                     websocket = new WebSocket( wsUri );
  54.                     websocket.onopen = function (evt) {
  55.                         debug("CONNECTED");
  56.                         document.getElementById("disconnectButton").disabled = false;
  57.                         document.getElementById("sendButton").disabled = false;
  58.                     };
  59.                     websocket.onclose = function (evt) {
  60.                         debug("DISCONNECTED");
  61.                         document.getElementById("disconnectButton").disabled = true;
  62.                         document.getElementById("sendButton").disabled = true;
  63.                     };
  64.                     websocket.onmessage = function (evt) {
  65.                         console.log( "Message received :", evt.data );
  66.                         debug( evt.data );
  67.                     };
  68.                     websocket.onerror = function (evt) {
  69.                         debug('ERROR: ' + evt.data);
  70.                     };
  71.                 } catch (exception) {
  72.                     debug('ERROR: ' + exception);
  73.                 }
  74.             }
  76.             function stopWebSocket() {
  77.                 if (websocket)
  78.                     websocket.close();
  79.             }
  81.             function checkSocket() {
  82.                 if (websocket != null) {
  83.                     var stateStr;
  84.                     switch (websocket.readyState) {
  85.                         case 0: {
  86.                             stateStr = "CONNECTING";
  87.                             break;
  88.                         }
  89.                         case 1: {
  90.                             stateStr = "OPEN";
  91.                             break;
  92.                         }
  93.                         case 2: {
  94.                             stateStr = "CLOSING";
  95.                             break;
  96.                         }
  97.                         case 3: {
  98.                             stateStr = "CLOSED";
  99.                             break;
  100.                         }
  101.                         default: {
  102.                             stateStr = "UNKNOW";
  103.                             break;
  104.                         }
  105.                     }
  106.                     debug("WebSocket state = " + websocket.readyState + " ( " + stateStr + " )");
  107.                 } else {
  108.                     debug("WebSocket is null");
  109.                 }
  110.             }
  111.         </script>
  112.     </body>
  113. </html>

这个html代码，浏览器运行后，会创建一个websocket连接到服务端上，然后进行文本串的交互。

版权说明 : 本文为转载文章, 版权归原作者所有 版权申明

原文链接 : https://it1995.blog.csdn.net/article/details/125140308

内容来源于网络，如有侵权，请联系作者删除！

qtwebsocket网络协议c/c++网络文档阅读笔记

相关文章

    查看更多

    热门标签

    更多
    JavaquerypythonNode开发语言requestUtil数据库Table后端算法LoggerMessageElementParser

    最新文章

    更多
    • 蜀ICP备13028337号-1 大数据知识库 https://www.saoniuhuo.com © All rights reserved
    • 本站内容来源互联网,如果侵犯您的权益请联系我们删除, 联系方式：448109455@qq.com