SpringBoot+Redis编写一个抢红包雨的案例。附源码。

案例演示

SpringBoot+Redis编写一个抢红包雨的案例。附源码

 

1、案例分析,整体方案介绍

      预备上线一个红包雨活动。这个红包雨的思路是活动开始前25分钟,在后台创建活动。然后前端用户进入,到点后将设置的金额拆分成多个小红包,开启倒计时,下红包雨,用户在结束前可以抢多个,结束后弹出抢到的总金额。

    分析 100%高并发业务要求,不能用mysql来做,  ,你需要有记录,比如100块钱,被拆分成10个红包发出去,总计有10个红包,抢一个少一个,总数显示(10/6)直到完,需要记录那些人抢到了红包,  

2、红包雨流程问题。 


3、搭建SpringBoot环境

    好了,现在开干。先搭建一个springBoot+websocket+redis的环境。(依赖看图)测试下正常写入redis数据。连接进websocket.空工程下载地址:https://download.csdn.net/download/ldy889/88560527

增加SpringUtils 解决了webSocket不能访问redis问题:https://download.csdn.net/download/ldy889/88560601

添加yaml文件

server:port: 8080spring:datasource:url: jdbc:mysql://127.0.0.1:3306/jeecg-boot?characterEncoding=UTF-8&useUnicode=true&useSSL=false&tinyInt1isBit=false&allowPublicKeyRetrieval=true&serverTimezone=Asia/Shanghaiusername: rootpassword: root123driver-class-name: com.mysql.cj.jdbc.Driverredis:database: 0host: 127.0.0.1port: 6379password: ''

 pom

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd"><modelVersion>4.0.0</modelVersion><parent><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-parent</artifactId><version>3.1.5</version><relativePath/> <!-- lookup parent from repository --></parent><groupId>com.example</groupId><artifactId>demo</artifactId><version>0.0.1-SNAPSHOT</version><name>demo</name><description>Demo project for Spring Boot</description><properties><java.version>17</java.version></properties><dependencies><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-data-jdbc</artifactId></dependency><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-data-redis-reactive</artifactId></dependency><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-websocket</artifactId></dependency><dependency><groupId>com.mysql</groupId><artifactId>mysql-connector-j</artifactId><scope>runtime</scope></dependency><dependency><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId><optional>true</optional></dependency><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-test</artifactId><scope>test</scope></dependency><dependency><groupId>io.projectreactor</groupId><artifactId>reactor-test</artifactId><scope>test</scope></dependency></dependencies><build><plugins><plugin><groupId>org.springframework.boot</groupId><artifactId>spring-boot-maven-plugin</artifactId><configuration><image><builder>paketobuildpacks/builder-jammy-base:latest</builder></image><excludes><exclude><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId></exclude></excludes></configuration></plugin></plugins></build></project>

4、设置一场红包雨活动

        用刚才的后端代码,创建一个 /api/addActivity 接口。这里需要传递5个参数:

  • 持续时长:5秒,
  • 生成速率:5个/秒,
  • 总金额:100元,
  • 红包个数10个,
  • 活动开启时间:今晚8点。

然后我们后端需要创建一个活动ID,返回给前端。前端拿到这个活动ID,和用户Token开启webSocket连接。等到时间后,webSocket会 推送抢红包的地址给前端。webSocket断开,并开始下红包雨倒计时。持续一段时间后,到时间后这里设置5秒后,抢完显示查询结果你抢到了多数元。

这个应该是后台管理员设置。看不见我。

5、创建WebSocket连接服务器。 

前端测试websocket代码 

后端需要配置Redis,WebSocket.config

这里主要是将用户加入到活动列表中。如果是活动开始后才连接进来的,需要单发消息给他开启倒计时。

这里是到点后,redis会发消息。这里就接受到消息了。然后群发给用户开始倒计时。

6、搭建前端环境创建抢红包页面

7、 前后端代码详解。

先从后端开始吧

1、活动创建成功。 


2、用户进入/离开活动房间。等待红包雨。实时人数3人。


3、群发红包雨开始。


4、用户抢到红包。 用户信息,红包金额,抢到时间,离活动结束还有3秒,红包剩余金额,RedisKey:


5、用户未抢到红包。 用户信息,失败原因,RedisKey:


 6、红包雨结束。红包雨信息: RedisKey:


7、用户查询抢到金额。用户信息,查到金额。


8、本次红包雨总金额,用户参与人数,抢到人数,抢走金额。剩余金额。

再来前端控制台。


      1、活动创建成功。活动ID:hd_activityRandString。


      2、WebSocket连接成功,进入房间。


      3、收到服务器消息:红包雨信息:key:rain_RandString,money:100,number:10


      3、WebSocket关闭成功,开启倒计时。


      4、抢到红包:红包金额,抢到时间,离活动结束还有3秒,红包剩余金额。


      5、未抢到红包:失败原因,


      6、红包雨结束,查询抢到金额。  

有问题的可以留言。yaldongyu@qq.com

对这个项目感兴趣的朋友也可探讨下。

源码发在gitee上了。 

前端代码也放进后台里的web文件夹下。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/188799.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

如何打造稳健高效的数据库基础设施?数据库云提出创新方案

引言 数据库的云化、丰富业务场景下多元的数据库类型、公有云与私有云交织的IT架构&#xff0c;叠加信创影响使得企业内部的基础设施日益复杂&#xff0c;如何高效管理多元的数据库和多云异构基础设施正成为企业面临的严峻挑战。在此背景下&#xff0c;数据库云应运而生。数据…

netty websocket学习

【硬核】肝了一月的Netty知识点 超详细Netty入门&#xff0c;看这篇就够了&#xff01; vuewebsokect实现实时聊天&#xff0c;可单聊、可群聊&#xff08;一&#xff09; vue实现聊天栏定位到最底部&#xff08;超简单、可直接复制使用&#xff09; vue实现指定div右键显示菜…

转向更卷的奶茶 库迪这是要在咖啡上认怂?

卖咖啡刚满一年&#xff0c;陆正耀就带着名为“茶猫”的奶茶项目再度登场。 根据多位网友的爆料&#xff0c;茶猫采取和库迪咖啡一样的联营商模式&#xff0c;且有低价补贴策略&#xff0c;主打低价茶饮市场&#xff0c;全场统一定价6.9元。 熟悉的加盟模式&#xff0c;熟悉的…

使用type实现接口继承效果

如何使用type实现接口继承的效果 接口继承的写法 // 接口继承 interface Person {name: stringage: numberhobby?: string say: (content: string) > void } interface Student extends Person {score: number }使用 type 模拟 interface的继承效果 // 使用type实现类似…

参考文献格式的引用

一、文献格式的快速引用 &#xff08;一&#xff09;参考文献的类型 参考文献的类型&#xff08;即引文出处&#xff09;以单字母方式标识在文献名后并以方括号括起&#xff0c;具体类型标识如下&#xff1a; M ——专著、普通图书 C ——论文集 N ——报纸文章 J ——期刊文章…

opencv-python中常用的函数及使用方法

OpenCV是一个开源计算机视觉库&#xff0c;提供了许多函数和工具&#xff0c;可以用于图像和视频处理、物体识别和跟踪、摄像机标定等任务。以下是一些常用的OpenCV函数及其使用方法的介绍&#xff1a; 1.图像读取和显示&#xff1a; cv2.imread()&#xff1a;用于读取图像文…

CSS选择器十二种方法

相信大家对元素应该是不陌生的&#xff0c;当我们页面中&#xff0c;我们想要布局&#xff0c;给元素添加样式的时候&#xff0c;我们应该怎么获取到指定元素呢&#xff1f; 优先级&#xff1a;ID 选择器 > 类选择器 > 标签选择器 > 通配符 1.元素选择器 通过标签名…

基于springboot+vue的秒杀商城(前后端分离)

博主主页&#xff1a;猫头鹰源码 博主简介&#xff1a;Java领域优质创作者、CSDN博客专家、公司架构师、全网粉丝5万、专注Java技术领域和毕业设计项目实战 主要内容&#xff1a;毕业设计(Javaweb项目|小程序等)、简历模板、学习资料、面试题库、技术咨询 文末联系获取 项目介绍…

这是怎么了?继阿里11月故障后,淘宝这个问题20 天了还未修复!

继11月12号&#xff0c;阿里云发生大面积故障故障以来&#xff0c;已经过去了近 20天&#xff0c;但是截止到发文时间&#xff0c;作者发现淘宝还有部分功能存在问题&#xff0c;没法正常使用。 难道真是降本增笑&#xff0c;开猿截流&#xff0c;导致没有相关负责人员了&…

【超全】JavaScript知识速查:基础语法与DOM操作

JavaScript知识速查 文章目录 JavaScript知识速查[toc]JavaScript 简介在网页开发中的用途和意义&#xff1a;示例&#xff1a; JavaScript 语法JavaScript 变量定义变量命名规则&#xff1a;变量的类型&#xff1a;变量的作用域&#xff1a;示例代码&#xff1a; JavaScript 数…

业余爱好-社会工程管理记账报税

税务问题笔记 印花税税费申报及缴纳财务和行为税合并纳税申报增值税及附加税费申报企业所得税季度A类申报残疾人就业保障金申报财务报表个税申报 印花税 印花税是对在经济活动和经济交往中书立、领受具有法律效力的凭证的行为征收的一种税。 税费申报及缴纳 财务和行为税合并…

LeetCode Hot100 75.颜色分类

题目&#xff1a; 给定一个包含红色、白色和蓝色、共 n 个元素的数组 nums &#xff0c;原地对它们进行排序&#xff0c;使得相同颜色的元素相邻&#xff0c;并按照红色、白色、蓝色顺序排列。 我们使用整数 0、 1 和 2 分别表示红色、白色和蓝色。 必须在不使用库内置的 so…

Mybatis核心配置文件概述

MyBatis核心配置文件层级关系 configuration配置 properties属性 settings设置 typeAliases类型别名 typeHandlers类型处理器 objectFactory对象工厂 plugins插件 environments环境 environrnent 环境变量 transactionManager事务管理器 dataSource数据源 databaseldPr…

CentOS 7安装Java 8

前言 这是我在这个网站整理的笔记,有错误的地方请指出&#xff0c;关注我&#xff0c;接下来还会持续更新。 作者&#xff1a;神的孩子都在歌唱 要在CentOS 7上安装Java 8&#xff0c;请按照以下步骤操作&#xff1a; 打开终端并以root身份登录。 更新系统软件包&#xff1a; …

淘宝订单接口在电商行业中的重要性

一、引言 随着电子商务的快速发展&#xff0c;电商平台已经成为人们日常生活中不可或缺的一部分。淘宝作为中国最大的电商平台之一&#xff0c;拥有庞大的用户群体和商家资源。为了满足商家和消费者之间的交易需求&#xff0c; &#xff0c;其中订单接口是其中最为重要的一部分…

大数据:Hadoop刷题

大数据&#xff1a;Hadoop刷题 2022找工作是学历、能力和运气的超强结合体&#xff0c;遇到寒冬&#xff0c;大厂不招人&#xff0c;可能很多算法学生都得去找开发&#xff0c;测开 测开的话&#xff0c;你就得学数据库&#xff0c;sql&#xff0c;oracle&#xff0c;尤其sql要…

Day04:每日一题:2661. 找出叠涂元素

2661. 找出叠涂元素 给你一个下标从 0 开始的整数数组 arr 和一个 m x n 的整数 矩阵 mat 。 arr 和 mat 都包含范围 [1&#xff0c;m * n] 内的 所有 整数。从下标 0 开始遍历 arr 中的每个下标 i &#xff0c;并将包含整数 arr[i] 的 mat 单元格涂色。请你找出 arr 中在 mat…

【PixPin】媲美QQ/Snipaste截图贴图OCR工具

PixPin PixPin是一款截图工具&#xff0c;它集成了截图、长截图、贴图、标注、OCR识别等众多功能&#xff0c;软件体积小巧&#xff0c;使用简单&#xff0c;是一款非常棒的截图工具。之前使用过Snipaste工具的小伙伴用起来应该是得心应手。 从左往右的功能依次是&#xff1a;…

jetson nano网络配置(有线、无线、USB)

文章目录 网络配置&#xff08;有线、无线&#xff09;1.前言1.1 RJ451.2 无线网卡 2.有线连接2.1 连接方法2.2 检测连接状态 3.无线3.1 网卡安装步骤3.2 连接方法3.3 检测连接状态 4.通过USB 线控制Jetson Nano4.1 连接4.2 查看设备4.3 查看设备IP 网络配置&#xff08;有线、…

接口幂等+防重复提交+失败重试

1、接口幂等 接口幂等性就是用户对同一接口发起了一次或多次请求之后&#xff0c;对数据的影响是不变的&#xff0c;不会因为多次请求而产生不同的结果。 实现方案&#xff1a; 调用方传&#xff1a;参数UUID&#xff0c;当接口请求参数和UUID生成key&#xff0c;存到Redis状态…