Qt 零基础教程（12）- 网络编程入门之下：HTTP 请求与 TCP 多人聊天室实战

前言大家好我是白玉同学。上一篇我们学习了 TCP 和 UDP 的基础 Socket 编程今天我们继续网络编程的下半部分HTTP 协议请求以及基于 TCP 实现一个多人聊天室的完整实战项目。HTTP 是日常开发中最常用的网络协议而聊天室项目能把前面学的 TCP 知识彻底融会贯通。话不多说直接开干。本文属于一、HTTP 协议与 QNetworkAccessManager1.1 HTTP 简介HTTPHyperText Transfer Protocol超文本传输协议是基于 TCP 的应用层协议是 Web 世界的基石。默认端口80HTTP、443HTTPS请求方法GET、POST、PUT、DELETE 等特点请求 - 响应模式、无状态1.2 Qt HTTP 编程三剑客Qt 将 HTTP 封装为三个核心类表格类作用QNetworkAccessManager调度器管理所有请求一个 App 通常只实例化一个QNetworkRequest封装请求信息URL、Header、请求方法等QNetworkReply封装响应状态码、响应体、错误信息等1.3 异步编程模型Qt 的网络请求全部是异步的通过信号槽获取结果不会阻塞主线程创建QNetworkRequest → manager.get/post发送 → 得到QNetworkReply* → 关联reply的finished信号 → 读取响应数据 → reply-deleteLater()二、GET 与 POST 请求实战2.1 GET 请求示例#include QCoreApplication #include QNetworkAccessManager #include QNetworkRequest #include QNetworkReply #include QUrl #include QDebug class HttpDemo : public QObject { Q_OBJECT public: void doGet() { QNetworkRequest request; request.setUrl(QUrl(https://httpbin.org/get?namebaiyulangqt)); request.setHeader(QNetworkRequest::ContentTypeHeader, application/json); QNetworkReply *reply m_manager.get(request); connect(reply, QNetworkReply::finished, this, [](){ if (reply-error() QNetworkReply::NoError) { QByteArray data reply-readAll(); qDebug() GET响应 data; } else { qDebug() 请求失败 reply-errorString(); } reply-deleteLater(); }); } private: QNetworkAccessManager m_manager; };2.2 POST 请求JSON 格式void doPost() { QNetworkRequest request; request.setUrl(QUrl(https://httpbin.org/post)); request.setHeader(QNetworkRequest::ContentTypeHeader, application/json); // 构造JSON请求体 QJsonObject json; json[username] baiyu; json[password] 123456; QByteArray body QJsonDocument(json).toJson(); QNetworkReply *reply m_manager.post(request, body); connect(reply, QNetworkReply::finished, this, [](){ // 获取HTTP状态码 int statusCode reply-attribute( QNetworkRequest::HttpStatusCodeAttribute).toInt(); qDebug() 状态码 statusCode; QByteArray data reply-readAll(); qDebug() POST响应 data; reply-deleteLater(); }); }2.3 下载文件void downloadFile(const QString url, const QString savePath) { QNetworkRequest request(url); QNetworkReply *reply m_manager.get(request); // 监听下载进度 connect(reply, QNetworkReply::downloadProgress, this, [](qint64 bytesReceived, qint64 bytesTotal){ if (bytesTotal 0) { int percent bytesReceived * 100 / bytesTotal; qDebug() 下载进度 percent %; } }); connect(reply, QNetworkReply::finished, this, [](){ if (reply-error() QNetworkReply::NoError) { QFile file(savePath); if (file.open(QIODevice::WriteOnly)) { file.write(reply-readAll()); file.close(); qDebug() 下载完成 savePath; } } reply-deleteLater(); }); } 提示Qt 6 默认支持 HTTPS但需要系统安装 OpenSSL 库。Windows 下可将libcrypto-1_1-x64.dll和libssl-1_1-x64.dll放到 exe 同级目录。三、项目实战TCP 多人聊天室3.1 需求分析实现一个基于 TCP 的多人聊天室服务端监听端口管理所有在线客户端转发消息客户端连接服务器发送消息接收所有人的消息支持用户上线 / 下线通知、群聊消息3.2 通信协议设计为了简单我们使用纯文本协议每行一条消息表格消息类型格式说明普通聊天MSG:用户名:内容群聊消息系统通知SYS:内容上下线等系统消息设置用户名NAME:用户名客户端连接后发送3.3 整体架构┌─── 客户端A 服务端(8888端口) ───┼─── 客户端B └─── 客户端C 服务端收到任何客户端的消息后转发给所有其他客户端四、聊天室服务端实现4.1 服务端头文件chatserver.h#ifndef CHATSERVER_H #define CHATSERVER_H #include QWidget #include QTcpServer #include QTcpSocket #include QTextEdit #include QList class ChatServer : public QWidget { Q_OBJECT public: explicit ChatServer(QWidget *parent nullptr); private slots: void onNewConnection(); void onReadyRead(); void onDisconnected(); private: // 广播消息给所有客户端可选排除某个 void broadcast(const QString msg, QTcpSocket *exclude nullptr); QTcpServer *m_server; QListQTcpSocket* m_clients; // 所有在线客户端 QMapQTcpSocket*, QString m_names; // socket - 用户名 QTextEdit *m_logEdit; }; #endif // CHATSERVER_H4.2 服务端实现chatserver.cpp#include chatserver.h #include QVBoxLayout #include QLabel ChatServer::ChatServer(QWidget *parent) : QWidget(parent) { setWindowTitle(聊天室服务端 - 8888); resize(500, 400); m_logEdit new QTextEdit; m_logEdit-setReadOnly(true); auto *layout new QVBoxLayout(this); layout-addWidget(new QLabel(服务端日志)); layout-addWidget(m_logEdit); m_server new QTcpServer(this); m_server-listen(QHostAddress::Any, 8888); connect(m_server, QTcpServer::newConnection, this, ChatServer::onNewConnection); m_logEdit-append(服务端已启动监听端口 8888...); } void ChatServer::onNewConnection() { QTcpSocket *socket m_server-nextPendingConnection(); m_clients.append(socket); QString ip socket-peerAddress().toString(); m_logEdit-append(QString(新连接%1).arg(ip)); connect(socket, QTcpSocket::readyRead, this, ChatServer::onReadyRead); connect(socket, QTcpSocket::disconnected, this, ChatServer::onDisconnected); } void ChatServer::onReadyRead() { QTcpSocket *socket qobject_castQTcpSocket*(sender()); if (!socket) return; // 按行读取解决TCP粘包问题的简易方案 while (socket-canReadLine()) { QString line QString::fromUtf8(socket-readLine()).trimmed(); m_logEdit-append(收到 line); // 解析协议 if (line.startsWith(NAME:)) { QString name line.mid(5); m_names[socket] name; broadcast(QString(SYS:%1 加入了聊天室).arg(name)); } else if (line.startsWith(MSG:)) { // MSG:内容 QString content line.mid(4); QString name m_names.value(socket, 匿名); broadcast(QString(MSG:%1:%2).arg(name).arg(content)); } } } void ChatServer::onDisconnected() { QTcpSocket *socket qobject_castQTcpSocket*(sender()); if (!socket) return; QString name m_names.value(socket, 匿名); m_clients.removeAll(socket); m_names.remove(socket); socket-deleteLater(); m_logEdit-append(QString(%1 已断开).arg(name)); broadcast(QString(SYS:%1 离开了聊天室).arg(name)); } void ChatServer::broadcast(const QString msg, QTcpSocket *exclude) { QByteArray data (msg \n).toUtf8(); for (QTcpSocket *client : m_clients) { if (client ! exclude client-isOpen()) { client-write(data); } } }五、聊天室客户端实现5.1 客户端头文件chatclient.h#ifndef CHATCLIENT_H #define CHATCLIENT_H #include QWidget #include QTcpSocket #include QTextEdit #include QLineEdit #include QPushButton #include QLabel class ChatClient : public QWidget { Q_OBJECT public: explicit ChatClient(QWidget *parent nullptr); private slots: void onConnectClicked(); void onSendClicked(); void onConnected(); void onReadyRead(); void onDisconnected(); private: void appendMessage(const QString text); QTcpSocket *m_socket; QString m_username; QTextEdit *m_chatEdit; // 聊天记录 QLineEdit *m_nameEdit; // 用户名 QLineEdit *m_ipEdit; QLineEdit *m_portEdit; QLineEdit *m_msgEdit; // 消息输入 QPushButton *m_connectBtn; QPushButton *m_sendBtn; }; #endif // CHATCLIENT_H5.2 客户端实现chatclient.cpp#include chatclient.h #include QVBoxLayout #include QHBoxLayout ChatClient::ChatClient(QWidget *parent) : QWidget(parent) { setWindowTitle(TCP聊天室 - 客户端); resize(500, 450); // UI初始化 m_chatEdit new QTextEdit; m_chatEdit-setReadOnly(true); m_nameEdit new QLineEdit; m_nameEdit-setPlaceholderText(输入昵称); m_ipEdit new QLineEdit(127.0.0.1); m_portEdit new QLineEdit(8888); m_connectBtn new QPushButton(连接); m_msgEdit new QLineEdit; m_msgEdit-setPlaceholderText(输入消息回车发送); m_sendBtn new QPushButton(发送); m_sendBtn-setEnabled(false); // 顶部连接栏 auto *topLayout new QHBoxLayout; topLayout-addWidget(new QLabel(昵称:)); topLayout-addWidget(m_nameEdit); topLayout-addWidget(new QLabel(IP:)); topLayout-addWidget(m_ipEdit); topLayout-addWidget(new QLabel(端口:)); topLayout-addWidget(m_portEdit); topLayout-addWidget(m_connectBtn); // 底部发送栏 auto *bottomLayout new QHBoxLayout; bottomLayout-addWidget(m_msgEdit); bottomLayout-addWidget(m_sendBtn); auto *mainLayout new QVBoxLayout(this); mainLayout-addWidget(m_chatEdit); mainLayout-addLayout(topLayout); mainLayout-addLayout(bottomLayout); // Socket m_socket new QTcpSocket(this); connect(m_connectBtn, QPushButton::clicked, this, ChatClient::onConnectClicked); connect(m_sendBtn, QPushButton::clicked, this, ChatClient::onSendClicked); connect(m_msgEdit, QLineEdit::returnPressed, this, ChatClient::onSendClicked); connect(m_socket, QTcpSocket::connected, this, ChatClient::onConnected); connect(m_socket, QTcpSocket::readyRead, this, ChatClient::onReadyRead); connect(m_socket, QTcpSocket::disconnected, this, ChatClient::onDisconnected); } void ChatClient::onConnectClicked() { if (m_nameEdit-text().isEmpty()) { appendMessage(请先输入昵称); return; } m_username m_nameEdit-text(); QString ip m_ipEdit-text(); quint16 port m_portEdit-text().toUShort(); m_socket-connectToHost(ip, port); } void ChatClient::onConnected() { appendMessage(已连接服务器); m_connectBtn-setEnabled(false); m_sendBtn-setEnabled(true); m_nameEdit-setEnabled(false); // 发送用户名 m_socket-write(QString(NAME:%1\n).arg(m_username).toUtf8()); } void ChatClient::onReadyRead() { while (m_socket-canReadLine()) { QString line QString::fromUtf8(m_socket-readLine()).trimmed(); if (line.startsWith(SYS:)) { appendMessage(【系统】 line.mid(4)); } else if (line.startsWith(MSG:)) { // MSG:用户名:内容 int idx line.indexOf(:, 4); if (idx 0) { QString name line.mid(4, idx - 4); QString content line.mid(idx 1); appendMessage(QString(%1%2).arg(name).arg(content)); } } } } void ChatClient::onDisconnected() { appendMessage(与服务器断开连接); m_connectBtn-setEnabled(true); m_sendBtn-setEnabled(false); m_nameEdit-setEnabled(true); } void ChatClient::onSendClicked() { QString msg m_msgEdit-text(); if (msg.isEmpty()) return; m_socket-write(QString(MSG:%1\n).arg(msg).toUtf8()); m_msgEdit-clear(); } void ChatClient::appendMessage(const QString text) { m_chatEdit-append(text); }六、运行效果与扩展思路6.1 运行步骤启动 ChatServer服务端启动多个 ChatClient分别输入不同昵称后连接任意客户端发送消息所有客户端都能收到6.2 关键技术点回顾多客户端管理用QListQTcpSocket*保存所有连接消息广播服务端收到消息后转发给所有其他客户端TCP 粘包处理使用canReadLine()按行读取每条消息以\n结尾sender () 技巧通过sender()获取哪个 socket 触发了信号6.3 可以继续扩展的功能 私聊功能指定用户发送 在线用户列表 文件传输 心跳检测超时断开死连接 消息历史记录 表情包 / 图片发送 注册登录结合数据库七、总结本篇我们完成了两部分内容HTTP 编程部分QNetworkAccessManagerQNetworkRequestQNetworkReply三剑客GET、POST 请求的发送与响应处理文件下载与进度监听聊天室实战部分基于QTcpServer实现支持多客户端的服务端基于QTcpSocket实现聊天客户端自定义简单的文本通信协议消息广播与 TCP 粘包的简易处理至此Qt 网络编程的入门知识就全部讲完了。从 TCP/UDP 底层 Socket 到 HTTP 高层协议再到聊天室综合项目相信大家对 Qt 网络开发已经有了完整的认识。我是白玉同学Qt 零基础教程系列还在持续更新中。下一篇预告Qt 多线程编程QThread 线程池 互斥锁我们下篇见「Qt 零基础教程」系列代码基于 Qt 6.5 MinGW 环境。