微信号:FrontDev

介绍:分享 Web 前端相关的技术文章、工具资源、精选课程、热点资讯

漫画:如何用 JS 脚本抢月饼?

2016-10-19 20:44 前端大全

(点击上方公众号,可快速关注)


作者:伯乐在线专栏作者 - 玻璃猫

链接:http://blog.jobbole.com/106676/

点击 → 了解如何加入专栏作者


中秋节前夕,公司为内部员工提供了在线抢月饼的活动……

公司里,恰好有一位调皮的程序员……

随后,这位调皮的员工埋头研究了一下下……

很快就到了抢月饼活动开始的时间,脚本的效果出人意料的好……

可是,事情已经没那么简单了。很快,员工被叫去约谈……

这位调皮员工的经历被传到网上,引起了很多人的关注。小灰和同学之间也在饶有兴致地谈论这件事……

首先,让我们来模拟一下当时的内部员工抢月饼活动页面。当然,真正的活动页面肯定不会这么简单,在此只是做个简化的示例:

页面的HTML代码如下:

如何每隔一段时间让抢购按钮自动被点击呢?很简单,原生Javascript当中有一个定时器函数 setInterval,该函数有两个参数,第一个参数是想要执行的回调函数(在这里就是触发按钮点击事件的语句),第二个参数是触发执行的间隔时间(单位毫秒)。

因此,抢月饼脚本简单的实现如下:

如何在页面中嵌入自己写的Javascript脚本呢?下面分别介绍一下在Chrome和Firefox两种浏览器上的操作步骤:

Chrome:

1. 打开chrome扩展程序页 – chrome://extensions

2. 将刚才的自定义脚本保存为以user.js为后缀的 .js文件,例如test.user.js,拖入扩展程序页。

3. 重启浏览器。

4. 进入月饼抢购活动页面。此时脚本已自动执行。

FireFox:

1. 下载并安装用户脚本管理插件 greasemonkey (中文翻译成“油猴子”)。

2. 重启浏览器。

3. 将刚才的自定义脚本保存为 .js文件,例如test.user.js,拖入页面空白处。

4. 进入月饼抢购活动页面。此时脚本已自动执行。

关于验证码:


在一般的网页中,为了防刷,都会在提交请求之前让用户输入动态的验证码:

动态验证码有效防止了绝大多数JS脚本的自动提交行为。如果它的干扰线和扭曲效果实现得足够好,即使用OCR图像文字识别技术也很难破解。动态验证码的生成和验证流程如下:

由于每次看到的抢购页面里的验证码都不相同,所以很难用自动化脚本攻克。可是,如果抢购页面的开发人员偷懒,只是在抢购页面里引用了固定不变的验证码图片,那么请求和验证流程就变成了下面的样子:

这样一来,只要知道静态的验证码是什么,脚本就可以轻松填写正确的验证码。


点击「阅读原文」,可和作者直接交流



专栏作者简介 ( 点击 → 加入专栏作者 


玻璃猫:互联网公司的码农一枚,喜欢算法和面向对象设计。个人微信号:13522239721 个人订阅号:dreamsee321 欢迎一起交流讨论!

打赏支持作者写出更多好文章,谢谢!



关注「前端大全」

看更多精选前端技术文章

↓↓↓

 
前端大全 更多文章 前端这条路,我们该何去何从(续) JavaScript 浏览器事件解析 彻底理解 JS 中 this 的指向 来一起让我们越来越懒,面向CSS、JS未来编程 有趣的 CSS 题目(1): 左边竖条的实现方法
猜您喜欢 极简 Github 上手教程 回家过年,除了团圆饭,还有美猴王 3月21日,约吗?——OpenStack安装与运维实战经验分享会 函数 阿里资深专家赵杰辉谈Aliware:生于电商,高于电商