# 基于 Spring Boot + Vue3 的图书商城系统

**Repository Path**: he-jun0000/SpringBootbook

## Basic Information

- **Project Name**: 基于 Spring Boot + Vue3 的图书商城系统
- **Description**: BookMall 是一个基于 Vue 3 + Spring Boot 3 的在线图书商城项目，包含「前台用户端 / 商家后台 / 管理员后台」三套入口，支持本地一键启动与 Docker 一键部署，适合作为毕业设计展示、产品原型演示或二次开发的基础模板。
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2026-01-01
- **Last Updated**: 2026-03-09

## Categories & Tags

**Categories**: Uncategorized

**Tags**: 图书商城, 毕设模板, 商用模板, java毕设, 电商系统

## README

# BookMall 图书商城（商用模板级）

一个基于 **Vue 3 + Spring Boot 3** 的在线图书商城项目，包含 **用户端 / 商家端 / 管理后台**，支持本地开发运行与 Docker 一键部署，并预留“即插即用”的支付接口（微信/支付宝等真实对接需自行接入）。

> 相关文档：`启动说明.md`（启动/部署快速指引）

---

## 功能概览

### 用户端（前台）
- 图书浏览：列表/搜索/排序/详情
- 店铺页：查看店铺与商品
- 购物车：添加/删除/改数量/结算
- 订单：创建订单、查看订单列表/详情、发起支付（预留接口）、确认收货/取消
- 个人中心：基础信息、收货地址、发票申请等页面（按后端接口实现情况展示）
- 内容系统：文章/公告列表与详情、CMS 页面（支持后台配置内容）
- 活动页：活动/运营页面入口（按后端接口实现情况展示）

示例截图：

![用户端示例 1](Img/1.png)

![用户端示例 2](Img/2.png)

### 商家端（Seller）
- 商家登录/注册
- 商品管理：上架/下架、编辑（按后端接口实现情况展示）
- 订单管理：查看/处理订单（按后端接口实现情况展示）
- 售后管理：售后列表与处理（按后端接口实现情况展示）
- 发票管理：开票/记录（按后端接口实现情况展示）
- 店铺设置：店铺资料维护（按后端接口实现情况展示）

示例截图：

![商家端示例](Img/3.png)

### 管理后台（Admin）
- 管理员登录
- 仪表盘/数据概览（按后端接口实现情况展示）
- 图书管理/审核、分类管理
- 订单管理、售后管理
- 用户管理、商家管理/审核
- 运营能力：优惠券、秒杀、消息推送、Banner、内容管理（文章/公告/CMS 页面）

示例截图：

![管理员后台示例](Img/4.png)

> 说明：本仓库同时包含“已完成能力”和“规划能力”。是否可用以你实际运行时对应的后端 API/数据库数据为准。

---

## 技术栈

### 前端
- Vue 3 + Vite
- Vue Router
- Pinia
- Element Plus
- Axios
- DOMPurify（对 `v-html` 内容做 XSS 清洗）

### 后端
- Java 17
- Spring Boot 3.2.x
- Spring Security + JWT
- MyBatis-Plus + MySQL 8
- Redis
- Knife4j / OpenAPI（开发环境可开，生产默认关闭）
- Actuator（健康检查等）

### 部署/运维
- Docker / Docker Compose
- Nginx（反向代理与静态资源托管）
- Let’s Encrypt + Certbot（HTTPS 模板，HTTP-01）

---

## 项目结构

```
.
├── bookmall-backend/           # 后端（Spring Boot）
├── bookmall-frontend/          # 前端（Vue3 + Vite）
├── nginx/                      # Nginx 配置（含 HTTPS 模板）
├── docker-compose.yml          # 默认一键栈（MySQL/Redis/Mongo/ES/RabbitMQ/前后端/Nginx；含 extras profile）
├── docker-compose.stack.yml    # 历史文件（旧“核心栈”示例，已不作为默认入口）
├── docker-compose.prod.yml     # 生产覆盖（Certbot/HTTPS 相关）
├── deploy.sh                   # Linux/macOS 一行部署脚本
├── deploy.ps1                  # Windows PowerShell 一行部署脚本
├── deploy.cmd                  # Windows CMD 包装脚本
└── 启动说明.md                 # 更详细的启动说明
```

---

## 快速开始（本地开发）

### 1）启动后端（8080）

前置要求：
- JDK 17+
- Maven 3.8+
- MySQL 8.0+
- Redis（可选，但建议开启）

初始化数据库：
1. 创建库：
```sql
CREATE DATABASE bookmall DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;
```
2. 执行初始化脚本：`bookmall-backend/src/main/resources/schema.sql`

启动后端：
```bash
cd bookmall-backend
mvn spring-boot:run
```

后端默认地址：`http://localhost:8080`

OpenAPI/Swagger（开发环境）：
- `http://localhost:8080/swagger-ui.html`

### 2）启动前端（3000）

前置要求：
- Node.js 18+

```bash
cd bookmall-frontend
npm install
npm run dev
```

前端默认地址：`http://localhost:3000`
三端入口（本地开发/演示）：
- 前台（用户端）：`http://localhost:3000/`
- 商家后台：`http://localhost:3000/seller/login`
- 管理员后台：`http://localhost:3000/admin/login`
重要提示：
- 不要直接双击打开 `bookmall-frontend/index.html`（模块/资源路径会导致白屏），开发请使用 `npm run dev`。

### 3）前后端联调配置

前端 API 基址可通过环境变量配置：
- 复制 `bookmall-frontend/.env.example` 为 `bookmall-frontend/.env.local`
- 修改 `VITE_API_BASE_URL`（例如：`http://localhost:8080`）

---

## Docker 一行部署（推荐：服务器/生产）

前置要求：
- 安装 Docker 与 Docker Compose（服务器建议 Linux）
- 服务器开放端口：`80`（申请证书时必须）/ `443`（HTTPS）以及你需要的 SSH 端口
- 如果要启用 HTTPS：域名已解析到服务器公网 IP

### 方式 A：脚本一行部署（最省事）

Linux/macOS：
```bash
./deploy.sh --domain bookmall.example.com --email you@example.com
```

Windows PowerShell（Docker Desktop）：
```powershell
powershell -ExecutionPolicy Bypass -File .\deploy.ps1 -Domain bookmall.example.com -Email you@example.com
```

脚本会：
- 首次运行自动生成 `.env.prod.local`（强随机 `JWT_SECRET`、MySQL root 密码等）
- 启动完整栈：MySQL / Redis / MongoDB / Elasticsearch / RabbitMQ / Backend / Frontend / Nginx
- 叠加 `docker-compose.prod.yml` 时可自动签发证书并启用 HTTPS（需要域名与邮箱）

### 方式 B：手动 docker compose

仅 HTTP（不启用证书）：
```bash
docker compose up -d --build
```

启用 HTTPS（叠加生产覆盖）：
```bash
docker compose -f docker-compose.yml -f docker-compose.prod.yml up -d --build
```

启用“更多基础设施模块”（PostgreSQL / Kafka / etcd / Nacos）：
```bash
docker compose --profile extras up -d --build
```

---

## HTTPS（Let’s Encrypt + Certbot）

仓库已提供 HTTPS 模板：
- `nginx/conf.d/bookmall-ssl.conf.example`：复制为 `nginx/conf.d/bookmall-ssl.conf` 并替换域名
- `docker-compose.prod.yml`：包含 `certbot` 与自动续期 `certbot-renew`

常用流程：
1. 先启动 HTTP（确保 `/.well-known/acme-challenge/` 可访问）
2. 申请证书（webroot 模式）
3. 启用 `bookmall-ssl.conf` 后重启 Nginx

更详细命令见：`启动说明.md`

---

## 环境变量与配置（生产建议）

### 后端（容器/服务器）

关键变量：
- `JWT_SECRET`：生产必须替换为强随机值（脚本会自动生成）
- `CORS_ALLOWED_ORIGINS`：生产必须改成你的前端域名（不要包含 `localhost`）
- `PAYMENT_MOCK_ENABLED`：生产必须为 `false`

生产安全检查：
- 后端在 `prod` 下会对“默认 JWT 密钥 / 本地 CORS / 模拟支付开关”等做启动前检查，避免误上生产。

### 前端

关键变量：
- `VITE_API_BASE_URL`：后端 API 地址（本地开发通常为 `http://localhost:8080`）

---

## 支付接口（预留：可即插即用替换实现）

本项目已提供支付领域的“对接点”，你可以在不改动业务主流程（下单/订单状态流转）的前提下，替换为真实支付宝/微信支付实现。

- 统一支付入口：`/api/v1/payment/**`
- 订单发起支付：`POST /api/v1/orders/{orderId}/pay`
- 本地联调可选：`PAYMENT_MOCK_ENABLED=true`（会启用 mock 路由与模拟策略；生产务必关闭）

建议你在接入真实支付时补齐：
- 支付回调验签、幂等（订单/支付单）与对账能力
- 回调重试与补偿任务（定时扫单/对账）
- 风控：金额/订单状态校验、黑名单/频控、IP/UA 策略等

---

## 安全与商用模板说明

本仓库面向“商用模板级”交付，已包含一系列基础安全能力与防白屏兜底，但正式商用仍建议你按自身场景做二次加固与合规评审：
- 前端对富文本渲染做 XSS 清洗（DOMPurify）
- 后端：Spring Security + JWT、登录爆破防护（失败次数/时间窗/锁定）
- 生产环境：HSTS 可开启、Swagger 默认关闭、关键安全配置启动检查
- Docker/Nginx：支持统一入口、HTTPS、证书续期

---

## 默认账号

开发环境内置账号通常来自初始化 SQL（以 `schema.sql` 为准），常见默认值：
- 管理员：`admin / 123456`
- 测试用户：`test / 123456`
- 商家：`seller1 / 123456`（平台自营：`platform / 123456`）
---

## 常见问题（白屏/无内容）

1. 确认你打开的是开发服务器或 Nginx 地址，而不是直接打开 `index.html`
2. 前端默认端口是 `3000`：`npm run dev`
3. 打开浏览器控制台（Console/Network）查看报错；本项目已增加全局错误兜底，页面会尽量显示“致命错误”提示
4. 确认前端 `VITE_API_BASE_URL` 指向可访问的后端（例如 `http://localhost:8080`）

---

## 许可与声明

本项目可作为学习使用，如需技术支持请联系作者；
如需用于正式商业项目，请联系作者获取商业授权；
邮箱：3946808002@qq.com
QQ: 3946808002