首页 > 数据库 >C ++ 也可以搭建Web?高性能的 C++ Web 开发框架 CPPCMS + MySQL 实现快速入门案例

C ++ 也可以搭建Web?高性能的 C++ Web 开发框架 CPPCMS + MySQL 实现快速入门案例

时间:2024-08-12 22:23:43浏览次数:16  
标签:std Web CPPCMS form ++ blog color group include

什么是CPPCMS?

CppCMS 是一个高性能的 C++ Web 开发框架,专为构建快速、动态的网页应用而设计,特别适合高并发和低延迟的场景。其设计理念类似于 Python 的 Django 或 Ruby on Rails,但针对 C++ 提供了更细粒度的控制和更高效的性能。

主要特点和优点

1. 高性能与并发处理

​ CppCMS 是为高性能需求而设计的。它支持大规模并发处理,能够在高负载下高效运行,特别适用于需要处理大量请求的场景。由于使用 C++ 编写,CppCMS 可以利用操作系统的原生线程和异步 I/O 操作,提供极低的延迟和高吞吐量。

2. 灵活的架构

​ 框架的设计允许开发者完全控制应用程序的各个方面,包括 URL 路由、会话管理、缓存机制、和表单处理。你可以根据具体需求自定义应用程序的各个模块,从而适应各种特殊的应用场景。

3. 集成与兼容性

​ CppCMS 能轻松与其他 C++ 库和系统组件集成,充分利用现有的 C++ 生态系统。它支持 SQLite、MySQL、PostgreSQL 等多种数据库,并提供了与 C++ 标准库的无缝集成。

4. 模板系统

​ CppCMS 提供了一个高效的模板系统,支持静态和动态内容的渲染。开发者可以在模板中定义页面布局和内容,通过与后端代码的结合,实现动态网页的生成。

5. 国际化和本地化

​ 框架内置了对国际化(i18n)和本地化(l10n)的支持,适合开发多语言应用。开发者可以轻松管理和应用不同语言的文本和格式设置。

适用场景

  • 高流量网站:如社交媒体平台、新闻门户网站等,需要处理大量用户请求。
  • 实时数据处理:如在线游戏服务器、实时消息传递系统,要求极低的响应时间。
  • 复杂后台服务:如需要提供高性能 RESTful API 或者后台服务的系统。

简单入门案例

1. 项目结构

在这里插入图片描述

2. CMakeLists.txt

cmake_minimum_required(VERSION 3.10)
project(c_web)

set(CMAKE_CXX_STANDARD 17)

# 指定源文件
set(SOURCE_FILES src/main.cpp src/blog.cpp)

# 手动设置 CppCMS 和 Booster 的头文件路径
include_directories(/usr/local/include)

# 手动设置库文件路径
link_directories(/usr/local/lib)

# 添加可执行文件
add_executable(c_web ${SOURCE_FILES})

# 查找数据库
include_directories(/usr/include/cppconn /usr/include/mysql)
link_directories(/usr/lib/x86_64-linux-gnu)

# 链接 CppCMS 和 Booster 库 MySQL
target_link_libraries(c_web cppcms booster mysqlcppconn)

说明:自行安装所需要的依赖库和定位库的位置,以下是获取手动安装的cppcms,其他通过apt安装的自行查找库依赖和位置。

获取编译器标志

pkg-config --cflags cppcms

获取链接器标志

pkg-config --libs cppcms

3. config.json

{
    "service": {
        "api": "http",
        "port": 8080,
        "ip": "0.0.0.0"
    },
    "http": {
        "script": "",
        "static": "/static"
    }
}

4. main.cpp

#include <cppcms/service.h>
#include <cppcms/applications_pool.h>
#include <cppcms/http_response.h>
#include <cppcms/url_dispatcher.h>
#include "blog.h"
#include <cppcms/json.h>

int main(int argc, char* argv[]) {
    try {
        cppcms::service app(argc, argv);
       
        // 创建博客应用的实例并将其添加到应用程序池中
        app.applications_pool().mount(cppcms::applications_factory<blog>());
        
        // 运行服务
        app.run();
    }
    catch (std::exception const &e) {
        std::cerr << "Error: " << e.what() << std::endl;
    }
}

5. blog.h

#ifndef BLOG_H
#define BLOG_H
#include <cppcms/application.h>
#include <cppcms/http_response.h>
#include <cppcms/http_request.h>
#include <cppcms/url_dispatcher.h>
#include <cppcms/url_mapper.h>
#include <mysql_driver.h>
#include <mysql_connection.h>
#include <cppconn/statement.h>
#include <cppconn/prepared_statement.h>
class blog : public cppcms::application {
public:
    blog(cppcms::service &srv);
    void index();
	void show_register();
	void handle_register();
	void show_login();
	void handle_login();
	std::unique_ptr<sql::Connection> connectToDatabase();
	void createDatabase(sql::Connection* con, const std::string& dbName);
	void createTable(sql::Connection* con);
private:
    void serve_html(const std::string &path);
};
#endif

6. blog.cpp

#include "blog.h"
#include <fstream>

blog::blog(cppcms::service &srv) : cppcms::application(srv) {
    dispatcher().map("GET", "/", &blog::index, this);
    dispatcher().map("GET", "/register", &blog::show_register, this);
    dispatcher().map("POST", "/register", &blog::handle_register, this);
    dispatcher().map("GET", "/login", &blog::show_login, this);
    dispatcher().map("POST", "/login", &blog::handle_login, this);
}

std::unique_ptr<sql::Connection> blog::connectToDatabase() {
    sql::mysql::MySQL_Driver* driver = sql::mysql::get_mysql_driver_instance();
    std::unique_ptr<sql::Connection> con(driver->connect("tcp://127.0.0.1:3306", "root", "123456"));
    con->setSchema("blog");
    return con;
}

void blog::index() {
    serve_html("./views/index.html");
}

void blog::show_register() {
    serve_html("./views/register.html");
}

void blog::createDatabase(sql::Connection* con, const std::string& dbName) {
    std::unique_ptr<sql::Statement> stmt(con->createStatement());
    stmt->execute("CREATE DATABASE IF NOT EXISTS " + dbName);
    stmt->execute("USE " + dbName);
}

void blog::createTable(sql::Connection* con) {
    std::unique_ptr<sql::Statement> stmt(con->createStatement());
    stmt->execute("CREATE TABLE IF NOT EXISTS users ("
                  "id INT AUTO_INCREMENT PRIMARY KEY,"
                  "username VARCHAR(255) NOT NULL,"
                  "password VARCHAR(255) NOT NULL,"
                  "email VARCHAR(255) NOT NULL"
                  ")");
}

void blog::handle_register() {
    std::string username = request().post("username");
    std::string password = request().post("password");
    std::string email = request().post("email");

    try {
        auto con = connectToDatabase();
        createDatabase(con.get(), "blog");
        createTable(con.get());

        std::unique_ptr<sql::PreparedStatement> pstmt(con->prepareStatement("INSERT INTO users(username, password, email) VALUES (?, ?, ?)"));
        pstmt->setString(1, username);
        pstmt->setString(2, password);
        pstmt->setString(3, email);
        pstmt->executeUpdate();

        response().out() << "<p>User registered successfully: " << username << "</p>"
                         << "<p>Registered password: " << password << "</p>"
                         << "<p>Registered email: " << email << "</p>";
    } catch (sql::SQLException &e) {
        response().out() << "<p>Error registering user: " << e.what() << "</p>";
    }
}

void blog::show_login() {
    serve_html("./views/login.html");
}

void blog::handle_login() {
    std::string username = request().post("username");
    std::string password = request().post("password");

    try {
        auto con = connectToDatabase();

        std::unique_ptr<sql::PreparedStatement> pstmt(con->prepareStatement("SELECT password FROM users WHERE username = ?"));
        pstmt->setString(1, username);
        std::unique_ptr<sql::ResultSet> res(pstmt->executeQuery());

        if (res->next()) {
            std::string stored_password = res->getString("password");
            if (stored_password == password) {
                response().out() << "<p>Logged in successfully as: " << username << "</p>";
            } else {
                response().out() << "<p>Invalid password.</p>";
            }
        } else {
            response().out() << "<p>User not found.</p>";
        }
    } catch (sql::SQLException &e) {
        response().out() << "<p>Error: " << e.what() << "</p>";
    }
}

void blog::serve_html(const std::string &path) {
    std::ifstream file(path);
    if (file.is_open()) {
        std::string content((std::istreambuf_iterator<char>(file)), std::istreambuf_iterator<char>());
        response().out() << content;
    } else {
        response().status(404);
        response().out() << "Page not found";
    }
}

7. login.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Login</title>
    <!-- 引入 FontAwesome 图标库 -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
    <style>
        /* 全局样式 */
        body {
            font-family: 'Helvetica Neue', Arial, sans-serif;
            background-color: #fdfdfd;
            color: #333;
            margin: 0;
            padding: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            background-image: url('https://source.unsplash.com/1600x900/?nature,water');
            background-size: cover;
            background-position: center;
        }

        /* 表单容器 */
        .form-container {
            background-color: rgba(255, 255, 255, 0.9);
            padding: 30px 40px;
            border-radius: 10px;
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
            max-width: 400px;
            width: 100%;
            box-sizing: border-box;
            backdrop-filter: blur(10px);
        }

        /* 标题 */
        .form-container h1 {
            text-align: center;
            margin-bottom: 20px;
            font-size: 26px;
            color: #555;
            font-weight: 300;
        }

        /* 表单项 */
        .form-group {
            position: relative;
            margin-bottom: 20px; /* 调整了间距,减小输入框间的距离 */
        }

        .form-group input {
            width: 100%;
            padding: 12px 40px 12px 40px; /* 调整了内边距,确保图标和标签都能正确显示 */
            border: 1px solid #ddd;
            border-radius: 5px;
            box-sizing: border-box;
            font-size: 16px;
            background-color: #fdfdfd;
            transition: border-color 0.3s ease;
        }

        .form-group input:focus {
            border-color: #888;
            outline: none;
        }

        .form-group label {
            position: absolute;
            left: 40px;
            top: 50%;
            transform: translateY(-50%);
            color: #aaa;
            font-size: 16px;
            transition: all 0.3s ease;
            pointer-events: none;
        }

        .form-group input:focus + label,
        .form-group input:not(:placeholder-shown) + label {
            top: -10px;
            left: 40px;
            font-size: 12px;
            color: #555;
            background-color: white;
            padding: 0 5px;
        }

        .form-group .fa {
            position: absolute;
            left: 15px; /* 图标距离输入框左侧的距离 */
            top: 50%;
            transform: translateY(-50%);
            color: #888;
            font-size: 18px; /* 调整了图标大小 */
        }

        /* 提交按钮 */
        .form-group button {
            width: 100%;
            padding: 12px 15px;
            background-color: #333;
            border: none;
            border-radius: 5px;
            color: white;
            font-size: 16px;
            cursor: pointer;
            transition: background-color 0.3s ease;
            font-weight: 500;
        }

        .form-group button:hover {
            background-color: #555;
        }

        /* 响应式设计 */
        @media (max-width: 480px) {
            .form-container {
                padding: 20px 30px;
            }

            .form-container h1 {
                font-size: 22px;
            }

            .form-group input {
                padding: 10px 30px 10px 30px; /* 在小屏幕上调整内边距,确保输入框不拥挤 */
            }

            .form-group .fa {
                left: 10px; /* 在小屏幕上调整图标位置 */
            }

            .form-group label {
                left: 35px; /* 在小屏幕上调整标签位置 */
            }
        }
    </style>
</head>
<body>
    <div class="form-container">
        <h1>Login</h1>
        <form method="post" action="/login">
            <div class="form-group">
                <i class="fa fa-user"></i>
                <input type="text" id="username" name="username" placeholder=" " required>
                <label for="username">Username</label>
            </div>
            <div class="form-group">
                <i class="fa fa-lock"></i>
                <input type="password" id="password" name="password" placeholder=" " required>
                <label for="password">Password</label>
            </div>
            <div class="form-group">
                <button type="submit">Login</button>
            </div>
        </form>
		<div class="toggle-link">
            <a href="/register">Don't have an account? Register</a>
        </div>
    </div>
</body>
</html>

8. register.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Register</title>
    <!-- 引入 FontAwesome 图标库 -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
    <style>
        /* 全局样式 */
        body {
            font-family: 'Helvetica Neue', Arial, sans-serif;
            background-color: #fdfdfd;
            color: #333;
            margin: 0;
            padding: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            background-image: url('https://source.unsplash.com/1600x900/?nature,water');
            background-size: cover;
        }

        /* 表单容器 */
        .form-container {
            background-color: rgba(255, 255, 255, 0.9);
            padding: 20px 40px;
            border-radius: 10px;
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
            max-width: 400px;
            width: 100%;
            box-sizing: border-box;
            backdrop-filter: blur(10px);
        }

        /* 标题 */
        .form-container h1 {
            text-align: center;
            margin-bottom: 20px;
            font-size: 26px;
            color: #555;
            font-weight: 300;
        }

        /* 表单项 */
        .form-group {
            position: relative;
            margin-bottom: 25px;
        }

        .form-group input {
            width: 100%;
            padding: 12px 15px 12px 40px;
            border: 1px solid #ddd;
            border-radius: 5px;
            box-sizing: border-box;
            font-size: 16px;
            background-color: #fdfdfd;
            transition: border-color 0.3s ease;
        }

        .form-group input:focus {
            border-color: #888;
            outline: none;
        }

        .form-group label {
            position: absolute;
            left: 40px;
            top: 50%;
            transform: translateY(-50%);
            color: #aaa;
            font-size: 16px;
            transition: all 0.3s ease;
            pointer-events: none;
        }

        .form-group input:focus + label,
        .form-group input:not(:placeholder-shown) + label {
            top: -10px;
            left: 40px;
            font-size: 12px;
            color: #555;
            background-color: white;
            padding: 0 5px;
        }

        .form-group .fa {
            position: absolute;
            left: 10px;
            top: 50%;
            transform: translateY(-50%);
            color: #888;
        }

        /* 提交按钮 */
        .form-group button {
            width: 100%;
            padding: 12px 15px;
            background-color: #333;
            border: none;
            border-radius: 5px;
            color: white;
            font-size: 16px;
            cursor: pointer;
            transition: background-color 0.3s ease;
            font-weight: 500;
        }

        .form-group button:hover {
            background-color: #555;
        }

        /* 响应式设计 */
        @media (max-width: 480px) {
            .form-container {
                padding: 15px 20px;
            }

            .form-container h1 {
                font-size: 22px;
            }
        }
    </style>
</head>
<body>
    <div class="form-container">
        <h1>Register</h1>
        <form method="post" action="/register">
            <div class="form-group">
                <i class="fa fa-user"></i>
                <input type="text" id="username" name="username" placeholder=" " required>
                <label for="username">Username</label>
            </div>
            <div class="form-group">
                <i class="fa fa-envelope"></i>
                <input type="email" id="email" name="email" placeholder=" " required>
                <label for="email">Email</label>
            </div>
            <div class="form-group">
                <i class="fa fa-lock"></i>
                <input type="password" id="password" name="password" placeholder=" " required>
                <label for="password">Password</label>
            </div>
            <div class="form-group">
                <button type="submit">Register</button>
            </div>
        </form>
		<div class="toggle-link">
            <a href="/login">Already have an account? Login</a>
        </div>
    </div>
</body>
</html>

9. 验证测试

9.1 启动命令

cmake ./
make
./c_web -c ./config.json

在这里插入图片描述

说明:光标闪烁即启动成功了。

9.2 注册测试

在这里插入图片描述

9.3 注册结果

在这里插入图片描述

9.4 登录测试

在这里插入图片描述

9.5 登录结果

在这里插入图片描述

10. 总结

​ 基于·Ubutun系统,通过 CppCMS + MySQL 实现简单的数据库连接和测试工作,即注册和登录操作完成快速入门。

标签:std,Web,CPPCMS,form,++,blog,color,group,include
From: https://blog.csdn.net/qq_71387716/article/details/141143777

相关文章

  • Spring MVC原理:掌握Web开发的核心技术
    引言在现代Web开发领域,Spring框架无疑占据着举足轻重的地位。其中,SpringMVC作为Spring框架中的一个重要组成部分,为构建响应用户请求、处理业务逻辑以及渲染视图的Web应用程序提供了强大的支持。本文将深入探讨SpringMVC的工作原理及其在实际项目中的应用,无论你是刚刚接触......
  • C++类和对象(类的定义)
    目录一·类的定义1.1类的定义格式1.2访问限定符(public、private、protected)1.3类域一·类的定义1.1类的定义格式定义类的关键字是class,类定义结束时,后面的分号不能省略。类体中的内容称为类的成员:①类中的变量称为类的属性或成员变量;②类中的函数称为类的方......
  • 【C++面向对象】泛型编程(模板) 新手小白都能懂!
    目录泛型编程是什么?模板和泛型编程的关系?函数模板定义调用类模板定义调用总结/小注泛型编程是什么?顾名思义,“泛型”即“广泛的类型”,即不拘泥于一种特定类型的编程方法。在泛型编程时,我们通常使用一个或多个类型占位符来表示一种或多种类型,这些类型对于模板而言......
  • 矿泉水在线批发商城系统解决方案毕设毕业设计.web期末作业设计网页.css网页成品参考
     博主介绍:黄菊华老师《Vue.js入门与商城开发实战》《微信小程序商城开发》图书作者,CSDN博客专家,在线教育专家,CSDN钻石讲师;专注大学生毕业设计教育和辅导。所有项目都配有从入门到精通的基础知识视频课程,学习后应对毕业设计答辩。项目配有对应开发文档、开题报告、任务书、P......
  • c++两人组合账号
    周小灵彤:周小灵彤(六年级)-CSDN博客王小灵弘:wanghongyv-CSDN博客这是联合账号,因为我们俩懒太勤快了(嘻嘻)                                                     ......
  • NDT算法详解与C++实现
    点云匹配在感知环节是一个很重要的信息获取手段,而其中的算法也有几个比较经典了,例如ICP(IterativeClosestPoint,迭代最近点)算法,而本文决定记录学习的是NDT算法,也就是NormalDistributionTransform,正态分布变换算法。什么是正态分布变换算法呢,简言之,就是把空间中的点云进行整......
  • 灵办AI助手Chrome插件全面评测:PC Web端的智能办公利器
    探索灵办AI助手在MacOS上的高效表现,支持多款主流浏览器,助你轻松应对办公挑战文章目录探索灵办AI助手在MacOS上的高效表现,支持多款主流浏览器,助你轻松应对办公挑战摘要引言开发环境介绍核心功能评测1.网页翻译与双语对照......
  • C++基础知识:友元是什么,友元(全局函数做友元)
    在程序里,有些私有属性也想让类外特殊的一些函数或者类进行访问,就需要用到友元的技术友元的目的就是让一个函数或者类访问另一个类中私有成员通俗一点说就是友元,就好比你的闺蜜,你可以让他了解你身上的特有的东西友元的关键字为friend全局函数做友元代码测试:#include......
  • 保姆级下载C++17
    一、下载MSYS2MSYS2是一款跨平台编译套件,方便的帮助我们安装环境,下面是MSYS的官网:MSYS2https://www.msys2.org/下载完成后安装,安装的路径千万不要有中文,把你安装的路径复制一下,以便后续步骤。二、安装GCC安装完成后打开刚才复制的路径,点开msys2.exe,输入以下命令来安装GCCp......
  • windows C++-C++/WinRT 中创建组件和事件(下)
    跨ABI的简单信号如果无需连同事件传递任何形参或实参,则可以定义自己的简单Windows运行时委托类型。以下示例展示Thermometer运行时类的更简易版本。它声明名为SignalDelegate的委托类型,然后使用该类型来引发信号类型事件,而不是具有参数的事件。//ThermometerWRC.i......