通过对网络爬虫的购物平台价格监测系统的业务流程进行梳理可知，网络爬虫的购物平台价格监测系统主要由前台买家模块、后台卖家模块以及管理员模块构成。前台功能包含登录功能、注册功能、系统首页功能、唯品会商品详情浏览、唯品会商品收藏、唯品会商品点赞、唯品会商品价格监测、唯品会商品消息提醒、我的个人中心等等、爬虫功能。系统整体功能模块逻辑图如图2-1所示。

图2-1 系统模块图

2.2.1 功能需求

用户和商家操作流程分为以下五个步骤：

1.用户可以浏览唯品会商品的分类、分类下的唯品会商品。首页有轮播图播放，用户可以通过点击进入唯品会商品链接浏览单个（或单类）唯品会商品的具体信息。用户可以根据关键字搜索唯品会商品，然后选购唯品会商品。

2.用户可在线选购自己喜欢的商品进行浏览加购，在唯品会商品详情界面可以点赞、收藏或者取消收藏，加入价格监测等等。

3.用户通过加购到价格监测里的商品，对商品进行在线支付购买。

4.商品价格监测到指定价格，消息提醒到用户。

5.用户买家对自己购买的唯品会商品订单进行收货处理，然后进行评论，可上传图片。

用户成功登录之后，左边会展示唯品会商品分类，点击左边的唯品会商品分类，展示该分类下面的所有唯品会商品，可以根据唯品会商品的名称模糊搜索唯品会商品，对唯品会商品进行模糊匹配搜索操作。通过GoodsController[16]后台控制器，根据GoodsService的QueryGoodsLike方法查询唯品会商品，SQL语句中用到Like模糊匹配查询得到结果，浏览唯品会商品的界面如图4-3所示。

图4-3 浏览唯品会商品界面

4.1.4 唯品会商品搜索

用户登录电商用户唯品会商品购物平台系统之后，可以输入关键字模糊匹配，从而快速匹配关键字相关的唯品会商品，主要原理是通过数据库的“Like”关键字去模糊查询数据库里面的数据[17]。通过GoodsController后台控制器，根据GoodsService的QueryGoodsLike方法查询唯品会商品，SQL语句中用到Like模糊匹配查询得到结果，唯品会商品搜索界面如图4-4所示。

图4-4 唯品会商品搜索界面

4.1.5 查询唯品会商品详情

电商用户唯品会商品详情界面的界面设计是左边展示唯品会商品图片，右边展示唯品会商品名称、具体规格，详情界面具体的功能有加入价格监测，收藏或者取消收藏，超赞功能。

1.价格监测功能：对心仪的唯品会商品可以加入价格监测，进行快速结算；

2.收藏功能：对喜欢的唯品会商品可以加入收藏或者取消收藏；

3.超赞功能：这是本系统设计的特色之处，可以对喜欢的唯品会商品进行超赞，可以点击赞美，增加其次数，次数多的会推荐给用户。

通过CartController控制评论的后台流转，通过CartService对add接口进行操作；通过GuessController控制评论的后台流转，通过GuessService对add或者delete取消收藏接口进行操作。电商用户唯品会商品详情界面如图4-5所示。

图4-5 查询唯品会商品详情界面

4.1.6 加入价格监测

用户选购自己所需唯品会商品，选择数量，加入价格监测，用户可对价格监测进行管理。通过CartController控制评论的后台流转，通过CartService对add接口进行操作，通过add方法操作数据库，价格监测界面如图4-6所示。

图4-6 加入价格监测界面

4.1.7 我的商品监测

用户点击“价格监测”按钮之后，会添加到价格监测列表[18]，通过定时任务去定时监测价格，通过MonitorController控制评论的后台流转，，价格监测界面如图4-7所示。

图4-7 订单结算界面

4.1.8 下单成功

用户对唯品会商品订单提交之后，生成订单号，会显示当前订单信息，则下单成功。下单时通过MonitorController控制评论的后台流转，通过MonitorService对commit接口进行操作，通过commit方法操作数据库，下单成功界面如图4-8所示。

图4-8 提交订单界面

4.1.9 支付成功

用户购买支付成功，完成交易。通过MonitorController控制评论的后台流转，通过MonitorService对pay接口进行操作，通过pay方法操作数据库，完成交易界面如图4-9所示。

图4-9 支付成功界面

4.2 爬虫部分的实现

后台管理是包含用户信息管理、唯品会商品分类管理、唯品会商品信息管理、唯品会商品订单管理、评论管理、账户管理等等功能，本章节将会对后台管理功能进行详细的介绍。

4.2.1 爬虫功能

管理员登录是需要进行管理员验证，第一步、打开唯品会网站  https://www.vip.com。然后随意搜索一种商品，比如"键盘",搜索之后下拉发现页面URL没有发生改变，但是商品信息在不断加载，那么这就是动态Ajax技术，遇到这种情况，第一反应就是找接口。

第二步、打开开发者工具，鼠标右键，点击检查，切换到Network选项卡，然后刷新唯品会页面，进行抓包，然后查看每个包的pirview，发现商品信息在‘ v2?callback=getMerchandise’中，我们来看一下URL,不看不要紧，一看吓一跳-_-,这URL也太长了，研究一下参数，发现主要是每件商品都有自己的pid,那么接下来，只要我们找到商品的pid就可以抓取数据了。