# C++网络请求(get,post,上传图片)与QML混合编程

关注

原创最新推荐文章于 2026-03-11 00:37:40 发布 2.5k 阅读 AI 写同款· GEO 优化 ›

Qt之QNetworkAccessManager 实现FTP文件上传/下载功能 Qt5移除了QFtp API，原因是其实现质量，QNetworkAccessManager可以用来提供ftpurl的上传下载操作；但是美中不足的是QNetworkAccessManager没有提供list()、cd()、remove()、mkdir()、rmdir()、rename() 和 rawCommand()等操作。先来看看操作结果： ... 阅读详情

C++网络请求(get,post,上传图片)与QML混合编程

文章主要分两个大模块：C++模块和qml模块；包含了Qt下网络请求QNetworkAccessManager，QNetworkRequest,QNetworkReply类库，以及响应机制：信号与槽，同时还兼容了QML与C++信息的传递以及数据类型的转换；本人刚学QT不到一个月且第一次写文章给大家分享，如有不好的地方欢迎大家留言给出宝贵的意见。好了，啰嗦了半天，接着就看正文吧：

get实现
post实现
上传图片
获取网络返回结果并传递结果给qml
qml与C++传递过程的数据转换
qml使用C++网络类

get实现

这里两个参数其实分别是手机号码和请求接口名
RequestBaseStr_REGIST为宏定义请求接口地址

void CCNetWorkRequest::CCRequest_GET(QString param, QString interfaStr)
{
   requestURL_Str = RequestBaseStr_REGIST;
   requestURL_Str.append(interfaStr);
   requestURL_Str.append(param);
   qDebug()<<"req_url:"<<requestURL_Str;
   //此处为返回给qml界面其所发出的请求信息（主要便于测试验证请求参数是否正确）
   emit reqParamsReturn(requestURL_Str);
   _netWorkRequest.setUrl(QUrl(requestURL_Str));
   //通过manager直接调用get方法将request传递过去就可以了！
   _netWorkManager->get(_netWorkRequest);
}

post实现

这里设计时第一个参数为qml传递过来的所需请求所有参数的json字符，第二个参数同上，接口名称

void CCNetWorkRequest::CCRequest_POST(QString param, QString interfaStr)
{
   requestURL_Str = RequestBaseStr_REGIST;
   requestURL_Str.append(interfaStr);
   //这里主要将qml传递过来的json转换为请求data
   transData = CCQmlStrToByteArray(param);
   //校验传递的参数是否正确
   if(transData.isNull())
   {
       emit reqErrorReturn("请求参数错误!");
       return;
   }
   _netWorkRequest.setUrl(QUrl(requestURL_Str));
   //设置请求头，必加
   _netWorkRequest.setRawHeader("Content-Type","application/json;charset=UTF-8");
   qDebug()<<"send data:"<<transData;
   //请求前将所发请求信息返回qml界面显示（只为测试）
   emit reqParamsReturn(requestURL_Str.append(transData));
   _netWorkManager->post(_netWorkRequest,transData);
}

上传图片

void CCNetWorkRequest::CCRequest_UPLOAD(QString param, QString interfaStr, QString cPath)
{
    requestURL_Str = RequestBaseStr_USER;
    requestURL_Str.append(interfaStr);
    //这里主要先将上传文件所带参数先转换为jsonobject为后面做准备
    QJsonObject paramObject = CCQstringToJsonobject(param);
    if(paramObject.isEmpty())
    {
        emit reqErrorReturn("图片请求参数错误!");
        return;
    }
//    qDebug()<<"to_object_res:"<<paramObject;
  //将文件通过base64转换为Qstring；
    QString imageStr = CCImageToBass64(cPath);
    qDebug()<<"ima:"<<imageStr;
    if(imageStr==NULL)
    {
        emit reqErrorReturn("文件路径错误!");
        return;
    }
    //将图片信息插入之前转换的jsonobject里面去完善整个请求参数
    paramObject.insert("fileData",imageStr);
    transData = QJsonDocument(paramObject).toJson();
    _netWorkRequest.setUrl(QUrl(requestURL_Str));
    _netWorkRequest.setRawHeader("Content-Type","application/json;charset=UTF-8");
//    qDebug()<<"send data:"<<transData;
    emit reqParamsReturn(requestURL_Str);
    _netWorkReply = _netWorkManager->post(_netWorkRequest,transData);
    connect(_netWorkReply,SIGNAL(error(QNetworkReply::NetworkError)),this,SLOT(CCRequest_UpLoadError(QNetworkReply::NetworkError)));
 //建立网络请求信号槽     
 connect(_netWorkReply,SIGNAL(uploadProgress(qint64,qint64)),this,SLOT(CCRequest_OnUploadProgress(qint64,qint64)));
}

获取网络返回结果并传递结果给qml

//构造函数初始化时实例化manager，并建立finished对应信号与槽
 _netWorkManager = new QNetworkAccessManager(this);
   connect(_netWorkManager,SIGNAL(finished(QNetworkReply*)),this,SLOT(CCRequest_Flished(QNetworkReply*)));

//接收网络请求返回完成结果，通过reply转换为string返回qml
void CCNetWorkRequest::CCRequest_Flished(QNetworkReply *rel)
{
    QString rel_str;
    if (rel->error())
    {
        rel_str = rel->errorString();
    }
    else
    {
        rel_str = rel->readAll();
    }
    //发送收到结果信号给qml （rel_str即为结果json值，具体的自己去转换）
    emit reqFlishedReturn(rel_str);

    qDebug()<<"flished rel:"<<rel_str;

}
//图片上传进度
void CCNetWorkRequest::CCRequest_OnUploadProgress(qint64 bytesSent, qint64 bytesTotal)
{
     qDebug()<<"recive sent:"<<bytesSent<<"\n recive total:"<<bytesTotal;
}
void CCNetWorkRequest::CCRequest_UpLoadError(QNetworkReply::NetworkError errorCode)
{
     qDebug()<<"recive error:"<<errorCode;
}

qml与C++传递过程的数据转换

将qml传递的参数转换为请求所需data，其他转换由于较多，这里就不写了，文章结尾会附上源码地址。

QByteArray CCNetWorkRequest::CCQmlStrToByteArray(QString qmlStr)
{
     qDebug()<<"qmlStr :"<<qmlStr;
    QJsonDocument jsonDocument = QJsonDocument::fromJson(qmlStr.toLocal8Bit().data());
    if(jsonDocument.isNull())
    {
        qDebug()<<"===>"<<qmlStr.toLocal8Bit().data();
        return NULL;
    }
    QByteArray byte_array = jsonDocument.toJson(QJsonDocument::Compact);

//    QByteArray bytes = qmlStr.toLatin1();   QString转Qbyte
    qDebug()<<"str to byte :"<<byte_array;
    return byte_array;
}

qml使用C++网络类

#include <QGuiApplication>
#include <QQmlApplicationEngine>
//导入C++类库
#include "CCNetWorkRequest.h"

int main(int argc, char *argv[])
{


    QGuiApplication app(argc, argv);
    //注册为qml可使用库
    qmlRegisterType<CCNetWorkRequest>("zm.Net.CCRequest",1,0,"CCRequest");
    QQmlApplicationEngine engine;
    engine.load(QUrl(QStringLiteral("qrc:/main.qml")));

    return app.exec();
}
具体qml界面和导入qml系统库一样导入你注册的C++类库
import zm.Net.CCRequest 1.0
-----------------------------------------
//实例化网络请求类
  CCRequest
    {
      id:ccRequest;

    }


    function getValidStr()
    {
    //设置请求验证码参数
        var num = Math.floor(Math.random()*10000000+10000000);

        var phone = "158"+num;
        console.log("ran:"+phone);
        var interfaStr = "register/getVerificationCode/"
        ccRequest.setReqNum(1);
        //直接调用c++类封装的get请求
        ccRequest.CCRequest_GET(phone,interfaStr);
    }