尚品汇总结十：秒杀模块（面试专用）

不念不忘少年蓝@ 2023-10-14 13:54 10阅读 0赞

## 1、需求分析 ##

所谓“秒杀”，就是商家发布一些超低价格的商品，所有买家在同一时间网上抢购的一种销售方式。通俗一点讲就是商家为促销等目的组织的网上限时抢购活动。由于商品价格低廉，往往一上架就被抢购一空，有时只用一秒钟。

秒杀商品通常有三种限制：库存限制、时间限制、购买量限制。

并发问题的解决!

（1）库存限制：商家只拿出限量的商品来秒杀。比如某商品实际库存是200件，但只拿出50件来参与秒杀。我们可以将其称为“秒杀库存”。

（2）时间限制：通常秒杀都是有特定的时间段，只能在设定时间段进行秒杀活动；

（3）购买量限制：同一个商品只允许用户最多购买几件。比如某手机限购1件。张某第一次买个1件，那么在该次秒杀活动中就不能再次抢购。

需求：

1.  商家提交秒杀商品申请，录入秒杀商品数据，主要包括：商品标题、原价、秒杀价、商品图片、介绍等信息
2.  运营商审核秒杀申请
3.  秒杀频道首页列出当天的秒杀商品，点击秒杀商品图片跳转到秒杀商品详细页。
4.  商品详细页显示秒杀商品信息，点击立即抢购进入秒杀，抢购成功时预减库存。当库存为0或不在活动期范围内时无法秒杀。
5.  秒杀成功，进入下单页填写收货地址、电话、收件人等信息，完成下订单，然后跳转到支付页面，支付成功，跳转到成功页，完成秒杀。
6.  当用户秒杀下单30分钟内未支付，取消订单，调用支付宝的关闭订单接口。

## 2、秒杀功能分析 ##

列表页

![2c40985cfe5c4aef90c24a2a1abcf665.png][]

详情页

![1124d7c02bd14d3ba93d339c6652555a.png][]

排队页

![2262f4751a4d4ff2b94f22a24cd06ea4.png][]

下单页

![dc57d3637c814a9a8446b752e1e87e16.png][]

支付页

![f2b55a0532244d62b11a1ab052152609.png][]

## 3、数据库表 ##

秒杀商品表seckill\_goods

![9e940f8f508f4d989873caef04464713.png][]

## 4、秒杀实现思路 ##

1.  秒杀的商品要提前放入到redis中（缓存预热），什么时间放入？凌晨放入当天的秒杀商品数据。
2.  状态位控制访问请求，何为状态位？就是我们在内存中保存一个状态，当抢购开始时状态为1，可以抢购，当库存为0时，状态位0，不能抢购；状态位的好处，他是在内存中判断，压力很小，可以阻止很多不必要的请求
3.  用户提交秒杀请求，将秒杀商品与用户id关联发送给mq，然后返回，秒杀页面通过轮询接口查看是否秒杀成功
4.  我们秒杀只是为了获取一个秒杀资格，获取秒杀资格就可以到下单页下订单，后续业务与正常订单一样
5.  下单我们需要注意的问题：

状态位如何同步到集群中的其他节点？

如何控制一个用户只下一个订单？

如何控制库存超卖？

如何控制访问压力？

### 业务流程图： ###

![df8b5179256849719d6f1e4f36eeae54.png][]

*  # 秒杀商品导入缓存 #

缓存数据实现思路：前面的业务中我们把定时任务写在了service-task模块中，为了统一管理我们的定时任务，在秒杀业务中也是一样，为了减少service-task模块的耦合度，我们可以在定时任务模块只发送mq消息，需要执行定时任务的模块监听该消息即可，这样有利于我们后期动态控制，

例如：每天凌晨一点我们发送定时任务信息到mq交换机，如果秒杀业务凌晨一点需要导入数据到缓存，那么秒杀业务绑定队列到交换机就可以了，其他业务也是一样，这样就做到了很好的扩展。

上面提到我们要控制库存数量，不能超卖，那么如何控制呢？在这里我们提供一种解决方案，那就我们在导入商品缓存数据时，同时将商品库存信息导入队列，利用redis队列的原子性，保证库存不超卖

库存加入队列实施方案

1.  如果秒杀商品有N个库存，那么我就循环往队列放入N个队列数据
2.  秒杀开始时，用户进入，然后就从队列里面出队，只要队列里面有数据，说明就有库存（redis队列保证了原子性），队列为空了说明商品售罄

## 1、编写定时任务 ##

在service-task模块发送消息

编写定时任务

http://cron.ciding.cc/

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>/**

&nbsp;* 每天凌晨1点执行

&nbsp;*/

//@Scheduled(cron = "0/30 * * * * ?")

@Scheduled(cron = "0 0 1 * * ?")

public void task1() {

&nbsp;&nbsp;&nbsp; rabbitService.sendMessage(MqConst.EXCHANGE_DIRECT_TASK, MqConst.ROUTING_TASK_1, "");

}</code></pre> <p></p> </td> 
  </tr> 
 </tbody> 
</table>

## 2、监听定时任务信息 ##

在service-activity模块绑定与监听消息，处理缓存逻辑，更新状态位

### 2.1、数据导入缓存 ###

#### 监听消息 ####

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>package com.atguigu.gmall.activity.receiver;

@Component

public class SeckillReceiver {

&nbsp;&nbsp;&nbsp; @Autowired

&nbsp;&nbsp;&nbsp; private RedisTemplate redisTemplate;

&nbsp;&nbsp;&nbsp; @Autowired

&nbsp;&nbsp;&nbsp; private SeckillGoodsMapper seckillGoodsMapper;

&nbsp;&nbsp;&nbsp; @RabbitListener(bindings = @QueueBinding(

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; value = @Queue(value = MqConst.QUEUE_TASK_1),

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; exchange = @Exchange(value = MqConst.EXCHANGE_DIRECT_TASK),

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; key = {MqConst.ROUTING_TASK_1}

&nbsp;&nbsp;&nbsp; ))

&nbsp;&nbsp;&nbsp; public void importItemToRedis(Message message, Channel channel) throws IOException {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; QueryWrapper&lt;SeckillGoods&gt; queryWrapper = new QueryWrapper&lt;&gt;();

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // 查询审核状态1 并且库存数量大于0，当天的商品

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; queryWrapper.eq("status",1).gt("stock_count",0);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; queryWrapper.eq("DATE_FORMAT(start_time,'%Y-%m-%d')", DateUtil.formatDate(new Date()));

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; List&lt;SeckillGoods&gt; list = seckillGoodsMapper.selectList(queryWrapper);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // 将集合数据放入缓存中

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (list!=null &amp;&amp; list.size()&gt;0){

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; for (SeckillGoods seckillGoods : list) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // 使用hash 数据类型保存商品

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // key = seckill:goods field = skuId

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // 判断缓存中是否有当前key

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Boolean flag = redisTemplate.boundHashOps(RedisConst.SECKILL_GOODS).hasKey(seckillGoods.getSkuId().toString());

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (flag){

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // 当前商品已经在缓存中有了！ 所以不需要在放入缓存！

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; continue;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // 商品id为field ，对象为value 放入缓存&nbsp; key = seckill:goods field = skuId value=商品字符串&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; redisTemplate.boundHashOps(RedisConst.SECKILL_GOODS).put(seckillGoods.getSkuId().toString(), seckillGoods);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // hset(seckill:goods,1,{" skuNum 10"})

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // hset(seckill:goods,2,{" skuNum 10"})

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //根据每一个商品的数量把商品按队列的形式放进redis中

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; for (Integer i = 0; i &lt; seckillGoods.getStockCount(); i++) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // key = seckill:stock:skuId

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // lpush key value

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; redisTemplate.boundListOps(RedisConst.SECKILL_STOCK_PREFIX+seckillGoods.getSkuId()).leftPush(seckillGoods.getSkuId().toString());

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // 手动确认接收消息成功

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; channel.basicAck(message.getMessageProperties().getDeliveryTag(), false);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; }

}</code></pre> <p></p> </td> 
  </tr> 
 </tbody> 
</table>

### 2.2、更新状态位 ###

由于我们的秒杀服务是要集群部署service-activity的，我们面临一个问题？RabbitMQ 如何实现对同一个应用的多个节点进行广播呢？

RabbitMQ 只能对绑定到交换机上面的不同队列实现广播，对于同一队列的消费者他们存在竞争关系，同一个消息只会被同一个队列下其中一个消费者接收，达不到广播效果；

我们目前的需求是定时任务发送消息，我们将秒杀商品导入缓存，同事更新集群的状态位，既然RabbitMQ 达不到广播的效果，我们就放弃吗？当然不是，我们想到一种解决方案，通过redis的发布订阅模式来通知其他兄弟节点，这不问题就解决了吗?

过程大致如下

应用启动，多个节点监听同一个队列（此时多个节点是竞争关系，一条消息只会发到其中一个节点上）

消息生产者发送消息，同一条消息只被其中一个节点收到

收到消息的节点通过redis的发布订阅模式来通知其他兄弟节点

接下来配置redis发布与订阅

#### 2.2.1、redis发布与订阅实现 ####

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>package com.atguigu.gmall.activity.redis;

@Configuration

public class RedisChannelConfig {

&nbsp;&nbsp;&nbsp; /*

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; docker exec -it&nbsp; bc92 redis-cli

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; subscribe seckillpush // 订阅 接收消息

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; publish seckillpush admin // 发布消息

&nbsp;&nbsp;&nbsp;&nbsp; */

&nbsp;&nbsp;&nbsp; /**

&nbsp;&nbsp;&nbsp;&nbsp; * 注入订阅主题

&nbsp;&nbsp;&nbsp;&nbsp; * @param connectionFactory redis 链接工厂

&nbsp;&nbsp;&nbsp;&nbsp; * @param listenerAdapter 消息监听适配器

&nbsp;&nbsp;&nbsp;&nbsp; * @return 订阅主题对象

&nbsp;&nbsp;&nbsp;&nbsp; */

&nbsp;&nbsp;&nbsp; @Bean

&nbsp;&nbsp;&nbsp; RedisMessageListenerContainer container(RedisConnectionFactory connectionFactory,

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; MessageListenerAdapter listenerAdapter) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; RedisMessageListenerContainer container = new RedisMessageListenerContainer();

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; container.setConnectionFactory(connectionFactory);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //订阅主题

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; container.addMessageListener(listenerAdapter, new PatternTopic("seckillpush"));

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //这个container 可以添加多个 messageListener

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return container;

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; /**

&nbsp;&nbsp;&nbsp;&nbsp; * 返回消息监听器

&nbsp;&nbsp;&nbsp;&nbsp; * @param receiver 创建接收消息对象

&nbsp;&nbsp;&nbsp;&nbsp; * @return

&nbsp;&nbsp;&nbsp;&nbsp; */

&nbsp;&nbsp;&nbsp; @Bean

&nbsp;&nbsp;&nbsp; MessageListenerAdapter listenerAdapter(MessageReceive receiver) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //这个地方 是给 messageListenerAdapter 传入一个消息接受的处理器，利用反射的方法调用“receiveMessage”

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //也有好几个重载方法，这边默认调用处理器的方法 叫handleMessage 可以自己到源码里面看

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return new MessageListenerAdapter(receiver, "receiveMessage");

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp; @Bean //注入操作数据的template

&nbsp;&nbsp;&nbsp; StringRedisTemplate template(RedisConnectionFactory connectionFactory) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return new StringRedisTemplate(connectionFactory);

&nbsp;&nbsp;&nbsp; }

}</code></pre> <pre style="margin-left:0;text-align:justify;"></pre> </td> 
  </tr> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre style="margin-left:0;text-align:justify;"></pre> <pre><code>package com.atguigu.gmall.activity.redis;

@Component

public class MessageReceive {

&nbsp;&nbsp;&nbsp; /**接收消息的方法*/

&nbsp;&nbsp;&nbsp; public void receiveMessage(String message){

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; System.out.println("----------收到消息了message："+message);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if(!StringUtils.isEmpty(message)) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; /*

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 消息格式

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; skuId:0 表示没有商品

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; skuId:1 表示有商品

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; */
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;// 因为传递过来的数据为 “”6:1””
message = message.replaceAll("\"","");
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; String[] split = StringUtils.split(message, ":");
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (split == null || split.length == 2) {
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; CacheHelper.put(split[0], split[1]);
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }
&nbsp;&nbsp;&nbsp; }

}</code></pre> <p style="margin-left:0;text-align:justify;"></p> <pre style="margin-left:0;text-align:justify;"></pre> <p style="margin-left:0;text-align:justify;"></p> </td> 
  </tr> 
 </tbody> 
</table>

CacheHelper类本地缓存类

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>package com.atguigu.gmall.activity.util;

/**

&nbsp;* 系统缓存类

&nbsp;*/

public class CacheHelper {

&nbsp;&nbsp;&nbsp; /**

&nbsp;&nbsp;&nbsp;&nbsp; * 缓存容器

&nbsp;&nbsp;&nbsp;&nbsp; */

&nbsp;&nbsp;&nbsp; private final static Map&lt;String, Object&gt; cacheMap = new ConcurrentHashMap&lt;String, Object&gt;();

&nbsp;&nbsp;&nbsp; /**

&nbsp;&nbsp;&nbsp;&nbsp; * 加入缓存

&nbsp;&nbsp;&nbsp;&nbsp; *

&nbsp;&nbsp;&nbsp;&nbsp; * @param key

&nbsp;&nbsp;&nbsp;&nbsp; * @param cacheObject

&nbsp;&nbsp;&nbsp;&nbsp; */

&nbsp;&nbsp;&nbsp; public static void put(String key, Object cacheObject) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; cacheMap.put(key, cacheObject);

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; /**

&nbsp;&nbsp;&nbsp;&nbsp; * 获取缓存

&nbsp;&nbsp;&nbsp;&nbsp; *

&nbsp;&nbsp;&nbsp;&nbsp; * @param key

&nbsp;&nbsp;&nbsp;&nbsp; * @return

&nbsp;&nbsp;&nbsp;&nbsp; */

&nbsp;&nbsp;&nbsp; public static Object get(String key) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return cacheMap.get(key);

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; /**

&nbsp;&nbsp;&nbsp;&nbsp; * 清除缓存

&nbsp;&nbsp;&nbsp;&nbsp; *

&nbsp;&nbsp;&nbsp;&nbsp; * @param key

&nbsp;&nbsp;&nbsp;&nbsp; * @return

&nbsp;&nbsp;&nbsp;&nbsp; */

&nbsp;&nbsp;&nbsp; public static void remove(String key) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; cacheMap.remove(key);

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; public static synchronized void removeAll() {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; cacheMap.clear();

&nbsp;&nbsp;&nbsp; }

}</code></pre> <p></p> </td> 
  </tr> 
 </tbody> 
</table>

说明：

1.  RedisChannelConfig 类配置redis监听的主题和消息处理器
2.  MessageReceive 类为消息处理器，消息message为：商品id与状态位，如：1:1 表示商品id为1，状态位为1

#### 2.2.2、redis发布消息 ####

监听已经配置好，接下来我就发布消息，更改秒杀监听器\{ SeckillReceiver \}，如下

完整代码如下

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>@RabbitListener(bindings = @QueueBinding(

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; value = @Queue(value = MqConst.QUEUE_TASK_1, durable = "true"),

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; exchange = @Exchange(value = MqConst.EXCHANGE_DIRECT_TASK, type = ExchangeTypes.DIRECT, durable = "true"),

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; key = {MqConst.ROUTING_TASK_1}

))

public void importItemToRedis(Message message, Channel channel) throws IOException {

&nbsp;&nbsp;&nbsp; //Log.info("importItemToRedis:");

&nbsp;&nbsp;&nbsp; QueryWrapper&lt;SeckillGoods&gt; queryWrapper = new QueryWrapper&lt;&gt;();

&nbsp;&nbsp;&nbsp; queryWrapper.eq("status", 1);

&nbsp;&nbsp;&nbsp; queryWrapper.gt("stock_count", 0);

&nbsp;&nbsp;&nbsp; //当天的秒杀商品导入缓存

&nbsp;&nbsp;&nbsp; queryWrapper.eq("DATE_FORMAT(start_time,'%Y-%m-%d')", DateUtil.formatDate(new Date()));

&nbsp;&nbsp;&nbsp; List&lt;SeckillGoods&gt; list = seckillGoodsMapper.selectList(queryWrapper);

&nbsp;&nbsp;&nbsp; //把数据放在redis中

&nbsp;&nbsp;&nbsp; for (SeckillGoods seckillGoods : list) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (redisTemplate.boundHashOps(RedisConst.SECKILL_GOODS).hasKey(seckillGoods.getSkuId().toString()))

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; continue;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; redisTemplate.boundHashOps(RedisConst.SECKILL_GOODS).put(seckillGoods.getSkuId().toString(), seckillGoods);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //根据每一个商品的数量把商品按队列的形式放进redis中

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; for (int i = 0; i &lt; seckillGoods.getStockCount(); i++) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; redisTemplate.boundListOps(RedisConst.SECKILL_STOCK_PREFIX + seckillGoods.getSkuId()).leftPush(seckillGoods.getSkuId().toString());

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //通知添加与更新状态位，更新为开启

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;redisTemplate.convertAndSend("seckillpush", seckillGoods.getSkuId()+":1");

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; channel.basicAck(message.getMessageProperties().getDeliveryTag(), false);

}</code></pre> <p style="margin-left:0;text-align:justify;"></p> </td> 
  </tr> 
 </tbody> 
</table>

说明：到目前我们就实现了商品信息导入缓存，同时更新状态位的工作

*  # **秒杀列表与详情** #

## **1、封装秒杀列表与详情接口** ##

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <p style="margin-left:0;text-align:justify;">实现类</p> <pre style="margin-left:0;text-align:justify;"></pre> <pre><code>package com.atguigu.gmall.activity.service.impl;

/**

&nbsp;* 服务实现层

&nbsp;*

&nbsp;* @author Administrator

&nbsp;*/

@Service

@Transactional

public class SeckillGoodsServiceImpl implements SeckillGoodsService {

&nbsp;&nbsp;&nbsp; @Autowired

&nbsp;&nbsp;&nbsp; private SeckillGoodsMapper seckillGoodsMapper;

&nbsp;&nbsp;&nbsp; @Autowired

&nbsp;&nbsp;&nbsp; private RedisTemplate redisTemplate;

&nbsp;&nbsp;&nbsp; /**

&nbsp;&nbsp;&nbsp;&nbsp; * 查询全部

&nbsp;&nbsp;&nbsp;&nbsp; */

&nbsp;&nbsp;&nbsp; @Override

&nbsp;&nbsp;&nbsp; public List&lt;SeckillGoods&gt; findAll() {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; List&lt;SeckillGoods&gt; seckillGoodsList = redisTemplate.boundHashOps(RedisConst.SECKILL_GOODS).values();

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return seckillGoodsList;

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; /**

&nbsp;&nbsp;&nbsp;&nbsp; * 根据ID获取实体

&nbsp;&nbsp;&nbsp;&nbsp; *

&nbsp;&nbsp;&nbsp;&nbsp; * @param id

&nbsp;&nbsp;&nbsp;&nbsp; * @return

&nbsp;&nbsp;&nbsp;&nbsp; */

&nbsp;&nbsp;&nbsp; @Override

&nbsp;&nbsp;&nbsp; public SeckillGoods getSeckillGoods(Long id) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return (SeckillGoods) redisTemplate.boundHashOps(RedisConst.SECKILL_GOODS).get(id.toString());

&nbsp;&nbsp;&nbsp; }
}</code></pre> <p style="margin-left:0;text-align:justify;"></p> </td> 
  </tr> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>SeckillGoodsController

package com.atguigu.gmall.activity.controller;

/**

&nbsp;* controller

&nbsp;*

&nbsp;*/

@RestController

@RequestMapping("/api/activity/seckill")

public class SeckillGoodsController {

&nbsp;&nbsp;&nbsp; @Autowired

&nbsp;&nbsp;&nbsp; private SeckillGoodsService seckillGoodsService;

&nbsp;&nbsp;&nbsp; @Autowired

&nbsp;&nbsp;&nbsp; private UserFeignClient userFeignClient;

&nbsp;&nbsp;&nbsp; @Autowired

&nbsp;&nbsp;&nbsp; private ProductFeignClient productFeignClient;

&nbsp;&nbsp;&nbsp; /**

&nbsp;&nbsp;&nbsp;&nbsp; * 返回全部列表

&nbsp;&nbsp;&nbsp;&nbsp; *

&nbsp;&nbsp;&nbsp;&nbsp; * @return

&nbsp;&nbsp;&nbsp;&nbsp; */

&nbsp;&nbsp;&nbsp; @GetMapping("/findAll")

&nbsp;&nbsp;&nbsp; public Result findAll() {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return Result.ok(seckillGoodsService.findAll());

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; /**

&nbsp;&nbsp;&nbsp;&nbsp; * 获取实体

&nbsp;&nbsp;&nbsp;&nbsp; *

&nbsp;&nbsp;&nbsp;&nbsp; * @param skuId

&nbsp;&nbsp;&nbsp;&nbsp; * @return

&nbsp;&nbsp;&nbsp;&nbsp; */

&nbsp;&nbsp;&nbsp; @GetMapping("/getSeckillGoods/{skuId}")

&nbsp;&nbsp;&nbsp; public Result getSeckillGoods(@PathVariable("skuId") Long skuId) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return Result.ok(seckillGoodsService.getSeckillGoods(skuId));

&nbsp;&nbsp;&nbsp; }
}</code></pre> <p></p> </td> 
  </tr> 
 </tbody> 
</table>

## **2、页面渲染** ##

### **2.1、列表页** ###

在 web-all 项目中添加控制器

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre style="margin-left:0;text-align:justify;"></pre> <pre><code>package com.atguigu.gmall.item.controller;

/**

&nbsp;* 秒杀

&nbsp;*

&nbsp;*/

@Controller

public class SeckilController {

&nbsp;&nbsp;&nbsp; @Autowired

&nbsp;&nbsp;&nbsp; private ActivityFeignClient activityFeignClient;

&nbsp;&nbsp;&nbsp; /**

&nbsp;&nbsp;&nbsp;&nbsp; * 秒杀列表

&nbsp;&nbsp;&nbsp;&nbsp; * @param model

&nbsp;&nbsp;&nbsp;&nbsp; * @return

&nbsp;&nbsp;&nbsp;&nbsp; */

&nbsp;&nbsp;&nbsp; @GetMapping("seckill.html")

&nbsp;&nbsp;&nbsp; public String index(Model model) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Result result = activityFeignClient.findAll();

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; model.addAttribute("list", result.getData());

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return "seckill/index";

&nbsp;&nbsp;&nbsp; }
}</code></pre> <p style="margin-left:0;text-align:justify;"></p> </td> 
  </tr> 
 </tbody> 
</table>

列表

页面资源： \\templates\\seckill\\index.html

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>&lt;div class="goods-list" id="item"&gt;

&nbsp;&nbsp; &lt;ul class="seckill" id="seckill"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;li class="seckill-item" th:each="item: ${list}"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="pic" th:@click="|detail(${item.skuId})|"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;img th:src="${item.skuDefaultImg}" alt=''&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="intro"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;span th:text="${item.skuName}"&gt;手机&lt;/span&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class='price'&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;b class='sec-price' th:text="'￥'+${item.costPrice}"&gt;￥0&lt;/b&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;b class='ever-price' th:text="'￥'+${item.price}"&gt;￥0&lt;/b&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class='num'&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div th:text="'已售'+${item.num}"&gt;已售1&lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class='progress'&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class='sui-progress progress-danger'&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;span style='width: 70%;' class='bar'&gt;&lt;/span&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div&gt;剩余

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;b class='owned' th:text="${item.stockCount}"&gt;0&lt;/b&gt;件&lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;a class='sui-btn btn-block btn-buy' th:href="'/seckill/'+${item.skuId}+'.html'" target='_blank'&gt;立即抢购&lt;/a&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/li&gt;

&nbsp;&nbsp; &lt;/ul&gt;

&lt;/div&gt;</code></pre> <p style="margin-left:0;text-align:justify;"></p> </td> 
  </tr> 
 </tbody> 
</table>

### **2.2、详情页** ###

说明：

1.  为了减轻访问压力，秒杀详情我们可以生成静态页面
2.  立即购买，该按钮我们要加以控制，该按钮就是一个链接，页面只是控制能不能点击，一般用户可以绕过去，直接点击秒杀下单，所以我们要加以控制，在秒杀没有开始前，不能进入秒杀页面

#### **2.2.1、详情页** ####

在SeckilController添加方法

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>/**

&nbsp;* 秒杀详情

&nbsp;* @param skuId

&nbsp;* @param model

&nbsp;* @return

&nbsp;*/

@GetMapping("seckill/{skuId}.html")

public String getItem(@PathVariable Long skuId, Model model){

&nbsp;&nbsp;&nbsp; // 通过skuId 查询skuInfo

&nbsp;&nbsp;&nbsp; Result result = activityFeignClient.getSeckillGoods(skuId);

&nbsp;&nbsp;&nbsp; model.addAttribute("item", result.getData());

&nbsp;&nbsp;&nbsp; return "seckill/item";

}</code></pre> <pre style="margin-left:0;text-align:justify;"></pre> </td> 
  </tr> 
 </tbody> 
</table>

详情页面

页面资源： \\templates\\seckill\\item.html

基本信息渲染

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>&lt;div class="product-info"&gt;

&nbsp;&nbsp; &lt;div class="fl preview-wrap"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;!--放大镜效果--&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="zoom"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;!--默认第一个预览--&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div id="preview" class="spec-preview"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;span class="jqzoom"&gt;&lt;img th:jqimg="${item.skuDefaultImg}" th:src="${item.skuDefaultImg}" width="400" height="400"/&gt;&lt;/span&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp; &lt;div class="fr itemInfo-wrap"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="sku-name"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;h4 th:text="${item.skuName}"&gt;三星&lt;/h4&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="news"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;span&gt;&lt;img src="/img/_/clock.png"/&gt;品优秒杀&lt;/span&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;span class="overtime"&gt;{
       {timeTitle}}：{
       {timeString}}&lt;/span&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="summary"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="summary-wrap"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="fl title"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;i&gt;秒杀价&lt;/i&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="fl price"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;i&gt;¥&lt;/i&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;em th:text="${item.costPrice}"&gt;0&lt;/em&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;span th:text="'原价：'+${item.price}"&gt;原价：0&lt;/span&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="fr remark"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 剩余库存：&lt;span th:text="${item.stockCount}"&gt;0&lt;/span&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="summary-wrap"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="fl title"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;i&gt;促　　销&lt;/i&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="fl fix-width"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;i class="red-bg"&gt;加价购&lt;/i&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;em class="t-gray"&gt;满999.00另加20.00元，或满1999.00另加30.00元，或满2999.00另加40.00元，即可在购物车换购热销商品&lt;/em&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="support"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="summary-wrap"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="fl title"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;i&gt;支　　持&lt;/i&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="fl fix-width"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;em class="t-gray"&gt;以旧换新，闲置手机回收 4G套餐超值抢 礼品购&lt;/em&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="summary-wrap"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="fl title"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;i&gt;配 送 至&lt;/i&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="fl fix-width"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="clearfix choose"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="summary-wrap"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="fl title"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="fl"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;ul class="btn-choose unstyled"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;li&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;a href="javascript:" v-if="isBuy" @click="queue()" class="sui-btn&nbsp; btn-danger addshopcar"&gt;立即抢购&lt;/a&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;a href="javascript:" v-if="!isBuy" class="sui-btn&nbsp; btn-danger addshopcar" disabled="disabled"&gt;立即抢购&lt;/a&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/li&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/ul&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp; &lt;/div&gt;

&lt;/div&gt;</code></pre> <p style="margin-left:0;text-align:justify;"></p> </td> 
  </tr> 
 </tbody> 
</table>

倒计时处理

思路：页面初始化时，拿到商品秒杀开始时间和结束时间等信息，实现距离开始时间和活动倒计时。

活动未开始时，显示距离开始时间倒计时；

活动开始后，显示活动结束时间倒计时。

倒计时代码片段

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>init() {

// debugger

// 计算出剩余时间

var startTime = new Date(this.data.startTime).getTime();

var endTime = new Date(this.data.endTime).getTime();

var nowTime = new Date().getTime();

var secondes = 0;

// 还未开始抢购

if(startTime &gt; nowTime) {

&nbsp;&nbsp; this.timeTitle = '距离开始'

&nbsp;&nbsp; secondes = Math.floor((startTime - nowTime) / 1000);

}

if(nowTime &gt; startTime &amp;&amp; nowTime &lt; endTime) {

&nbsp;&nbsp; this.isBuy = true

&nbsp;&nbsp; this.timeTitle = '距离结束'

&nbsp;&nbsp; secondes = Math.floor((endTime - nowTime) / 1000);

}

if(nowTime &gt; endTime) {

&nbsp;&nbsp; this.timeTitle = '抢购结束'

&nbsp;&nbsp; secondes = 0;

}

const timer = setInterval(() =&gt; {

&nbsp;&nbsp; secondes = secondes - 1

&nbsp;&nbsp; this.timeString = this.convertTimeString(secondes)

}, 1000);

// 通过$once来监听定时器，在beforeDestroy可以被清除。

this.$once('hook:beforeDestroy', () =&gt; {

&nbsp;&nbsp; clearInterval(timer);

})

},</code></pre> <p></p> </td> 
  </tr> 
 </tbody> 
</table>

时间转换方法

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>convertTimeString(allseconds) {

&nbsp;&nbsp;&nbsp; if(allseconds &lt;= 0) return '00:00:00'

&nbsp;&nbsp;&nbsp; // 计算天数

&nbsp;&nbsp;&nbsp; var days = Math.floor(allseconds / (60 * 60 * 24));

&nbsp;&nbsp;&nbsp; // 小时

&nbsp;&nbsp;&nbsp; var hours = Math.floor((allseconds - (days * 60 * 60 * 24)) / (60 * 60));

&nbsp;&nbsp;&nbsp; // 分钟

&nbsp;&nbsp;&nbsp; var minutes = Math.floor((allseconds - (days * 60 * 60 * 24) - (hours * 60 * 60)) / 60);

&nbsp;&nbsp;&nbsp; // 秒

&nbsp;&nbsp;&nbsp; var seconds = allseconds - (days * 60 * 60 * 24) - (hours * 60 * 60) - (minutes * 60);

&nbsp;&nbsp;&nbsp; //拼接时间

&nbsp;&nbsp;&nbsp; var timString = "";

&nbsp;&nbsp;&nbsp; if (days &gt; 0) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; timString = days + "天:";

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; return timString += hours + ":" + minutes + ":" + seconds;

}</code></pre> <p></p> </td> 
  </tr> 
 </tbody> 
</table>

#### **2.2.2、秒杀按钮控制** ####

1，我们通过前面页面时间控制

2，通过服务器端控制，如何控制呢?

在进入秒杀功能前，我们加一个下单码，只有你获取到该下单码，才能够进入秒杀方法进行秒杀

获取秒杀码

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>SeckillGoodsController
/**

&nbsp;* 获取下单码

&nbsp;* @param skuId

&nbsp;* @return

&nbsp;*/

@GetMapping("auth/getSeckillSkuIdStr/{skuId}")

public Result getSeckillSkuIdStr(@PathVariable("skuId") Long skuId, HttpServletRequest request) {

&nbsp;&nbsp;&nbsp; String userId = AuthContextHolder.getUserId(request);

&nbsp;&nbsp;&nbsp; SeckillGoods seckillGoods = seckillGoodsService.getSeckillGoods(skuId);

&nbsp;&nbsp;&nbsp; if (null != seckillGoods) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Date curTime = new Date();

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (DateUtil.dateCompare(seckillGoods.getStartTime(), curTime) &amp;&amp; DateUtil.dateCompare(curTime, seckillGoods.getEndTime())) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //可以动态生成，放在redis缓存

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; String skuIdStr = MD5.encrypt(userId);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return Result.ok(skuIdStr);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; return Result.fail().message("获取下单码失败");

}</code></pre> <p style="margin-left:0;text-align:justify;"></p> </td> 
  </tr> 
 </tbody> 
</table>

说明：只有在商品秒杀时间范围内，才能获取下单码，这样我们就有效控制了用户非法秒杀，下单码我们可以根据业务自定义规则，目前我们定义为当前用户id MD5加密。

前端页面

页面获取下单码，进入秒杀场景

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>queue() {

&nbsp;&nbsp;&nbsp; debugger

&nbsp;&nbsp;&nbsp; seckill.getSeckillSkuIdStr(this.skuId).then(response =&gt; {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var skuIdStr = response.data.data

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; window.location.href = '/seckill/queue.html?skuId='+this.skuId+'&amp;skuIdStr='+skuIdStr

&nbsp;&nbsp;&nbsp; })

},</code></pre> <p style="margin-left:0;text-align:justify;"></p> </td> 
  </tr> 
 </tbody> 
</table>

前端js完整代码如下

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>&lt;script src="/js/api/seckill.js"&gt;&lt;/script&gt;

&lt;script th:inline="javascript"&gt;

&nbsp;&nbsp; var item = new Vue({

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; el: '#item',

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; data: {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; skuId: [[${item.skuId}]],

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; data: [[${item}]],

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; timeTitle: '距离开始',

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; timeString: '00:00:00',

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; isBuy: false

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; },

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; created() {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.init()

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; },

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; methods: {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; init() {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // debugger

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // 计算出剩余时间

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var startTime = new Date(this.data.startTime).getTime();

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var endTime = new Date(this.data.endTime).getTime();

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var nowTime = new Date().getTime();

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var secondes = 0;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // 还未开始抢购

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if(startTime &gt; nowTime) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.timeTitle = '距离开始'

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; secondes = Math.floor((startTime - nowTime) / 1000);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if(nowTime &gt; startTime &amp;&amp; nowTime &lt; endTime) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.isBuy = true

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.timeTitle = '距离结束'

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; secondes = Math.floor((endTime - nowTime) / 1000);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if(nowTime &gt; endTime) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.timeTitle = '抢购结束'

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; secondes = 0;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; const timer = setInterval(() =&gt; {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; secondes = secondes - 1

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.timeString = this.convertTimeString(secondes)

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }, 1000);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // 通过$once来监听定时器，在beforeDestroy钩子可以被清除。

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.$once('hook:beforeDestroy', () =&gt; {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; clearInterval(timer);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; })

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; },

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; queue() {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; debugger

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; seckill.getSeckillSkuIdStr(this.skuId).then(response =&gt; {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var skuIdStr = response.data.data

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; window.location.href = '/seckill/queue.html?skuId='+this.skuId+'&amp;skuIdStr='+skuIdStr

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; })

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; },

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; convertTimeString(allseconds) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if(allseconds &lt;= 0) return '00:00:00'

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // 计算天数

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var days = Math.floor(allseconds / (60 * 60 * 24));

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // 小时

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var hours = Math.floor((allseconds - (days * 60 * 60 * 24)) / (60 * 60));

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // 分钟

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var minutes = Math.floor((allseconds - (days * 60 * 60 * 24) - (hours * 60 * 60)) / 60);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // 秒

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var seconds = allseconds - (days * 60 * 60 * 24) - (hours * 60 * 60) - (minutes * 60);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //拼接时间

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var timString = "";

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (days &gt; 0) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; timString = days + "天:";

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return timString += hours + ":" + minutes + ":" + seconds;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp; })

&lt;/script&gt;</code></pre> <p></p> </td> 
  </tr> 
 </tbody> 
</table>

### **3.3、进入秒杀** ###

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>SeckilController
/**

&nbsp;* 秒杀排队

&nbsp;* @param skuId

&nbsp;* @param skuIdStr

&nbsp;* @param request

&nbsp;* @return

&nbsp;*/

@GetMapping("seckill/queue.html")

public String queue(@RequestParam(name = "skuId") Long skuId,

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; @RequestParam(name = "skuIdStr") String skuIdStr,

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; HttpServletRequest request){

&nbsp;&nbsp;&nbsp; request.setAttribute("skuId", skuId);

&nbsp;&nbsp; &nbsp;request.setAttribute("skuIdStr", skuIdStr);

&nbsp;&nbsp;&nbsp; return "seckill/queue";

}</code></pre> <p style="margin-left:0;text-align:justify;"></p> </td> 
  </tr> 
 </tbody> 
</table>

页面

页面资源： \\templates\\seckill\\queue.html

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>&lt;div class="cart py-container" id="item"&gt;

&nbsp;&nbsp;&nbsp; &lt;div class="seckill_dev" v-if="show == 1"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 排队中...

&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp; &lt;div class="seckill_dev" v-if="show == 2"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {
       {message}}

&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp; &lt;div class="seckill_dev" v-if="show == 3"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 抢购成功&amp;nbsp;&amp;nbsp;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;a href="/seckill/trade.html" target="_blank"&gt;去下单&lt;/a&gt;

&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&nbsp;&nbsp;&nbsp; &lt;div class="seckill_dev" v-if="show == 4"&gt;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 抢购成功&amp;nbsp;&amp;nbsp;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;a href="/myOrder.html" target="_blank"&gt;我的订单&lt;/a&gt;

&nbsp;&nbsp;&nbsp; &lt;/div&gt;

&lt;/div&gt;</code></pre> <p></p> </td> 
  </tr> 
 </tbody> 
</table>

Js部分

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>&lt;script src="/js/api/seckill.js"&gt;&lt;/script&gt;

&lt;script th:inline="javascript"&gt;

&nbsp;&nbsp;&nbsp; var item = new Vue({

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; el: '#item',

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; data: {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; skuId: [[${skuId}]],

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; skuIdStr: [[${skuIdStr}]],

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; data: {},

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; show: 1,

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; code: 211,

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; message: '',

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; isCheckOrder: false

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; },

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; mounted() {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; const timer = setInterval(() =&gt; {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if(this.code != 211) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; clearInterval(timer);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.checkOrder()

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }, 3000);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // 通过$once来监听定时器，在beforeDestroy钩子可以被清除。

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.$once('hook:beforeDestroy', () =&gt; {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; clearInterval(timer);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; })

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; },

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; created() {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.saveOrder();

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; },

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; methods: {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; saveOrder() {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; seckill.seckillOrder(this.skuId, this.skuIdStr).then(response =&gt; {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; debugger

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; console.log(JSON.stringify(response))

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if(response.data.code == 200) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.isCheckOrder = true

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; } else {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.show = 2

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.message = response.data.message

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; })

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; },

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; checkOrder() {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if(!this.isCheckOrder) return

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; seckill.checkOrder(this.skuId).then(response =&gt; {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; debugger

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.data = response.data.data

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.code = response.data.code

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; console.log(JSON.stringify(this.data))

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //排队中

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if(response.data.code == 211) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.show = 1

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; } else {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //秒杀成功

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if(response.data.code == 215) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.show = 3

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; this.message = response.data.message

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; } else {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if(response.data.code == 218) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; } else {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; })

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; })

&lt;/script&gt;</code></pre> <p style="margin-left:0;text-align:justify;"></p> </td> 
  </tr> 
 </tbody> 
</table>

说明：该页面直接通过controller返回页面，进入页面后显示排队中，然后通过异步执行秒杀下单，提交成功，页面通过轮询后台方法查询秒杀状态

# 秒杀业务 #

秒杀的主要目的就是获取一个下单资格，拥有下单资格就可以去下单支付，获取下单资格后的流程就与正常下单流程一样，只是没有购物车这一步，总结起来就是，秒杀根据库存获取下单资格，拥有下单资格进入下单页面（选择地址，支付方式，提交订单，然后支付订单）

步骤：

1.  校验下单码，只有正确获得下单码的请求才是合法请求
2.  校验状态位state，

State为null，说明请求非法；

State为0说明已经售罄；

State为1，说明可以抢购

状态位的好处，他是在内存中判断，效率极高，如果售罄，直接就返回了，不会给服务器造成太大压力

1.  前面条件都成立，将秒杀用户加入队列，然后直接返回
2.  前端轮询秒杀状态，查询秒杀结果

## 1、秒杀下单 ##

SeckillGoodsController添加方法

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>/**

&nbsp;* 根据用户和商品ID实现秒杀下单

&nbsp;*

&nbsp;* @param skuId

&nbsp;* @return

&nbsp;*/

@PostMapping("auth/seckillOrder/{skuId}")

public Result seckillOrder(@PathVariable("skuId") Long skuId, HttpServletRequest request) throws Exception {

&nbsp;&nbsp;&nbsp; //校验下单码（抢购码规则可以自定义）

&nbsp;&nbsp;&nbsp; String userId = AuthContextHolder.getUserId(request);

&nbsp;&nbsp;&nbsp; String skuIdStr = request.getParameter("skuIdStr");

&nbsp;&nbsp;&nbsp; if (!skuIdStr.equals(MD5.encrypt(userId))) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //请求不合法

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return Result.build(null, ResultCodeEnum.SECKILL_ILLEGAL);

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; //产品标识， 1：可以秒杀 &nbsp;&nbsp;&nbsp;0：秒杀结束

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; String state = (String) CacheHelper.get(skuId.toString());

&nbsp;&nbsp;&nbsp; if (StringUtils.isEmpty(state)) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //请求不合法

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return Result.build(null, ResultCodeEnum.SECKILL_ILLEGAL);

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; if ("1".equals(state)) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //用户记录

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; UserRecode userRecode = new UserRecode();

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; userRecode.setUserId(userId);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; userRecode.setSkuId(skuId);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; rabbitService.sendMessage(MqConst.EXCHANGE_DIRECT_SECKILL_USER, MqConst.ROUTING_SECKILL_USER, userRecode);

&nbsp;&nbsp;&nbsp; } else {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //已售罄

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return Result.build(null, ResultCodeEnum.SECKILL_FINISH);

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; return Result.ok();

}</code></pre> <p></p> </td> 
  </tr> 
 </tbody> 
</table>

## 2、秒杀下单监听 ##

思路：

1.  首先判断产品状态位，我们前面不是已经判断过了吗？因为产品可能随时售罄，mq队列里面可能堆积了十万数据，但是已经售罄了，那么后续流程就没有必要再走了；
2.  判断用户是否已经下过订单，这个地方就是控制用户重复下单，同一个用户只能抢购一个下单资格，怎么控制呢？很简单，我们可以利用setnx控制用户，当用户第一次进来时，返回true，可以抢购，以后进入返回false，直接返回，过期时间可以根据业务自定义，这样用户这一段就控制住了
3.  获取队列中的商品，如果能够获取，则商品有库存，可以下单，如果获取的商品id为空，则商品售罄，商品售罄我们要第一时间通知兄弟节点，更新状态位，所以在这里发送redis广播
4.  将订单记录放入redis缓存，说明用户已经获得下单资格，秒杀成功

SeckillReceiver类添加监听方法

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <p style="margin-left:0;text-align:justify;"></p> <pre><code>@Autowired
private SeckillGoodsService seckillGoodsService;

/**

&nbsp;* 秒杀用户加入队列

&nbsp;*

&nbsp;* @param message

&nbsp;* @param channel

&nbsp;* @throws IOException

&nbsp;*/

@RabbitListener(bindings = @QueueBinding(

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; value = @Queue(value = MqConst.QUEUE_SECKILL_USER, durable = "true"),

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; exchange = @Exchange(value = MqConst.EXCHANGE_DIRECT_SECKILL_USER, type = ExchangeTypes.DIRECT, durable = "true"),

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; key = {MqConst.ROUTING_SECKILL_USER}

))

public void seckill(UserRecode userRecode, Message message, Channel channel) throws IOException {

&nbsp;&nbsp;&nbsp; if (null != userRecode) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //Log.info("paySuccess:"+ JSONObject.toJSONString(userRecode));

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //预下单

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; seckillGoodsService.seckillOrder(userRecode.getSkuId(), userRecode.getUserId());

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //确认收到消息

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; channel.basicAck(message.getMessageProperties().getDeliveryTag(), false);

&nbsp;&nbsp;&nbsp; }

}</code></pre> <pre style="margin-left:0;text-align:justify;"></pre> </td> 
  </tr> 
 </tbody> 
</table>

预下单接口

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <p style="margin-left:0;text-align:justify;"></p> <pre><code>实现类

/***

&nbsp;* 创建订单

&nbsp;* @param skuId

&nbsp;* @param userId

&nbsp;*/

@Override

public void seckillOrder(Long skuId, String userId) {

&nbsp;&nbsp;&nbsp; //产品状态位， 1：可以秒杀 0：秒杀结束

&nbsp;&nbsp;&nbsp; String state = (String) CacheHelper.get(skuId.toString());

&nbsp;&nbsp;&nbsp; if("0".equals(state)) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //已售罄

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return;

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; //判断用户是否下过单

&nbsp;&nbsp;&nbsp; boolean isExist = redisTemplate.opsForValue().setIfAbsent(RedisConst.SECKILL_USER + userId, skuId, RedisConst.SECKILL__TIMEOUT, TimeUnit.SECONDS);

&nbsp;&nbsp;&nbsp; if (!isExist) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return;

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; //获取队列中的商品，如果能够获取，则商品存在，可以下单

&nbsp;&nbsp;&nbsp; String goodsId = (String) redisTemplate.boundListOps(RedisConst.SECKILL_STOCK_PREFIX + skuId).rightPop();

&nbsp;&nbsp;&nbsp; if (StringUtils.isEmpty(goodsId)) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //商品售罄，更新状态位

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; redisTemplate.convertAndSend("seckillpush", skuId+":0");

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //已售罄

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return;

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; //订单记录

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; OrderRecode orderRecode = new OrderRecode();

&nbsp;&nbsp;&nbsp; orderRecode.setUserId(userId);

&nbsp;&nbsp;&nbsp; orderRecode.setSeckillGoods(this.getSeckillGoods(skuId));

&nbsp;&nbsp;&nbsp; orderRecode.setNum(1);

&nbsp;&nbsp;&nbsp; //生成下单码

&nbsp;&nbsp;&nbsp; orderRecode.setOrderStr(MD5.encrypt(userId+skuId));

&nbsp;&nbsp;&nbsp; //订单数据存入Reids

&nbsp;&nbsp;&nbsp; redisTemplate.boundHashOps(RedisConst.SECKILL_ORDERS).put(orderRecode.getUserId(), orderRecode);
//更新库存

this.updateStockCount(orderRecode.getSeckillGoods().getSkuId());

}</code></pre> <pre style="margin-left:0;text-align:justify;"></pre> <p style="margin-left:0;text-align:justify;"></p> </td> 
  </tr> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>package com.atguigu.gmall.model.activity;

@Data

public class OrderRecode implements Serializable {

&nbsp;&nbsp; private static final long serialVersionUID = 1L;

&nbsp;&nbsp; private String userId;

&nbsp;&nbsp; private SeckillGoods seckillGoods;

&nbsp;&nbsp; private Integer num;

&nbsp;&nbsp; private String orderStr;

}</code></pre> <p></p> </td> 
  </tr> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>/**

&nbsp;* 更新库存

&nbsp;* @param skuId

&nbsp;*/

private void updateStockCount(Long skuId) {

&nbsp;&nbsp;&nbsp; //更新库存，批量更新，用于页面显示，以实际扣减库存为准

&nbsp;&nbsp;&nbsp; Long stockCount = redisTemplate.boundListOps(RedisConst.SECKILL_STOCK_PREFIX + skuId).size();

&nbsp;&nbsp;&nbsp; if (stockCount % 2 == 0) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //商品卖完,同步数据库

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; SeckillGoods seckillGoods = this.getSeckillGoods(skuId);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; seckillGoods.setStockCount(stockCount.intValue());

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; seckillGoodsMapper.updateById(seckillGoods);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //更新缓存&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; redisTemplate.boundHashOps(RedisConst.SECKILL_GOODS).put(seckillGoods.getSkuId().toString(), seckillGoods);

&nbsp;&nbsp;&nbsp; }

}</code></pre> <p style="margin-left:0;text-align:justify;"></p> </td> 
  </tr> 
 </tbody> 
</table>

## 3、页面轮询接口 ##

该接口判断用户秒杀状态

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre style="margin-left:0;text-align:justify;"><span style="background-color:#FFFFFF;"><span style="background-color:#FFFFFF;"><span style="color:#000000;">SeckillGoodsService</span></span><span style="background-color:#FFFFFF;"><span style="color:#000000;">接口</span></span></span></pre> </td> 
  </tr> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>/***
&nbsp;* 根据用户ID查看订单信息
&nbsp;* @param userId
&nbsp;* @return
&nbsp;*/
@Override
public Result checkOrder(Long skuId, String userId) {
&nbsp;&nbsp;&nbsp; // 用户在缓存中存在，有机会秒杀到商品
&nbsp;&nbsp;&nbsp; boolean isExist =redisTemplate.hasKey(RedisConst.SECKILL_USER + userId);
&nbsp;&nbsp;&nbsp; if (isExist) {
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //判断用户是否正在排队
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //判断用户是否下单
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; boolean isHasKey = redisTemplate.boundHashOps(RedisConst.SECKILL_ORDERS).hasKey(userId);
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (isHasKey) {
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //抢单成功
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; OrderRecode orderRecode = (OrderRecode) redisTemplate.boundHashOps(RedisConst.SECKILL_ORDERS).get(userId);
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; // 秒杀成功！
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return Result.build(orderRecode, ResultCodeEnum.SECKILL_SUCCESS);
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }
&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; //判断是否下单
&nbsp;&nbsp;&nbsp; boolean isExistOrder = redisTemplate.boundHashOps(RedisConst.SECKILL_ORDERS_USERS).hasKey(userId);
&nbsp;&nbsp;&nbsp; if(isExistOrder) {
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; String orderId = (String)redisTemplate.boundHashOps(RedisConst.SECKILL_ORDERS_USERS).get(userId);
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return Result.build(orderId, ResultCodeEnum.SECKILL_ORDER_SUCCESS);
&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; String state = (String) CacheHelper.get(skuId.toString());
&nbsp;&nbsp;&nbsp; if("0".equals(state)) {
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //已售罄 抢单失败
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return Result.build(null, ResultCodeEnum.SECKILL_FAIL);
&nbsp;&nbsp;&nbsp; }
&nbsp;&nbsp;&nbsp; //正在排队中
&nbsp;&nbsp;&nbsp; return Result.build(null, ResultCodeEnum.SECKILL_RUN);
}</code></pre> <p style="margin-left:0;text-align:justify;"></p> </td> 
  </tr> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre style="margin-left:0;text-align:justify;"><span style="background-color:#FFFFFF;"><span style="background-color:#FFFFFF;"><span style="color:#000000;">SeckillGoodsController</span></span></span></pre> <pre><code>/**

&nbsp;* 查询秒杀状态

&nbsp;* @return

&nbsp;*/

@GetMapping(value = "auth/checkOrder/{skuId}")

public Result checkOrder(@PathVariable("skuId") Long skuId, HttpServletRequest request) {

&nbsp;&nbsp;&nbsp; //当前登录用户

&nbsp;&nbsp;&nbsp; String userId = AuthContextHolder.getUserId(request);

&nbsp;&nbsp;&nbsp; return seckillGoodsService.checkOrder(skuId, userId);

}</code></pre> <p></p> </td> 
  </tr> 
 </tbody> 
</table>

## 4、轮询排队页面 ##

该页面有四种状态：

1.  排队中
2.  各种提示（非法、已售罄等）
3.  抢购成功，去下单
4.  抢购成功，已下单，显示我的订单

抢购成功，页面显示去下单，跳转下单确认页面

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre style="margin-left:0;text-align:justify;"><span style="background-color:#FFFFFF;"><span style="background-color:#efefef;"><span style="color:#000000;">&lt;</span></span><strong><span style="background-color:#efefef;"><span style="color:#000080;">div </span></span></strong><strong><span style="background-color:#efefef;"><span style="color:#0000FF;">class</span></span></strong><strong><span style="background-color:#efefef;"><span style="color:#008000;">="seckill_dev" </span></span></strong><strong><span style="background-color:#efefef;"><span style="color:#0000FF;">v-if</span></span></strong><strong><span style="background-color:#efefef;"><span style="color:#008000;">="show == 3"</span></span></strong><span style="background-color:#efefef;"><span style="color:#000000;">&gt;</span></span>

&nbsp;&nbsp;&nbsp; <span style="background-color:#FFFFFF;"><span style="color:#000000;">抢购成功</span></span><strong><span style="background-color:#FFFFFF;"><span style="color:#0000FF;">&amp;nbsp;&amp;nbsp;

&nbsp;&nbsp;&nbsp; </span></span></strong><span style="background-color:#efefef;"><span style="color:#000000;">&lt;</span></span><strong><span style="background-color:#efefef;"><span style="color:#000080;">a </span></span></strong><strong><span style="background-color:#efefef;"><span style="color:#0000FF;">href</span></span></strong><strong><span style="background-color:#efefef;"><span style="color:#008000;">="/seckill/trade.html" </span></span></strong><strong><span style="background-color:#efefef;"><span style="color:#0000FF;">target</span></span></strong><strong><span style="background-color:#efefef;"><span style="color:#008000;">="_blank"</span></span></strong><span style="background-color:#efefef;"><span style="color:#000000;">&gt;</span></span><span style="background-color:#FFFFFF;"><span style="color:#000000;">去下单</span></span><span style="background-color:#efefef;"><span style="color:#000000;">&lt;/</span></span><strong><span style="background-color:#efefef;"><span style="color:#000080;">a</span></span></strong><span style="background-color:#efefef;"><span style="color:#000000;">&gt;</span></span>

## 5、下单页面 ##

![c5efe98204f94589a7086f8b25697d05.png][]

我们已经把下单信息记录到redis缓存中，所以接下来我们要组装下单页数据

### 5.1、下单页数据接口封装 ###

Service-activity模块

</span></span></span></pre> <pre><code>  @Autowired

private RedisTemplate redisTemplate;
/**

&nbsp;* 秒杀确认订单

&nbsp;* @param request

&nbsp;* @return

&nbsp;*/

@GetMapping("auth/trade")

public Result trade(HttpServletRequest request) {

&nbsp;&nbsp;&nbsp; // 获取到用户Id

&nbsp;&nbsp;&nbsp; String userId = AuthContextHolder.getUserId(request);

&nbsp;&nbsp;&nbsp; // 先得到用户想要购买的商品！

&nbsp;&nbsp;&nbsp; OrderRecode orderRecode = (OrderRecode) redisTemplate.boundHashOps(RedisConst.SECKILL_ORDERS).get(userId);

&nbsp;&nbsp;&nbsp; if (null == orderRecode) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return Result.fail().message("非法操作");

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; SeckillGoods seckillGoods = orderRecode.getSeckillGoods();

&nbsp;&nbsp;&nbsp; //获取用户地址

&nbsp;&nbsp;&nbsp; List&lt;UserAddress&gt; userAddressList = userFeignClient.findUserAddressListByUserId(userId);

&nbsp;&nbsp;&nbsp; // 声明一个集合来存储订单明细

&nbsp;&nbsp;&nbsp; ArrayList&lt;OrderDetail&gt; detailArrayList = new ArrayList&lt;&gt;();

&nbsp;&nbsp;&nbsp; OrderDetail orderDetail = new OrderDetail();

&nbsp;&nbsp;&nbsp; orderDetail.setSkuId(seckillGoods.getSkuId());

&nbsp;&nbsp;&nbsp; orderDetail.setSkuName(seckillGoods.getSkuName());

&nbsp;&nbsp;&nbsp; orderDetail.setImgUrl(seckillGoods.getSkuDefaultImg());

&nbsp;&nbsp;&nbsp; orderDetail.setSkuNum(orderRecode.getNum());

&nbsp;&nbsp;&nbsp; orderDetail.setOrderPrice(seckillGoods.getCostPrice());

&nbsp;&nbsp;&nbsp; // 添加到集合

&nbsp;&nbsp;&nbsp; detailArrayList.add(orderDetail);

&nbsp;&nbsp;&nbsp; // 计算总金额

&nbsp;&nbsp;&nbsp; OrderInfo orderInfo = new OrderInfo();

&nbsp;&nbsp;&nbsp; orderInfo.setOrderDetailList(detailArrayList);

&nbsp;&nbsp;&nbsp; orderInfo.sumTotalAmount();

&nbsp;&nbsp;&nbsp; Map&lt;String, Object&gt; result = new HashMap&lt;&gt;();

&nbsp;&nbsp;&nbsp; result.put("userAddressList", userAddressList);

&nbsp;&nbsp;&nbsp; result.put("detailArrayList", detailArrayList);

&nbsp;&nbsp;&nbsp; // 保存总金额

&nbsp;&nbsp;&nbsp; result.put("totalAmount", orderInfo.getTotalAmount());

&nbsp;&nbsp;&nbsp; return Result.ok(result);

}</code></pre> <p></p> </td> 
  </tr> 
 </tbody> 
</table>

### 5.2、web-all调用接口 ###

</span></pre> <pre><code>/**

&nbsp;* 确认订单

&nbsp;* @param model

&nbsp;* @return

&nbsp;*/

@GetMapping("seckill/trade.html")

public String trade(Model model) {

&nbsp;&nbsp;&nbsp; Result&lt;Map&lt;String, Object&gt;&gt; result = activityFeignClient.trade();

&nbsp;&nbsp;&nbsp; if(result.isOk()) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; model.addAllAttributes(result.getData());

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return "seckill/trade";

&nbsp;&nbsp;&nbsp; } else {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; model.addAttribute("message",result.getMessage());

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return "seckill/fail";

&nbsp;&nbsp;&nbsp; }

}</code></pre> <p></p> </td> 
  </tr> 
 </tbody> 
</table>

页面资源： \\templates\\seckill\\trade.html；\\templates\\seckill\\fail.html

### 5.2、下单确认页面 ###

该页面与正常下单页面类似，只是下单提交接口不一样，因为秒杀下单不需要正常下单的各种判断，因此我们要在订单服务提供一个秒杀下单接口，直接下单

Service-order模块提供秒杀下单接口

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre style="margin-left:0;text-align:justify;"><span style="background-color:#FFFFFF;"><span style="background-color:#FFFFFF;"><span style="color:#000000;">OrderApiController</span></span></span></pre> <pre><code>/**

&nbsp;* 秒杀提交订单，秒杀订单不需要做前置判断，直接下单

&nbsp;* @param orderInfo

&nbsp;* @return

&nbsp;*/

@PostMapping("inner/seckill/submitOrder")

public Long submitOrder(@RequestBody OrderInfo orderInfo) {

&nbsp;&nbsp;&nbsp; Long orderId = orderService.saveOrderInfo(orderInfo);

&nbsp;&nbsp;&nbsp; return orderId;

}</code></pre> <p></p> </td> 
  </tr> 
 </tbody> 
</table>

Service-activity模块秒杀下单

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre style="margin-left:0;text-align:justify;"><span style="background-color:#FFFFFF;"><span style="background-color:#FFFFFF;"><span style="color:#000000;">SeckillGoodsController</span></span></span></pre> <p style="margin-left:0;text-align:justify;"></p> <pre><code>@Autowired
private OrderFeignClient orderFeignClient;

/**

&nbsp;* 秒杀提交订单

&nbsp;*

&nbsp;* @param orderInfo

&nbsp;* @return

&nbsp;*/

@PostMapping("auth/submitOrder")

public Result submitOrder(@RequestBody OrderInfo orderInfo, HttpServletRequest request) {

&nbsp;&nbsp;&nbsp; String userId = AuthContextHolder.getUserId(request);

&nbsp;&nbsp;&nbsp; OrderRecode orderRecode = (OrderRecode) redisTemplate.boundHashOps(RedisConst.SECKILL_ORDERS).get(userId);

&nbsp;&nbsp;&nbsp; if (null == orderRecode) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return Result.fail().message("非法操作");

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; orderInfo.setUserId(Long.parseLong(userId));

&nbsp;&nbsp;&nbsp; Long orderId = orderFeignClient.submitOrder(orderInfo);

&nbsp;&nbsp;&nbsp; if (null == orderId) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return Result.fail().message("下单失败，请重新操作");

&nbsp;&nbsp;&nbsp; }

&nbsp;&nbsp;&nbsp; //删除下单信息

&nbsp;&nbsp;&nbsp; redisTemplate.boundHashOps(RedisConst.SECKILL_ORDERS).delete(userId);

&nbsp;&nbsp;&nbsp; //下单记录

&nbsp;&nbsp;&nbsp; redisTemplate.boundHashOps(RedisConst.SECKILL_ORDERS_USERS).put(userId, orderId.toString());

&nbsp;&nbsp;&nbsp; return Result.ok(orderId);

}</code></pre> <pre style="margin-left:0;text-align:justify;"></pre> </td> 
  </tr> 
 </tbody> 
</table>

说明：下单成功后，后续流程与正常订单一致

## 6、秒杀结束清空redis缓存 ##

秒杀过程中我们写入了大量redis缓存，我们可以在秒杀结束或每天固定时间清楚缓存

，释放缓存空间；

实现思路：假如根据业务，我们确定每天18点所有秒杀业务结束，那么我们编写定时任务，每天18点发送mq消息，service-activity模块监听消息清理缓存

Service-task发送消息

### 6.1、编写定时任务发送消息 ###

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre><code>/**

&nbsp;* 每天下午18点执行

&nbsp;*/

//@Scheduled(cron = "0/35 * * * * ?")

@Scheduled(cron = "0 0 18 * * ?")

public void task18() {

&nbsp;&nbsp;&nbsp; log.info("task18");

&nbsp;&nbsp;&nbsp; rabbitService.sendMessage(MqConst.EXCHANGE_DIRECT_TASK, MqConst.ROUTING_TASK_18, "");

}</code></pre> <p style="margin-left:0;text-align:justify;"></p> </td> 
  </tr> 
 </tbody> 
</table>

### 6.3、接收消息并处理 ###

Service-activity接收消息

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <pre style="margin-left:0;text-align:justify;"><span style="background-color:#FFFFFF;"><span style="color:#000000;">SeckillReceiver</span></span></pre> <pre><code>/**
&nbsp;* 秒杀结束清空缓存
&nbsp;*
&nbsp;* @param message
&nbsp;* @param channel
&nbsp;* @throws IOException
&nbsp;*/
@RabbitListener(bindings = @QueueBinding(
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; value = @Queue(value = MqConst.QUEUE_TASK_18, durable = "true"),
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; exchange = @Exchange(value = MqConst.EXCHANGE_DIRECT_TASK, type = ExchangeTypes.DIRECT, durable = "true"),
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; key = {MqConst.ROUTING_TASK_18}
))
public void clearRedis(Message message, Channel channel) throws IOException {
&nbsp;&nbsp;&nbsp; //活动结束清空缓存
&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;QueryWrapper&lt;SeckillGoods&gt; queryWrapper = new QueryWrapper&lt;&gt;();
&nbsp;&nbsp;&nbsp; queryWrapper.eq("status", 1);
&nbsp;&nbsp;&nbsp; queryWrapper.le("end_time", new Date());
&nbsp;&nbsp;&nbsp; List&lt;SeckillGoods&gt; list = seckillGoodsMapper.selectList(queryWrapper);
&nbsp;&nbsp;&nbsp; //清空缓存
&nbsp;&nbsp;&nbsp; for (SeckillGoods seckillGoods : list) {
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; redisTemplate.delete(RedisConst.SECKILL_STOCK_PREFIX + seckillGoods.getSkuId());
&nbsp;&nbsp;&nbsp; }
&nbsp;&nbsp;&nbsp; redisTemplate.delete(RedisConst.SECKILL_GOODS);
&nbsp;&nbsp;&nbsp; redisTemplate.delete(RedisConst.SECKILL_ORDERS);
&nbsp;&nbsp;&nbsp; redisTemplate.delete(RedisConst.SECKILL_ORDERS_USERS);
&nbsp;&nbsp;&nbsp; //将状态更新为结束
&nbsp;&nbsp;&nbsp; SeckillGoods seckillGoodsUp = new SeckillGoods();
&nbsp;&nbsp;&nbsp; seckillGoodsUp.setStatus("2");
&nbsp;&nbsp;&nbsp; seckillGoodsMapper.update(seckillGoodsUp, queryWrapper);
&nbsp;&nbsp;&nbsp; // 手动确认
&nbsp;&nbsp;&nbsp; channel.basicAck(message.getMessageProperties().getDeliveryTag(), false);
}</code></pre> <p></p> </td> 
  </tr> 
 </tbody> 
</table>

说明：清空redis缓存，同时更改秒杀商品活动结束

<table> 
 <tbody> 
  <tr> 
   <td style="border-color:#000000;vertical-align:top;width:426.1pt;"> <p style="margin-left:0;text-align:justify;">开发步骤：</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 0.&nbsp;&nbsp; 做个定时任务将要秒杀的商品放入消息队列</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 1.&nbsp;&nbsp; 消费消息队列先将秒杀商品放入缓存</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 1.1&nbsp; 将秒杀商品信息放入缓存中hash 数据结构中</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 1.2&nbsp; 放入一个list 数据来存储商品的数据量</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 1.3&nbsp;&nbsp;利用缓存的订阅与发布功能，来更新状态位</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; 意义：看商品是否售罄!</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 2.&nbsp;&nbsp; 页面显示秒杀商品以及商品详情</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 2.1&nbsp; 通过缓存查询所有的秒杀商品</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 2.2&nbsp; 通过商品Id 查询秒杀的商品详情</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 2.3&nbsp; 秒杀详情中的秒杀按钮要设定一个下单码 {防止用户直接进入秒杀业务}</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 3.&nbsp;&nbsp; 进入秒杀</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 3.1&nbsp; 获取秒杀的下单码进行校验！</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 3.2&nbsp; 判断状态位</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 3.3&nbsp; 将用户下单请求放入到mq，是为了防止高并发</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 3.4&nbsp; 消费下单的mq消息，再次验证状态位，用户是否已经下单，判断库存，保存预下单的用户Id以及商品Id，</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 并将真正下单数据放入缓存，并更新数据商品的库存数</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 4.&nbsp;&nbsp; 检查抢购状态</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 4.1&nbsp; 根据用在缓存中是否有key{用户key、用户key对应的商品key} ，以及状态位，是否已经下过订单</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 5.&nbsp;&nbsp; 下订单</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 5.1&nbsp; 直接从缓存中获取下单数据，并显示下单列表页面！</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 5.2&nbsp; 提交订单</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 6.&nbsp;&nbsp; 秒杀活动结束清空缓存数据&nbsp;&nbsp;&nbsp;&nbsp;</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 6.1&nbsp; 商品数据</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 6.2&nbsp; 用户数据</p> <p style="margin-left:0;text-align:justify;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 6.3&nbsp; 订单数据</p> <p></p> </td> 
  </tr> 
 </tbody> 
</table>

[2c40985cfe5c4aef90c24a2a1abcf665.png]: https://img-blog.csdnimg.cn/2c40985cfe5c4aef90c24a2a1abcf665.png
[1124d7c02bd14d3ba93d339c6652555a.png]: https://img-blog.csdnimg.cn/1124d7c02bd14d3ba93d339c6652555a.png
[2262f4751a4d4ff2b94f22a24cd06ea4.png]: https://img-blog.csdnimg.cn/2262f4751a4d4ff2b94f22a24cd06ea4.png
[dc57d3637c814a9a8446b752e1e87e16.png]: https://img-blog.csdnimg.cn/dc57d3637c814a9a8446b752e1e87e16.png
[f2b55a0532244d62b11a1ab052152609.png]: https://img-blog.csdnimg.cn/f2b55a0532244d62b11a1ab052152609.png
[9e940f8f508f4d989873caef04464713.png]: https://img-blog.csdnimg.cn/9e940f8f508f4d989873caef04464713.png
[df8b5179256849719d6f1e4f36eeae54.png]: https://img-blog.csdnimg.cn/df8b5179256849719d6f1e4f36eeae54.png
[c5efe98204f94589a7086f8b25697d05.png]: https://img-blog.csdnimg.cn/c5efe98204f94589a7086f8b25697d05.png