项目名称:阅界 - 全栈在线图书电商平台
项目周期: 2023.03 - 2023.08 (约5个月)
项目描述: 独立设计并开发了一个集商品展示、用户管理、购物车、订单处理与后台管理于一体的B2C在线图书电商网站。项目采用前后端分离的架构,我本人负责了从数据库设计到前端展示,再到服务器部署的全流程开发。
我的角色: 全栈开发工程师(个人项目/项目核心成员)
一、 技术栈
后端:
框架: Python + Django & Django REST Framework (DRF)
数据库: PostgreSQL (生产环境), SQLite (开发环境)
缓存: Redis (用于购物车数据、热门商品缓存)
任务队列: Celery + Redis (异步处理发送注册邮件、订单状态通知)
认证: JWT (JSON Web Token) 用于用户认证与授权
图像处理: Pillow (用于用户上传头像、图书封面的压缩与缩放)
前端:
框架: Vue.js 3 + Vue Router + Pinia (状态管理)
构建工具: Vite
UI库: Element Plus
HTTP请求: Axios
部署与运维:
服务器: 腾讯云轻量应用服务器 (CentOS 7.9)
Web服务器: Nginx (反向代理、静态文件服务)
WSGI服务器: Gunicorn
容器化: Docker & Docker Compose (实现应用、数据库、Redis的容器化编排,保证环境一致性)
CI/CD: 使用GitHub Actions实现自动化测试与部署 (代码Push到main分支后,自动执行测试并部署到服务器)
二、 核心功能模块与我的工作
1. 后端API设计与数据库建模
使用Django ORM设计了用户(User)、图书(Book)、分类(Category)、购物车(Cart)、订单(Order)、收货地址(Address)等10余张数据表,并建立了合理的关联关系。
利用DRF编写了全套RESTful API,共计20+个接口,为前端提供数据支持。例如:/api/books/ (获取图书列表), /api/cart/items/ (购物车增删改查)。
难点与解决: 在设计订单流程时,为了解决高并发下的超卖问题,我使用了Django的select_for_update()实现了数据库层面的悲观锁,确保库存扣减的准确性。
2. 用户系统与权限控制
实现了基于JWT的用户注册、登录、登出功能。Access Token用于短期身份验证,Refresh Token用于刷新获取新的Access Token,提升了安全性。
设计了基于角色的权限系统:普通用户、管理员。普通用户只能管理自己的购物车和订单;管理员可以通过后台管理所有数据。
细节: 用户注册后,使用Celery异步任务发送欢迎邮件,避免主线程阻塞,提升用户体验。
3. 商品与购物车模块
实现了多条件筛选(按分类、价格区间、评分)、搜索(使用Django的Q对象进行模糊查询)和分页功能。
购物车数据在用户登录后存储在服务端的Redis中;未登录时则暂存于前端LocalStorage,并在登录时自动合并,优化了用户体验。
优化: 对首页的热门图书列表数据,使用Redis进行了缓存,设置过期时间为10分钟,有效降低了数据库的查询压力。
4. 订单与支付流程
设计了清晰的订单状态机(待支付、已支付、配送中、已完成等)。
接入了支付宝沙箱环境的支付接口,实现了完整的支付回调逻辑。支付成功后,自动更新订单状态并扣减库存。
细节: 生成订单时,会记录下单时商品的快照信息(如价格、标题),即使后台商品信息后续修改,订单历史也不会改变。
5. 后台管理系统
使用Django内置的Admin,并进行了深度定制,如增加数据可视化图表(使用Chart.js)、批量上下架商品、导出订单数据为CSV文件等。
6. 前端开发
使用Vue 3的Composition API编写了所有页面组件,逻辑清晰且易于复用。
使用Pinia管理全局状态,如用户登录状态、购物车商品数量等。
利用Vue Router实现了前端路由和导航守卫,对需要登录的页面进行权限校验。
使用Axios拦截器,在每次请求头中自动添加JWT Token,并在Token过期时自动刷新或跳转到登录页。
7. 项目部署与优化
使用Docker将应用、PostgreSQL、