我只是想查个电费

玄学人生从作死开始:Chrome和Postman的使用

Posted by Donggu Ho on 2016-11-16

前言

前两天Java EE上课学了点请求相关的知识,就想着试试用找个网站发请求研究一下怎么发包为抢月饼打基础吧。选择了校园网查电费,主要是界面很简单,选好校区楼栋楼层房间什么的提交就可以了。因为刚学学艺不精,也不会cookie什么的,感觉不用登录的查询应该比较容易做到。事实证明我还是太年轻了……过程实在是曲折动人各种踩坑……必须写Blog以资纪念……

查看POST信息

要发包,首先要查看要发什么包。Chrome等浏览器都自带相关的调试功能,可以查看,都是类似的。我使用的是Chrome。

在Chrome打开一个新的隐身窗口

快捷键Ctrl+Shift+N,使用隐身状态不会保存浏览记录,方便反复调试。
在地址栏输入电费查询网站的地址http://202.120.163.129:88辣鸡能源信息网查电费居然是个内网地址连个域名都没有,打开网站。

打开调试控制台

  • 打开控制台的NetWork标签页(Ctrl+Shift+I)。这个版块会从打开起监视网页的所有网络行为,自然也包括发送的请求(所以也可以用它来进行各种下资源比如谷歌娘的音频)。在网页中选择嘉定校区,可以看到一下子就有了很多相关信息。因为选择了校区后,网页js会自动发送请求,查询该校区的楼栋,并刷新页面,因此会发生网络流量。
  • 在Network下部可以看到各种请求的列表,从Method列中可以看到请求中包括一个POST请求和若干GET请求(如果没有显示method列的话需要单击右键把method属性勾上)。此处可以简单理解POST为带参请求,GET为无参请求(其实并不)。
    此处点击那个POST请求,选择Headers,可以看到请求的具体参数。具体分为几个版块,要查看请求部分报文的话,只要看Request HeadersForm Data即可。

    Request Header记录了一些键值对,为请求报文的头部信息,主要跟连接方式、状态管理、请求格式等相关。而Form Data则是请求提交的“本体”正文信息。点击view source可以看到,实际上Request Body为一个格式形如key1=value1&key2=value2的长字符串。在Form Data部分能看到一些变量名,它们和html源代码中的<form>里面的<input>一一对应。这个POST其实就是把网页的form表单提交上去。……废话人家源码<form>就写着method="post"呢【

然后你再仔细看一下网页源码,发现制作者是个zz:校区的变量名为drlouming,也就是宿舍楼名;宿舍楼名变量为drceng,宿舍层;于是楼层变量只能叫dr_ceng了【翻白眼

  • 下面把楼栋、楼层、房间都选好并提交,每步观察请求情况。

调试POST

虽然知道了每次的请求信息,但是这么多数据是都要提交的吗?感觉未必啊。而且部分数据似乎有重复之嫌,而有的数据又好像根本就是空的……此时需要进行测试。
经推荐使用了Postman,一个Chrome应用(不是扩展),界面友好操作友好,可以用来调试各种乱七八糟的请求,hin棒。在Chrome应用商店搜索安装即可。打开Postman界面如图

将方法改为POST,并在地址栏输入URL。点击Body添加POST的Form Data,然后选择x-www-form-urlencoded。该信息来自于之前在Chrome中检测得到的Content-type,具体含义请自己去搜。在Bulk Edit然后直接粘贴Chrome上复制来的数据,再点Key-Value edit即可。Headers的编辑也是类似。
然后就可以给各条键值进行勾选或取消勾选,反复修改直到得到满意的response为止。response可以查看返回的信息(这里是HTML文本)以及header等。而且每次send request的记录都会在左边记下。
经过一轮探索,发现__EVENTARGUMENT,__LASTFOCUS两个属性根本毫无卵用;__EVENTTARGET虽然一直为空但是还是要传;__VIEWSTATE就比较玄学了,经过观察应该是把Form表格的填写信息使用__VIEWSTATEGENERATOR进行了类似加密转换的过程生成的。由于每次post都要将上次得到的__VIEWSTATE提交,所以并不能一劳永逸地直接发送最后一个POST了事,因为并不知道__VIEWSTATE生成的算法。所以只能一步步来,发送四次POST:
1.选择校区
2.选择楼栋
3.选择楼层
4.选择房间、查询项目并提交(按下按钮)
每次post之后把response中的__VIEWSTATE作为下次post的参数,这样就可以了。而Headers里面的属性被证明全部取消勾选并没有什么影响。那么就得到的需要的参数:

然后点击右侧的Code即可生成对应语言发送该POST的语句啦~
当然,并不是这样就能结束,正式的斗争才刚刚开始:)

欲知后事如何,请听下回分解

相关:查电费系列Blog