Node.js服务端和Qt C++客户端之HTTP POST和T

最近有个需求，需要将Qt/C++客户端的一些数据传输至Node.js服务端，有些需要一次性发送，另外一些由于更新频率高，需要建立Socket长链接。Google了一下，发现这方面的资料少得可怜，而自己在摸索的过程中也走了不少弯路，于是把这几天学到的东西整理了一下，以Demo的形式把HTTP POST和TCP Socket通信过程加以实现。

技术选型

客户端向服务端一次性发送一些数据，最直接的就是HTTP请求的POST方法了，而如果需要建立Socket长链接，则有很多选择。我首先尝试的是WebSocket，Node.js有一个很给力的ws模块，而Qt虽然有WebSockets这个C++类，但实际应用的话是要先斟酌一下的。这一块本来是个第三方的模块，后来被Qt给采纳了，所以有版本兼容性和稳定性的问题。还有Socket.IO，是一个面向实时web应用的库，主要使用WebSocket协议，最大的特点就是兼容性好，不支持WebSocket的时候自动回退到其他方法，但应用的话服务端和客户端都需要使用该框架，而且它对C++的支持并不是“原生”的。最后一个就是TCP Socket了，Node.js有用于底层网络通信的内置模块Net提供原生支持，Qt也通过QTcpSocket对其实现了很好的支持。综上，采用TCP Socket通信成了首选。

Demo

Qt/C++客户端

在Qt Creator中新建一个项目，在头文件中引用需要的系统头文件：

#include <QBuffer>
#include <QJsonObject>
#include <QJsonDocument>
#include <QJsonArray>
#include <QUrl>
#include <QNetworkRequest>
#include <QNetworkAccessManager>
#include <QNetworkReply>
#include <QTcpSocket>

添加成员变量：

private:
    QNetworkAccessManager* networkManager;
    QTcpSocket *textTcpSocket;
    QTcpSocket *imageTcpSocket;
    QByteArray imageData;

添加槽函数：

private slots:
    void receiveImageTcpSocketMessage();

在源文件的构造函数中，添加如下代码：

// 初始化
networkManager = new QNetworkAccessManager();
textTcpSocket = new QTcpSocket();
imageTcpSocket = new QTcpSocket();
connect(imageTcpSocket, SIGNAL(readyRead()), this, SLOT(receiveImageTcpSocketMessage()));

// 通过HTTP请求的POST方法发送一个对象
QJsonObject jsonObjPost;
jsonObjPost.insert("method", "post");
jsonObjPost.insert("message", "biebu.xin");
QByteArray postData = QJsonDocument(jsonObjPost).toJson(QJsonDocument::Compact);
QUrl postUrl("http://127.0.0.1:8080");
QNetworkRequest postRequest(postUrl);
postRequest.setHeader(QNetworkRequest::ContentTypeHeader, "application/json; charset=utf-8");
networkManager->post(postRequest, postData);

// 通过TCP Socket连接服务端并发送一个对象
textTcpSocket->abort();
textTcpSocket->connectToHost("127.0.0.1", 8081);
QJsonObject jsonObjSocket;
jsonObjSocket.insert("method", "socket");
jsonObjSocket.insert("message", "biebu.xin");
QByteArray textData = QJsonDocument(jsonObjSocket).toJson(QJsonDocument::Compact);
textTcpSocket->write(textData);

// 通过TCP Socket连接服务端并上传一张图片
imageTcpSocket->abort();
imageTcpSocket->connectToHost("127.0.0.1", 8082);
QImage image;
image.load("demo.jpg", "JPG");
QBuffer buffer(&imageData);
image.save(&buffer, "JPG");
imageTcpSocket->write(QByteArray::number(imageData.size()));

定义receiveImageTcpSocketMessage()函数：

QByteArray message = imageTcpSocket->readAll();
if (message.toInt()) {
    imageTcpSocket->write(imageData);
    imageData.resize(0);
}

发送图片的时候，如果直接把图片数据发过去，有可能会出现需要分多次传输导致服务端单次接收数据不完整的情况。所以，一种稳妥的做法是，先把图片大小发过去，然后再发送图片数据。

Node.js服务端

新建一个js文件，加载内置模块：

const http = require('http');
const net = require('net');
const fs = require('fs');

创建HTTP服务器：

http.createServer((req, res) => {
    let source = "";

    req.on('data', function(data) {
        source += data;
    });

    req.on('end', function() {
        console.log(`Post data: ${source.toString()}`);
    });
}).listen(8080, '127.0.0.1', () => {
    console.log('Http server listening on port 8080 at host 127.0.0.1');
});

创建用于接收文本的TCP Socket服务器：

net.createServer((socket) => {
    console.log('textClient connected');

    socket.on('data', (data) => {
        console.log(`Socket textData: ${data.toString()}`);
    });

    socket.on('end', () => {
        console.log('textClient disconnected');
    });
}).listen(8081, () => {
    console.log('Socket server for text started on port 8081');
});

创建用于接收图片的TCP Socket服务器：

net.createServer((socket) => {
    console.log('imageClient connected');

    let imageSize = 0;
    let imageBufferArray = [];

    socket.on('data', (data) => {
        if (imageSize) {
            // 接收和拼接数据，当数据长度不够时，下一次继续
            imageBufferArray.push(data);
            let imageData = Buffer.concat(imageBufferArray);
            if (imageData.byteLength >= imageSize) {
                // 数据完整，写入文件
                fs.writeFile(`demo.jpg`, imageData, (err) => {
                    console.log('Save socket image success');
                    imageSize = 0;
                    imageBufferArray = [];
                });
            }
        } else {
            imageSize = parseInt(data.toString());
            socket.write('1');
        }
    });

    socket.on('end', () => {
        console.log('imageClient disconnected');
    });
}).listen(8082, () => {
    console.log('Socket server for image started on port 8082');
});

效果

服务端先启动，客户端运行后，服务端的终端中会打印运行结果：

Socket server for text started on port 8081
Socket server for image started on port 8082
Http server listening on port 8080 at host 127.0.0.1
textClient connected
imageClient connected
Socket textData: {"message":"biebu.xin","method":"socket"}
Post data: {"message":"biebu.xin","method":"post"}
Save socket image success

可以看出，Qt客户端发送的数据这里都是采用QByteArray类型的，而Node.js接收的时候，不管是http模块，还是net模块，其data事件的参数都是一个Buffer，fs写入文件的图片数据，也是Buffer对象。注意到这点，就可以根据实际需求灵活编程了。

需要强调的是，这是个最小Demo，错误处理的部分都省略了，而在实际编程的过程中一定要考虑周全哦～

个人技术博客 biebu.xin，原文链接——Node.js服务端和Qt C++客户端之HTTP POST和TCP Socket通信