Sign in Join

Live chat for Free Pascal, Lazarus, Delphi and every Pascal programmer.

Catalog · How the catalog works

Random project

blog

A front-end and back-end separated blog system built with Delphi mORMot 2 and Vue 3.

View on GitHub

Anyone may press Interesting, signed in or not. It helps others find this project.

Member rating

No ratings yet.

Sign in to rate this project.

README

博客系统

基于 Delphi mORMot2 和 Vue 3 的前后端分离博客系统。

技术栈

服务端

  • 语言: Delphi
  • 框架: mORMot 2
  • 数据库: SQLite
  • 特性: RESTful API、JWT认证

客户端

  • 框架: Vue 3
  • 构建工具: Vite
  • 路由: Vue Router
  • 状态管理: Pinia
  • HTTP客户端: Axios

功能特性

公开功能

  • 浏览已发布的博客文章
  • 查看文章详情
  • 匿名用户发表评论

管理员功能

  • 管理员登录
  • 创建、编辑、删除博客文章
  • 发布/取消发布文章
  • 管理评论（删除）

项目结构

pascal
blog/
????????? server/                 # Delphi?????????
???   ????????? Blog.Model.pas     # ????????????
???   ????????? Blog.Service.pas   # ??????????????????
???   ????????? BlogServer.dpr     # ?????????
????????? client/                # Vue?????????
    ????????? src/
    ???   ????????? views/         # ????????????
    ???   ????????? stores/        # Pinia????????????
    ???   ????????? router/        # ????????????
    ???   ????????? App.vue        # ?????????
    ???   ????????? main.js        # ????????????
    ????????? index.html
    ????????? package.json
    ????????? vite.config.js

快速开始

环境要求

服务端

  • Delphi 10.4 或更高版本
  • mORMot 2 框架

客户端

  • Node.js 16+
  • npm 或 yarn

安装步骤

1. 启动服务端

  1. 使用 Delphi 打开 server/BlogServer.dpr
  2. 编译并运行程序
  3. 服务端将在 http://localhost:8080 启动
  4. 首次运行会自动创建 SQLite 数据库 blog.db
  5. 默认管理员账号：
    • 用户名: admin
    • 密码: admin123

2. 启动客户端

bash
cd client
npm install
npm run dev

客户端将在 http://localhost:3000 启动

生产部署

服务端

编译 Delphi 项目，将可执行文件部署到服务器

客户端

bash
cd client
npm run build

构建产物在 client/dist 目录，可部署到任何静态文件服务器

API 接口

认证

  • POST /api/IBlogService/Login - 管理员登录

文章

  • POST /api/IBlogService/GetPosts - 获取文章列表
  • POST /api/IBlogService/GetPost - 获取单篇文章
  • POST /api/IBlogService/CreatePost - 创建文章
  • POST /api/IBlogService/UpdatePost - 更新文章
  • POST /api/IBlogService/DeletePost - 删除文章

评论

  • POST /api/IBlogService/GetComments - 获取评论列表
  • POST /api/IBlogService/CreateComment - 创建评论
  • POST /api/IBlogService/DeleteComment - 删除评论

数据库结构

TUser (用户表)

  • ID: 主键
  • Username: 用户名
  • Password: 密码
  • Email: 邮箱

TBlogPost (博客文章表)

  • ID: 主键
  • Title: 标题
  • Content: 内容
  • Summary: 摘要
  • Author: 作者
  • Published: 是否发布
  • CreatedAt: 创建时间
  • UpdatedAt: 更新时间

TComment (评论表)

  • ID: 主键
  • PostID: 文章ID
  • AuthorName: 评论者昵称
  • AuthorEmail: 评论者邮箱
  • Content: 评论内容
  • CreatedAt: 创建时间
  • Approved: 是否已审核

开发说明

服务端开发

  • 数据模型定义在 Blog.Model.pas
  • 业务逻辑在 Blog.Service.pas
  • 主程序在 BlogServer.dpr

客户端开发

  • 页面组件在 src/views/
  • 状态管理在 src/stores/
  • 路由配置在 src/router/

注意事项

  1. 安全性: 生产环境请修改默认管理员密码
  2. 密码加密: 当前示例中密码未加密，生产环境应使用加密存储
  3. JWT密钥: 生产环境请使用安全的JWT密钥
  4. 跨域: 服务端已配置CORS，生产环境请根据需要调整

许可证

MIT License

贡献

欢迎提交 Issue 和 Pull Request