星火文脉智承：基于Vue.js和Node.js的中华文化数字内容制作平台

其实本项目是一个 Vibe Coding 的项目，也就是常说的 AI 立大功环节。虽然实际的项目表现差强人意，但是也展现了 AI 在 Web 开发中的一些应用场景。

项目概述

"星火文脉智承"是一个专注于中华文化传承的数字内容制作平台，旨在为教育工作者和文化创作者提供AI驱动的视频制作工具。该项目采用前后端分离架构，前端使用 Vue.js 构建现代化用户界面，后端基于 Node.js + Express提供 RESTful API 服务，数据库使用 MongoDB 存储数据。

技术栈

前端我们选择了 Vue 3 这个现代JavaScript框架，用上了Composition API来组织代码。路由管理靠 Vue Router，构建工具是 Vite，支持热重载，让开发更顺畅。样式方面用了 CSS3，包括一些渐变、动画和响应式设计，让界面看起来更现代。

后端则基于 Node.js 和 Express.js 搭建，轻量级框架处理请求。数据存储用 MongoDB 这个 NoSQL 数据库。安全方面，JWT 负责身份认证，bcryptjs 加密密码，express-validator 验证输入数据。

外部服务方面，我们集成了阿里云的通义万相AI视频生成服务。部署时用 Nginx 做反向代理和静态文件服务，整个项目还容器化了，用 Docker 打包。

架构设计

项目采用经典的前后端分离架构：

graph TD
    A[用户] -->|HTTP请求| B(前端Vue.js)
    B -->|API调用| C(后端Node.js)
    C -->|数据库操作| D(MongoDB)
    D -->|数据返回| C
    C -->|响应数据| B
    B -->|渲染页面| A[用户]

核心功能

用户认证系统是基础，支持邮箱注册，区分教师、学生和创作者等用户类型。JWT 认证机制让登录安全有效期7天，密码用 bcrypt 加密存储，盐值处理12轮。用户还能管理个人资料、头像等信息。

视频制作是核心功能，平台提供诗词教学、历史故事等主题库。集成通义万相API，能快速生成5秒视频。制作流程简单：选主题、输内容、挑套餐、提交。进度实时跟踪，支持批量检查。

订单管理方面，状态从待支付到已完成都有跟踪，订单详情和进度一目了然。

用户中心让大家查看和编辑个人资料，管理已制作视频，包括下载和详情。还能看到统计数据，如总视频数、订单数和消费金额。账户设置包括改密码、通知偏好和自动保存。

部署和运行

生产环境我们用 Nginx 反向代理处理静态文件和API路由，使用 Let’s Encrypt 配置了 HTTPS 。

并且把整个项目打包到 Docker 容器里，方便部署和扩展。

就是 sprrkv.site 是在阿里云ECS上部署的，域名也是从阿里云买的，不过没有买 SSL 证书，无法备案。所以暂时无法访问了。

我们也使用过 Frp 来做内网穿透，不过出于安全考虑，暂时没有开放注册。

如果后续有时间和精力，会考虑买一个 SSL 证书，重新部署上线。并且把代码开源。

运行截图