极简高并发秒杀商城

  这是一款极简高并发秒杀商城项目。本项目偏向于后端。之所以说“极简”,是因为本项目的前端界面没有丰富炫酷的商品界面,目前就只有三个各具特色的商品,只是意思一下,用于充当实际种类繁多的商品。

  麻雀虽小,五脏俱全。虽然本项目做得很简单,但已包含高并发秒杀项目的基本功能。项目代码已在 GitHub 上开源免费发布,作者将对此项目提供持续更新与维护。本项目的源码分为前端和后端两个部分,GitHub 源码地址将在文末给出。


版本 M.0.0 支持的功能:(以用户的角度)

  1. 前后端分离,前端使用 React,后端使用 Spring Boot,它们之间通过 Nginx 进行交互。凡是涉及请求页面的,由 React 路由处理,不经由 SpringBoot,可以有效减轻后端负担

  2. 支持注册、登录、显示商品列表、商品详情、购买秒杀、订单列表功能

  3. 支持对用户每个请求之前的身份校验以及保持用户登录状态

  4. 使用 MySQL 保存用户的注册信息、订单、商品列表等

  5. 使用 Redis 缓存热点数据、实现分布式锁

  6. 使用 RabbitMQ 对用户秒杀请求进行削峰处理

  7. 提供柔和自动渐变的背景颜色。但当用户进入秒杀界面时,背景颜色会变化得很快


版本 M.0.0 运行效果图

登录和注册

如果图片不能显示,请尝试在电脑端访问

商品界面

如果图片不能显示,请尝试用在电脑端访问

购买界面

如果图片不能显示,请尝试用在电脑端访问

订单界面

如果图片不能显示,请尝试用在电脑端访问

技术内幕

——2022年3月29日

总括

  本项目是一款前后端分离的极简高并发秒杀商城项目。


  前端使用 React、Semi Design 编写,其中,凡是涉及与数据库无关的静态页面的请求,均是由 React 路由来完成跳转,而不涉及对后端的请求依赖。前端使用的全是函数式组件(React Hooks),组件底层使用的是最近兴起的 Semi Design,也有部分使用的是 HTML、React 的原生组件。对后端发出的异步请求使用的是 Axios。

  当用户浏览商品时,屏幕的背景颜色会发生柔和渐变。但当用户进入秒杀界面时,背景颜色会变化得很快。


  后端使用 Spring Boot 内置 Tomcat 来接收来自前端的请求,其中,这些来自前端的请求是通过 Nginx 反向代理传入 Spring Boot 中的。每当用户登录时,后端会将用户信息缓存至 Redis,然后向前端反馈一个 Cookie 来记录本次的 Session。每当用户进入必须要先登录才能进入的界面时,后端会通过 Spring Boot 拦截器检查用户的 Session,如果 Session 存在且有效,后续的操作才能进行。

  对于秒杀请求,后端会为本次请求生成一个 ID,存入 Redis 中,并将本次请求推入 RabbitMQ 中,然后将此 ID 反馈给前端。前端在得到此反馈 ID 后,会定期询问秒杀结果,直到查询结果已落定。请求在 RabbitMQ 中秒杀成功,会将结果写入 Redis,便于前端快速查询。此外,后端还会将其它各种热点数据写进 Redis 中,如商品的秒杀结束状态、商品的剩余数量等。


源代码

  已上传至 GitHub,欢迎技术上的交流指点:

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值