我写了一个抢购茅台的浏览器插件

一、场景还原

淘宝的茅台购买需要事先添加购物车，到了八点的时候在进行结算->订单提交，如果运气好的话能买到一瓶，但是貌似有很多黄牛，所以个人不凭借任何工具的话基本抢不到滴。

下面分享一下自己开发的chrome插件，有兴趣的可以看下实现思路，说不定对你会有启发，有好的建议也可以提出来，大家一起讨论学习，话不多说，开始了！！

二、功能梳理

• 1、卡点；

卡着晚上8点的这个点进行页面的自动刷新。

• 2、自动提交；

页面刷新后，通过插件实现“提交订单”按钮自动化点击。

三、功能实现

1、卡点

首先我们来分析下实现卡点效果，会遇到哪些问题：

• a、每台电脑的系统时间是不一样的，且和淘宝服务器时间也不相同，如何解决？
• b、假设第一个问题解决了，但在八点整的时候刷新页面还是会经常看到类似商品已售完的提示语，还是“来晚一步”了？

1.1、问题解决

• 同步淘宝服务器时间

接口：https://api.m.taobao.com/rest...

由于开发的是浏览器插件，直接请求的话会出现跨域。所以在实际操作的时候事先写了一个node服务，通过中间转发的形式拿到最终的淘宝服务器时间。

• 轮询查看是否已经到点

上一步拿到了当前淘宝服务器时间，另外目标是8点，可以得到当前时间距离服务器的8点还剩多长时间【定义为：disTime】。开启一定时器进行轮询，每次轮询的时候disTime都减去定时器间隔时间【定义为：interval】，直到disTime小于等于某个值【后面定义的singlePathTime】为止。

【interval】在插件中支持手动配置，因为想要成功抢到，时间一定要精准。如果定时器间隔设置的过大或者过小都可能错失那个精准的时间点，所以需要多次调整。

• 同步了服务器时间，为什么还会“来晚一步”?

据我判断，每个人的网速是不一样的，并且从刷新页面开始到提交订单页面返回是有个请求时间的。

所以，在正式刷新页面之前最好先计算出当前电脑当前网络的环境下请求的单程时间【定义为：singlePathTime】，最终在8点前singlePathTime毫秒刷新页面。比如说计算出了singlePathTime为50毫秒，那么就在7点59分59秒950毫秒的时候刷新页面。

【singlePathTime】在插件中也是支持手动配置的，方便对自动计算出来的单程时间进行微调。

2、自动提交

自动提交可通过js中的click方法【伪代码：btn.click()】主动触发实现。

这里有个注意点就是只有通过类名或者id才能找到这个按钮，所以为了防止类名和id的变动，也将其加入到了插件的配置界面中。

3、完整流程

四、插件使用步骤

如下操作在8点前几分钟的时候进行，以便能够达到比较好的效果：

• 运行bat文件【为了方便启动node服务，所以封装成了批处理文件，双击即可开启服务】开启服务同步淘宝服务器时间；
• 购物车页面选中商品点击结算按钮，提前进入商品提交页面等待；

<!---->

• 在商品提交页面打开插件配置页面，配置单程时间、定时器间隔时间、提交按钮类名或者id，等待时间的到来即可。

本插件仅供学习交流使用，不能恶意使用，更不得用于商业用途。

由于内容敏感不便贴出真实代码，有兴趣的可以关注公众号【前端大会】，发送“茅台”获取源码。

很遗憾到目前为止抢了几次都没抢到，有兴趣的同学可以一起讨论、交流、完善，最后希望所有同学能够实现“茅台自由”，哈哈哈……