qt 实现MVC Api控制器开发 web api接口-连载【5】-企业级系统开发实战连载系列 -技术栈(vue、element-ui、qt、c++、sqlite)

作者背景描述：

本人就职于外资IT企业，担任电商订单处理产品开发经理一职，领导过非常多次大小项目的开发工作，对电商平台订单处理流程非常熟悉。

公司专注鞋服行业相关软件开发和服务，公司规模100多人以上，在台北，广州，成都，上海，北京，国外等均有分公司。

为什么写此系列文章？

 本人在学校至工作到现在十余年时间，使用.net C# 开发语言，结合在公司实际开发，和市场的需求中，NET.开发的商业企业级系统遇到的缺点有如下：

1.程序首次加载慢，因为虚拟机编译的原因。

2.WINFORM界面开发不够炫丽，精美。

3.WINFORM界面设计人员难找。

4.程序可以被反编译。

5.安装包过大，部署麻烦，framework.

6.跨平台不够好。

结论：

结合近年来前端设计的走向，最终选择了qt+vue+element UI+sqlite(数据库根据需要情况选择)

qt负责接口和硬件处理

sqlite做数据存储

vue+element UI 实现前端。

结果预览

qt 实现MVC Api控制器开发 web api接口-连载【5】-企业级系统开发实战连载系列 -技术栈(vue、element-ui、qt、c++、sqlite)

使用微软mvc 的同学都知道编写一个web api 是非常方便的，本文通过使用qt 实现 Controller 和action 开发web api。

MVC 结构图如下：

下载QtWebApp（本文最后有下载方式），集成到项目中，这个库主要是实现http 协议，和 QT Web Api库支持。

对于单机版本，不需要用户安装iis 或 tomcat，简化了部署的难度。

 

QtWebApp目录结构如下：

把QtWebApp解压放到BitPos（上一章节创建的项目）目录下。

效果如下：

打开上一章节创建的解决方案：BitPos 。

在解决方案资源管理器，右键》添加》现有项目 ，如下：

把BitPos.vcxproj  添加现在项目 。

如下图：

选择QtWebApp ，右键》属性

 

在常规选项中修改sdk 版本，和平台工具集，配置类型，输出为静态库，如下：

在qt project settings 选项中，修改 qt installation 为我们上一节配置的qt版本，如下：

编译源码，这里能够一次编译成功，如下图：

点击BitPos项目，右键》添加》引用

为BitPos添加 包含目录，因为后面会用QtWebApp的头文件。

选择BitPos 》属性》vc++目录》包含目录》输入QtWebApp 如下图：

修改BitPos运行库为静态链接。

按上面的步骤，修改这2个项目的配置为release 模式，重复一次操作。否则release编译会报错。

接下来演示如何添加一个用户登入时密码验证的接口。

这个接口有2个参数，分别是user_code ,password

返回为json ,返回了用户代码和用户名称 ，分别是user_code,user_name

请求描述如下图：

接下来进行实操：添加API 控制器 和登入接口Login的方法

新增 src 目录，然后在目录下创建 controller

如下图：

选中controller 右键》添加》Add qt class

输入类名：ApiController

如下图：

点add 如下图：

点击next：如下图

把Base class 修改为HttpRequestHandler

 

最后贴出这2个类的源码分别是：

ApiController.h的代码如下：

#pragma once
//解决中文乱码问题。
#pragma execution_character_set("utf-8")
#include <httpserver/httprequesthandler.h>

using namespace stefanfrings;

//控制器 http://localhost:5050/vue-element-admin/api
class ApiController :
    public HttpRequestHandler
{

    Q_OBJECT 
public:
    Q_INVOKABLE ApiController(const ApiController & v)
    {
        *this = v;
    }
    Q_INVOKABLE ApiController &operator=(const ApiController &v)
    {
                return *this;  
    }
     
    Q_INVOKABLE ApiController()
    {

    }

    //action 登入接口。http://localhost:5050/vue-element-admin/api/login
    Q_INVOKABLE  void Login(HttpRequest & request, HttpResponse & response);
 
    Q_INVOKABLE void  ApiResult(const QString& msg, int code,HttpRequest & request, HttpResponse & response);
    /** Generates the response */
    Q_INVOKABLE void service(HttpRequest& request, HttpResponse& response);

    void Result(QString msg, int code, HttpResponse & response);

    ~ApiController();
};

ApiController.cpp的代码如下：

#include "ApiController.h"
#include <qjsondocument.h>
#include <qjsonobject.h>
#include <qcryptographichash.h>
#include <qlist.h>

 
 


 

Q_INVOKABLE void ApiController::Login(HttpRequest & request, HttpResponse & response)
{
    //request.

    //获取post请求的表单 。
    QMultiMap<QByteArray, QByteArray> forms = request.getParameterMap();
    //获取用户提交表单中的user_code 
    auto usercode = forms.value("user_code").trimmed();
    if (usercode.isEmpty())
    {
        Result("用户代码不能为空！", 1, response);
        return;
    }
    //获取用户提交表单中的password 
    auto password = forms.value("password").trimmed();
    if (password.isEmpty())
    {
        Result("密码不能为空！", 1, response);
        return;
    }
    //二次判断
    QByteArray hash = QCryptographicHash::hash(password, QCryptographicHash::Algorithm::Sha256).toBase64();

    //验证用户代码和密码。

    QJsonObject object
    {
        {"code", 0},
        {"msg", QJsonValue::Null}
    };
    QJsonObject user
    {
        {"user_code", "admin"},
        {"user_name", "admin"}
    };
    object.insert("user", user);

    QJsonDocument usermodel(object);

    //返回用户信息。
    QByteArray body = usermodel.toJson(QJsonDocument::JsonFormat::Indented);

    response.write(body, true);
}


Q_INVOKABLE void ApiController::service(HttpRequest & request, HttpResponse & response)
{ 
     
}

void ApiController::Result(QString msg, int code, HttpResponse & response)
{
    QJsonObject object
    {
        {"code", code},
        {"msg", QJsonValue(msg)}
    };
  

    QJsonDocument usermodel(object);

    QByteArray body = usermodel.toJson(QJsonDocument::JsonFormat::Indented);

    response.write(body, true);
}

Q_INVOKABLE void ApiController::ApiResult(const QString& msg,int code,HttpRequest & request, HttpResponse & response)
{ 
    Result(msg, code, response);
}



ApiController::~ApiController()
{
}

这2个文件的代码属于业务类的代码，都比较简单，实现了用户登入，用户名和密码的验证,上面已经有注释，这里就不进行重点讲解。

添加通用控制器处理类 requestmapper.cpp ，该类与业务无关。

主要实现接收请求，并查找控制器和接口方法，并进行转发请求，文件内容如下：

/**
  @file
  @author Stefan Frings
*/

#include <QCoreApplication>
#include "requestmapper.h"
#include "controller/ApiController.h"
#include <qmetaobject.h>

//静态变量
QMultiMap<QString, QString> RequestMapper :: Area;
template <typename T>
int RegisterController(const char *typeName,const QString& area)
{ 
    QByteArray tmp=typeName;  
    tmp = tmp.toLower();
    auto type= tmp.constData();
     
    int v=qRegisterMetaType<T>(type);
    if (!area.isEmpty())
    {
        RequestMapper::RegisterArea(area, type);
    }
    return v;
}
template <typename T>
int RegisterController(const QString& area)
{
    return RegisterController<T>(T::staticMetaObject.className(), area); 
}
RequestMapper::RequestMapper(QObject* parent)
    :HttpRequestHandler(parent)
{
    qDebug("RequestMapper: created");
    //注册Api控制器,域为vue-element-admin。访问格式为：
    //http://localhost:5050/{域}/{控制器}
    //例如 http://localhost:5050/vue-element-admin/api
    RegisterController<ApiController>("apicontroller", "vue-element-admin"); 
}


RequestMapper::~RequestMapper()
{
    qDebug("RequestMapper: deleted");
}

 void RequestMapper::RegisterArea(const QString &area, const QString& classname)
{
    Area.insertMulti(area, classname);
}

 //查找控制器，并调用接口方法。
void RequestMapper::service(HttpRequest& request, HttpResponse& response)
{
    QByteArray path=request.getPath().toLower();
    qDebug("RequestMapper: path=%s",path.data());
    fprintf(stderr, "request: %s
", path.data());
    //实现跨域访问，js 调用API 提供了支持。
    response.setHeader("Connection", "keep-alive");
    auto origin = request.getHeader("Origin");
    response.setHeader("Access-Control-Allow-Origin", origin);
    response.setHeader("Access-Control-Allow-Methods", "POST,GET,OPTIONS");
    response.setHeader("Access-Control-Allow-Headers", "X-PINGOTHER,Content-Type,x-token");
    response.setHeader("Access-Control-Max-Age", "86400");
    response.setHeader("Vary", "Accept-Encoding,Origin");
    response.setHeader("Keep-Alive", "timeout=2,max=99");
    //set api header 
    response.setHeader("Content-Type", "application/json; charset=utf-8");
    //response.setHeader("Access-Control-Allow-Origin", "*");   // also important , if not set , the html application wont run.
    if (request.getMethod() == "OPTIONS")
    {
        response.setStatus(200,"OK"); 
        qDebug("RequestMapper: finished request"); 
        // Clear the log buffer
     
        return;
    }
    else
    {

    }

    // For the following pathes, each request gets its own new instance of the related controller. 
        QByteArrayList items = path.split('/');
        QByteArray areaname;
        QByteArray controlname;
        QByteArray actionname;
        QByteArray a, b, c;

        for (int i = 0; i < items.length(); i++)
        {
            QByteArray first = items[i];
            if (first.isEmpty())
                continue;
            else
            {
                //get control and action of name.
                a = first;
                if(i+1<items.length())
                b = items[i + 1].toLower();

                if (i + 2 < items.length())
                    c = items[i + 2].toLower();
                break;
            }
        }
        QList<QString> controls;
        //判断是否是路由。
        if (Area.contains(a))
        {
            areaname = a;
            controlname = b;
            actionname = c;
            controls=Area.values(a);
        }
        else
        {
            controlname = a;
            actionname = b;
        }

        QString className = (controlname + "Controller").toLower();
        
        int id = QMetaType::type(className.toLatin1());
        HttpRequestHandler* result = NULL;
        //判断area
        if (id != QMetaType::UnknownType)
        { 
            if (controls.count() > 0 && !controls.contains(className))
            {
                 
                qDebug("RequestMapper: finished request"); 
                 
                return;
            }
        }

        if (id != QMetaType::UnknownType)
        {
            result = static_cast<HttpRequestHandler*>(QMetaType::create(id));
            const QMetaObject * theMetaObject = result->metaObject(); 
            int nMetathodCount = theMetaObject->methodCount();
            QByteArray method;
            //查找方法
            for (int nMetathodIndex = 0; nMetathodIndex < nMetathodCount; nMetathodIndex++)
            {
                QByteArray oneMethod = theMetaObject->method(nMetathodIndex).name(); 
                if (actionname.compare(oneMethod, Qt::CaseSensitivity::CaseInsensitive)==0)
                { 
                    method = oneMethod;
                    break;
                } 
            }
            if (!method.isEmpty())
            {
                auto token=request.getHeader("X - Token");
                //判断token是否是可用。
                auto v = QMetaObject::invokeMethod(result, method.data(), Qt::DirectConnection,
                    Q_ARG(HttpRequest &, request),
                    Q_ARG(HttpResponse &, response));
                if (!v)
                    qDebug() << method.data()<<" method  invokeMethod is error!";
             }
            else
            {
             //不存在的方法。
                 auto v = QMetaObject::invokeMethod(result, "ApiResult", Qt::DirectConnection,
                    Q_ARG(const QString&, actionname+" action not found !"),
                    Q_ARG(int, 1),
                    Q_ARG(HttpRequest &, request),
                    Q_ARG(HttpResponse &, response));
                if (!v)
                    qDebug() <<  " service method invokeMethod is error!"; 
            }
            delete result;
        }
        else
        {
            qDebug() << "UnknownType service method invokeMethod is error!";
        }

    qDebug("RequestMapper: finished request");
 
}

特别说明：当有新的控制器添加的时候，只需要在requestmapper.cpp

文件注册控制器即可。

在BitPos 项目  main.cpp 源码修改如下：

#include "BitPos.h"
#include <QtWidgets/QApplication>
#include <QWebEngineView>
#include <httpserver/httplistener.h>
#include <logging/filelogger.h>
#include <qdir.h>
#include "src/requestmapper.h"
using namespace stefanfrings;

/** Search the configuration file */
QString searchConfigFile()
{
    QString binDir = QCoreApplication::applicationDirPath();
    QString appName = QCoreApplication::applicationName();
    QString fileName(appName + ".ini");

    QStringList searchList;
    searchList.append(binDir);
    searchList.append(binDir + "/etc");
    searchList.append(binDir + "/../etc");
    searchList.append(binDir + "/../../etc"); // for development without shadow build
    searchList.append(binDir + "/../" + appName + "/etc"); // for development with shadow build
    searchList.append(binDir + "/../../" + appName + "/etc"); // for development with shadow build
    searchList.append(binDir + "/../../../" + appName + "/etc"); // for development with shadow build
    searchList.append(binDir + "/../../../../" + appName + "/etc"); // for development with shadow build
    searchList.append(binDir + "/../../../../../" + appName + "/etc"); // for development with shadow build
    searchList.append(QDir::rootPath() + "etc/opt");
    searchList.append(QDir::rootPath() + "etc");

    foreach(QString dir, searchList)
    {
        QFile file(dir + "/" + fileName);
        if (file.exists())
        {
            // found
            fileName = QDir(file.fileName()).canonicalPath();
            qDebug("Using config file %s", qPrintable(fileName));
            return fileName;
        }
    }

    // not found
    foreach(QString dir, searchList)
    {
        qWarning("%s/%s not found", qPrintable(dir), qPrintable(fileName));
    }
    qFatal("Cannot find config file %s", qPrintable(fileName));
}

int main(int argc, char* argv[])
{
    QApplication a(argc, argv); 
    // Find the configuration file
    QString configFileName = searchConfigFile();
     
    // Configure and start the TCP listener
    QSettings* listenerSettings = new QSettings(configFileName, QSettings::IniFormat, &a);
    listenerSettings->beginGroup("listener");
    new HttpListener(listenerSettings, new RequestMapper(&a), &a); 
    //浏览器
    QWebEngineView view;
    //设置访问地址
    view.setUrl(QUrl("http://localhost:5050/vue-element-admin/api/Login?user_code=333&password=3445"));
    //显示浏览器窗口。
    view.show(); 
    return a.exec();
}

文件目录如下图：

按f5运行，即可看到接口返回（也可以用浏览器看接口返回），如下图：

如果后面添加更多的模块的接口，只需要按模板添加控制器，按操作在控制器内添加方法即可。

 

至此，qt 接口开发演示完毕，下一节讲解如何使用postman 进行接口调试。

后面的文章主要与技术有关，索取源码，技术沟通，编译报错，请加QQ群561506606 加群无需验证。

点击链接加入群聊【企业级系统实战-qt vue.j】：https://jq.qq.com/?_wv=1027&k=CCmkgYYu