qt 资源文件：Qt音开发46-传输UDP版
qt 资源文件：Qt音开发46-传输UDP版5. 服务端返回的数据中的uuid是对应接收到的消息的uuid。4. 下面协议部分省略了头部字节。1. 采用TCP长连接和UDP协议可选，默认通信端口6000。2. 采用自定义的xml通信协议。3. 所有传输加20个字节头部：IIMAGE:0000000000000，IIMAGE:为固定头部，后面接13个字节的 内容的长度（含20个头部长度） 字符串。
## 一、前言上篇文章写道采用的TCP传输视频，优缺点很明显，优点就是不丢包，缺点就是速度慢，后面换成UDP通信，速度快了很多，少了3次握手，而且在局域网中基本上不丢包，就算偶尔丢包，对于一秒钟25-30张图片来说，偶尔一张图片丢失，基本上看不出来，所以忽略，但是放到广域网或者互联网比如阿里云平台上测试的话，UDP惨不忍睹，丢包蛮多的，毕竟包数据特别多。
Qt的网络通信类，我们平时常用的就是三个：QTcpSocket客户端类、QTcpServer服务端类、QUdpSocket通信类，为啥没有QUdpServer类？其实UDP是无连接的通信，占用资源很小，他既可以是客户端也可以是服务端，如果要作为服务端则指定端口调用bind方法即可。本程序同时支持了TCP模式和UDP模式，实际测试下来，还是建议使用TCP模式，UDP模式由于无连接在短时间内发送大量的数据包发现会丢包，而且包的大小有限制，是65507字节，大约64K，所以UDP模式下实时传输的图片分辨率不能太大，实测640*480的视频文件还是挺好的，720P基本上有点惨，丢包好多，可能后期还需要从协议上改进处理。
本程序和协议约定的图片采用base64编码传输，接收到以后将base64字符串解码出来生成图片，QByteArray内置类toBase64方法转成base64编码的字符串，QByteArray::fromBase64方法将base64字符串还原成数据。在经过多次的实验以后统计的数据显示，编码解码的速度还可以，其中720P图片编码25ms-30ms、解码15ms-20ms，1080P图片编码35ms-40ms、解码25ms-30ms。总体上来说一秒钟传输25-30张图片和解码25-30张图片，还是没有什么问题的，只是走的CPU编码解码，如果开的通道数比较多的话，还是很耗CPU的，但是应付一些简单的应用场景还是如鱼得水毫无压力。
通信协议：
1. 采用TCP长连接和UDP协议可选，默认通信端口6000。
2. 采用自定义的xml通信协议。
3. 所有传输加20个字节头部：IIMAGE:0000000000000，IIMAGE:为固定头部，后面接13个字节的 内容的长度（含20个头部长度） 字符串。
4. 下面协议部分省略了头部字节。
5. 服务端返回的数据中的uuid是对应接收到的消息的uuid。
6. 服务端每次返回的时候都带了当前时间，可用于客户端校时。
```xml
客户端发送心跳
<?xml version="1.0" encoding="UTF-8"?>
<ImageClient Uuid="8AF12208-0356-434C-8A49-69A2170D9B5A" Flag="SHJC00000001">
<ClientHeart/>
</ImageClient>
服务器收到心跳返回
<?xml version="1.0" encoding="UTF-8"?>
<ImageServer Uuid="8AF12208-0356-434C-8A49-69A2170D9B5A" NowTime="2019-12-05 16:37:47">
Ok
</ImageServer>
客户端发送图片
<?xml version="1.0" encoding="UTF-8"?>
<ImageClient Uuid="66BCB44A-B567-48ED-8889-36B8FA6C4363" Flag="SHJC00000001">
<ClientImage>图片base64编码后的字符串/9j/4AAQSkZJRgABAQEAYABgAAD/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8UHRofHh0aHBwgJC4nICIsIxwcKDcpLDAxNDQ0Hyc5PTgyPC4zNDL/2wBDAQkJCQwLDBgNDRgyIRwhMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjL/wAARCAJAAtADASIAAhEBAxEB/8QAHwAAAQUBAQEB...nvWsQRlXA61mTjmtWcdazLgcmrQ0U2plSMKjpDE7UtFFAwxRRRQAUuKWigQlFFFLcD//2Q==</ClientImage>
</ImageClient>
服务端收到图片返回
<?xml version="1.0" encoding="UTF-8"?>
<ImageServer Uuid="66BCB44A-B567-48ED-8889-36B8FA6C4363" NowTime="2019-12-05 16:38:47">
Ack
</ImageServer>
```
## 二、功能特点1. 多线程收发图片数据和解析图片数据，不卡主界面。
2. 同时支持TCP和UDP两种模式，封装了TCP模式以及UDP模式的客户端类和服务端类。
3. 图片传输客户端同时支持发送到多个服务端，可以作为一个教师机同屏发送到多个学生机的应用场景。
4. 同时支持多个客户端同时往服务端发送图片，服务端每个连接都会自动开辟线程收发和解析图片数据。
5. 自定义label控件信号槽机制绘制图片，不卡主界面。
6. 自带心跳机制判断离线，自动重连服务器，可设置超时时间。
7. 每个消息都有唯一的消息标识uuid，服务端收到以后会返回对应的uuid消息表示收到，客户端可以根据此返回消息判断服务端解析成功，不用再发，这样可以确保发出去的数据服务器接收到了并解析成功。
8. 每个消息都有唯一的图片标识flag，相当于ID号，根据此标识判断需要解析显示到哪个界面。
9. 图片以base64的字符串格式发送，接收端接收到base64字符串的图片数据解码后重新生成图片。
10. 所有数据的收发都有信号发出去，方便输出查看。
11. 都提供单例类，方便只有一个的时候直接使用无需new。
12. 采用自定义的xml协议，可以自由拓展其他属性字段比如带上图片内容等。
## 三、效果图
1. 国内站点：[https://gitee.com/feiyangqingyun/QWidgetDemo](https://gitee.com/feiyangqingyun/QWidgetDemo)
2. 国际站点：[https://github.com/feiyangqingyun/QWidgetDemo](https://github.com/feiyangqingyun/QWidgetDemo)
3. 个人主页：[https://blog.csdn.net/feiyangqingyun](https://blog.csdn.net/feiyangqingyun)
4. 知乎主页：[https://www.zhihu.com/people/feiyangqingyun/](https://www.zhihu.com/people/feiyangqingyun/)
5. 体验地址：[https://blog.csdn.net/feiyangqingyun/article/details/97565652](https://blog.csdn.net/feiyangqingyun/article/details/97565652)
## 五、核心代码#include "udpimageclient.h"
#include "devicefun.h"
QScopedPointer<UdpImageClient> UdpImageClient::self;
UdpImageClient *UdpImageClient::Instance()
{
if (self.isNull()) {
static QMutex mutex;
QMutexLocker locker(&mutex);
if (self.isNull()) {
self.reset(new UdpImageClient);
}
}
return self.data();
}
UdpImageClient::UdpImageClient(QObject *parent) : QThread(parent)
{
//如果是外网请自行调整这个值的大小 外网需要调小
packageSize = 10000;
flag = "SHJC00000001";
serverIP = "127.0.0.1";
serverPort = 6000;
stopped = false;
//UDP通信对象
udpSocket = new QUdpSocket(this);
connect(udpSocket SIGNAL(readyRead()) this SLOT(readData()));
//定时器解析收到的数据 可以自行调整间隔
timerData = new QTimer(this);
connect(timerData SIGNAL(timeout()) this SLOT(checkData()));
timerData->setInterval(100);
//绑定信号启动后启动定时器
connect(this SIGNAL(started()) this SLOT(started()));
//绑定发送数据信号槽
connect(this SIGNAL(readyWrite(QString)) this SLOT(sendImage(QString)));
}
UdpImageClient::~UdpImageClient()
{
this->stop();
}
void UdpImageClient::run()
{
while (!stopped) {
//这里采用线程去处理 其实完全可以用定时器搞定 毕竟tcp的write是异步的 操作系统自动调度
//为了后期的拓展性 比如需要判断是否发送成功之类的 需要同步处理 所以改成的线程去处理
//图片数据转成base64编码的数据也需要时间的 主要的耗时在转码
//取出数据发送 这里需要加锁 避免正在插入数据
if (images.count() > 0) {
QMutexLocker locker(&mutexImage);
QImage image = images.takeFirst();
QString imageData = DeviceFun::getImageData(image);
emit readyWrite(imageData);
}
//要稍微休息下 否则CPU会被一直占用
msleep(1);
}
stopped = false;
}
void UdpImageClient::readData()
{
QHostAddress host;
quint16 port;
QByteArray data;
while (udpSocket->hasPendingDatagrams()) {
data.resize(udpSocket->pendingDatagramSize());
udpSocket->readDatagram(data.data() data.size() &host &port);
//接收的数据存入buffer需要加锁
QMutexLocker locker(&mutexData);
buffer.append(data);
emit receiveData(data);
}
}
void UdpImageClient::checkData()
{
if (buffer.length() == 0) {
return;
}
//取出数据处理需要加锁 防止此时正在插入数据
QMutexLocker locker(&mutexData);
QDomDocument dom;
if (!DeviceFun::getReceiveXmlData(buffer dom "IIMAGE:" 11 true)) {
return;
}
//逐个取出节点判断数据
QDomElement element = dom.documentElement();
if (element.tagName() == "ImageServer") {
QString uuid = element.attribute("Uuid");
QDomNode childNode = element.firstChild();
QString name = childNode.nodeName();
QString value = element.text();
//qDebug() << uuid << name << value;
//这里可以根据收到的数据自行增加自己的处理
}
}
void UdpImageClient::started()
{
if (!timerData->isActive()) {
timerData->start();
}
}
void UdpImageClient::stop()
{
buffer.clear();
images.clear();
stopped = true;
this->wait();
udpSocket->disconnectFromHost();
if (timerData->isActive()) {
timerData->stop();
}
}
void UdpImageClient::setPackageSize(int packageSize)
{
if (packageSize <= 65507) {
this->packageSize = packageSize;
}
}
void UdpImageClient::setFlag(const QString &flag)
{
this->flag = flag;
}
void UdpImageClient::setServerIP(const QString &serverIP)
{
this->serverIP = serverIP;
}
void UdpImageClient::setServerPort(int serverPort)
{
this->serverPort = serverPort;
}
void UdpImageClient::writeData(const QString &body)
{
//构建xml字符串
QStringList list;
list.append(QString("<ImageClient Uuid=\"%1\" Flag=\"%2\">").arg(DeviceFun::getUuid()).arg(flag));
list.append(body);
list.append("</ImageClient>");
//调用通用方法根据协议组成完整数据
QString data = DeviceFun::getSendXmlData(list.join("") "IIMAGE:");
QByteArray buffer = data.toUtf8();
//udp最大只能发送65507字节的数据=64K 超过的话都会发送失败
//所以这里需要手动分包 外网的话包还要小一点
if (packageSize == 65500) {
udpSocket->writeDatagram(buffer QHostAddress(serverIP) serverPort);
} else {
int len = buffer.length();
int count = len / packageSize 1;
for (int i = 0; i < count; i ) {
QByteArray temp = buffer.mid(i * packageSize packageSize);
udpSocket->writeDatagram(temp QHostAddress(serverIP) serverPort);
}
}
emit sendData(buffer);
}
void UdpImageClient::sendImage(const QString &body)
{
writeData(QString("<ClientImage>%1</ClientImage>").arg(body));
}
void UdpImageClient::append(const QImage &image)
{
//这里需要加锁 避免正在取出数据
QMutexLocker locker(&mutexImage);
//限制队列中最大消息数 避免离线的时候疯狂插入
if (this->isRunning() && images.count() < 10) {
images << image;
}
}
void UdpImageClient::clear()
{
QMutexLocker locker(&mutexImage);
images.clear();
}
