基于微服务架构的外卖电商系统,涵盖用户端、商家端、骑手端、管理端四大场景,支付环节采用模拟实现。
| 层级 | 技术 | 版本 |
|---|---|---|
| 前端 | Vue 3.5 + Vite 8 + TypeScript 6 + Pinia 3 | 3.5.32 / 8.0.8 / 6.0.0 / 3.0.4 |
| 网关 | Spring Cloud Gateway | 2023.0.6 |
| 后端 | Spring Boot + Spring Cloud Alibaba | 3.3.9 / 2023.0.1.3 |
| 注册中心 | Nacos | 3.2.1 |
| 数据库 | MySQL + MyBatis-Plus + Redis | 8.0 / 3.5.10 / 7.4 |
| 反向代理 | Nginx | 1.30.1 |
Nginx (:80) → Gateway (:9000) → User Service (:9001)
→ Product Service (:9002)
→ Order Service (:9003)
→ Payment Service (:9004)
→ File Service (:9005)
所有服务注册 → Nacos (:8848)
| 软件 | 版本要求 | 用途 | 安装参考 |
|---|---|---|---|
| JDK | 21 (LTS) | 后端运行 | Adoptium |
| Maven | 3.9.x | 后端构建 | 下载 |
| Node.js | ^20.19.0 或 ≥22.12.0 | 前端构建 | 下载 |
| MySQL | 8.0.x | 数据持久化 | 下载 |
| Redis | 7.x | 缓存 | Windows 移植版 |
| Nacos | 3.2.1 | 注册中心 | 下载 |
| Nginx | 1.30.1 | 反向代理 | 下载 |
详细安装步骤见
docs/env-setup.md。
执行一键初始化脚本,会自动创建 4 个数据库并写入演示数据:
# 使用 MySQL 命令行(替换密码)
mysql -u root -p < docs\cloudfood-init.sql
# 或在 DBeaver / Navicat 中直接运行 docs/cloudfood-init.sql# Windows 移植版
redis-server.exe# 进入 Nacos 目录
cd D:\nacos\nacos\bin
# 单机模式启动
.\startup.cmd -m standalone
# 确认启动成功(看到 "Nacos started successfully")
# 访问 http://localhost:8080详细说明见
docs/nacos-deploy.md。
登录 Nacos 控制台 http://localhost:8080 → 配置管理 → 配置列表,依次创建以下配置(点击 + 新建配置):
| Data ID | Group | 格式 | 内容来源 |
|---|---|---|---|
cloudfood-shared.yml |
DEFAULT_GROUP | YAML | nacos-config/cloudfood-shared.yml |
cloudfood-user-service.yml |
DEFAULT_GROUP | YAML | nacos-config/cloudfood-user-service.yml |
cloudfood-product-service.yml |
DEFAULT_GROUP | YAML | nacos-config/cloudfood-product-service.yml |
cloudfood-order-service.yml |
DEFAULT_GROUP | YAML | nacos-config/cloudfood-order-service.yml |
cloudfood-payment-service.yml |
DEFAULT_GROUP | YAML | nacos-config/cloudfood-payment-service.yml |
cloudfood-file-service.yml |
DEFAULT_GROUP | YAML | nacos-config/cloudfood-file-service.yml |
重要:将配置中的
${DB_PASSWORD:your_mysql_password}替换为实际的 MySQL 密码。生产环境务必更换
jwt.secret为随机字符串。
cd cloudfood-backend
mvn clean package -DskipTests构建产物(以实际版本号为准):
cloudfood-gateway/target/cloudfood-gateway-0.0.1-SNAPSHOT.jarcloudfood-user-service/target/cloudfood-user-service-0.0.1-SNAPSHOT.jarcloudfood-product-service/target/cloudfood-product-service-0.0.1-SNAPSHOT.jarcloudfood-order-service/target/cloudfood-order-service-0.0.1-SNAPSHOT.jarcloudfood-payment-service/target/cloudfood-payment-service-0.0.1-SNAPSHOT.jarcloudfood-file-service/target/cloudfood-file-service-0.0.1-SNAPSHOT.jar
按任意顺序启动(建议分批启动以避免同时打印日志):
# 方式一:逐个启动(推荐,便于观察日志)
java -jar cloudfood-backend\cloudfood-gateway\target\cloudfood-gateway-0.0.1-SNAPSHOT.jar
java -jar cloudfood-backend\cloudfood-user-service\target\cloudfood-user-service-0.0.1-SNAPSHOT.jar
java -jar cloudfood-backend\cloudfood-product-service\target\cloudfood-product-service-0.0.1-SNAPSHOT.jar
java -jar cloudfood-backend\cloudfood-order-service\target\cloudfood-order-service-0.0.1-SNAPSHOT.jar
java -jar cloudfood-backend\cloudfood-payment-service\target\cloudfood-payment-service-0.0.1-SNAPSHOT.jar
java -jar cloudfood-backend\cloudfood-file-service\target\cloudfood-file-service-0.0.1-SNAPSHOT.jar
# 方式二:使用 start 命令在后台运行
start "Gateway" java -jar cloudfood-backend\cloudfood-gateway\target\cloudfood-gateway-0.0.1-SNAPSHOT.jar
# ... 其余服务同理将 nginx-1.30.1 解压到项目根目录,使用 docs/nginx-deploy.md 中的配置覆盖 conf/nginx.conf:
# 启动 Nginx
.\nginx-1.30.1\nginx.exe
# 验证
.\nginx-1.30.1\nginx.exe -t开发阶段可跳过 Nginx,Vite 开发服务器可直接代理 API 到 Gateway。
cd cloudfood-frontend
npm install
npm run dev| 角色 | 用户名 | 密码 | 说明 |
|---|---|---|---|
| 用户 | zhangsan |
123456 |
普通用户,可下单、评价 |
| 商家 | lisi_shop |
123456 |
管理菜品、处理订单 |
| 骑手 | wangwu_rider |
123456 |
接单配送 |
| 管理员 | admin |
123456 |
管理后台 |
# 检查所有端口是否正常监听
netstat -ano | findstr "8848 9000 9001 9002 9003 9004 9005"
# Nacos 控制台
# http://localhost:8080 → 服务管理 → 服务列表
# 应看到 6 个服务均已注册
# 前端页面
# http://localhost:5173cloudfood-backend/ # Maven 父工程(Spring Boot 多模块)
├── cloudfood-common/ # 公共工具类、统一响应
├── cloudfood-gateway/ # 网关(:9000)
├── cloudfood-user-service/ # 用户服务(:9001)
├── cloudfood-product-service/ # 商品服务(:9002)
├── cloudfood-order-service/ # 订单服务(:9003)
├── cloudfood-payment-service/ # 支付服务(:9004,模拟)
└── cloudfood-file-service/ # 文件服务(:9005)
cloudfood-frontend/ # Vue 3 前端
├── src/views/user/ # 用户端 - 浏览商品、下单、评价
├── src/views/merchant/ # 商家端 - 菜品管理、订单处理
├── src/views/rider/ # 骑手端 - 接单配送
└── src/views/admin/ # 管理端 - 用户管理、数据报表
docs/ # 开发文档
nacos-config/ # Nacos 配置参考文件
# 构建所有后端模块
cd cloudfood-backend && mvn clean package -DskipTests
# 构建单个模块
cd cloudfood-backend && mvn clean package -DskipTests -pl cloudfood-order-service -am
# 构建前端
cd cloudfood-frontend && npm run build
# 停止所有 Java 进程
taskkill /f /im java.exe
# 停止 Nginx
.\nginx-1.30.1\nginx.exe -s stop
# 停止 Nacos
cd D:\nacos\nacos\bin && .\shutdown.cmdNacos 启动失败 — 确认 JAVA_HOME 已设置、MySQL 已启动且 nacos 数据库已初始化,见 docs/nacos-deploy.md。
微服务注册不到 Nacos — 确认 Nacos 已启动、配置已导入、application.yml 中的 server-addr 和密码正确。
数据库连不上 — 检查 NACos 配置中的 DB_PASSWORD 是否替换为实际的 MySQL 密码。
端口被占用 — netstat -ano \| findstr :端口号 查看占用进程,修改对应配置或关闭冲突程序。
前端请求 404 / 502 — 确认 Gateway 已启动(:9000),Vite 代理或 Nginx 配置正确。