浏览器抓包 + JS加密分析(以QQ网页全部登录方式为例)，侵删

  开始制作日期：2017年11月16日
最后校对及结束制作日期：2017年11月21日
 
首先是扫码登录
1.首先，打开谷歌浏览器，并访问qun.qq.com(腾讯的网页登录大同小异)，然后打开开发者工具。

 2.进入网络监控选项卡，然后点击登录。弹出登录窗口。   

3.可以看到抓到了很多数据包。  

4.经过对比，我们发现 以ptqrshow开头的包返回的图片 与 显示在登录窗口 的二维码相同(图中第二个ptqrshow)。这个接口能显示二维码，于是直接把网址放到自己的工程里使用。  

5.以e4a源码为例获取图片，具体语言具体用法请自理：   

6.扫码登录的原理是显示二维码之后不断地访问一个接口，接口返回扫码成功则登陆成功。在上图中，满足 不断的访问 条件的只有ptqrlogin开头的几个数据包。点击该包，点击response选项卡查看返回数据。有时候会出现载入失败的情况。   

7.这样的话我们可以用火狐浏览器来抓包，这个ptqrlogin包返回如下三种情况：
二维码还能扫
 
二维码不能扫了或超时，要刷新
 
访问接口的参数不足或错误
 
登陆成功包将在第13条解析 

8.我们在火狐浏览器不断地用 编辑与重发 的方法来逐渐删除原先链接的参数，直到出现参数错误，说明被删掉的参数中有重要参数，把刚删掉的参数予以保留 。不断地删增删之后剩下四个参数，一个都不能再删了。
 
u1不用说，from_ui根据多次实验确定其为定值1，aid经过对照，与前面获取二维码图片接口的appid参数相同，那么ptqrtoken从哪来的呢？ 

9.回到谷歌浏览器，关闭包详情窗口，回到抓包列表，鼠标悬停在他所对应的initiator上，弹出与该数据包的发送和返回数据处理有关的函数及其在js中所在的位置。
 
根据英文含义和直觉，我们点击begin_qrlogin进入js查看器，脚本可能很乱，堆积在一起，左下角可以选择美化脚本。  

 但是这里好像没什么收获。按下ctrl+f进行查找，输入ptqrtoken，找到了我们想要的东西。
 
其基本含义就是：在cookie中把一个叫qrsig的参数取出来，经过腾讯自己做的叫做hash33的函数加密得到ptqrtoken。通过数学中的自变量因变量理论，既然因变量是qrsig，能代表用户身份，那这个qrsig一定是在获取自变量 二维码图片 的过程中取得的。返回观察刚才取二维码的包，果不其然。   

12.之后回来，顺藤摸瓜再找hash33
 
其大致含义为：创建整数e和i和n，n为传来的qrsig的长度，循环条件为i<n，每次循环：e自加e的位左移5位，再加当前循环次数在qrsig中对应的字母或符号的ascii码，之后i+1。所有循环结束后，返回十进制2147483647和e位与的十进制结果。对应的e4a源码如下，其他语言自理：
 
其实你的编程语言中如果有js引擎，你完全可以不用把这个js翻译成你的语言，直接套用还省事。
 
别忘了给你的浏览器开启持续网络日志，不然页面跳转或者刷新之后你抓得包就没了
火狐浏览器
 
谷歌浏览器
 
都打√   

13.然后就是用timer(定时器)不断访问该接口。直到得到如下结果：
 
 
中间截去了，大概你知道是登陆成功了，此时由此接口返回可以控制此号基本所有qq网页的权限——也就是cookie。
 
拿到之后你自己发挥咯。去有用的网页甚至QQ客户端看看能不能抓到什么http接口，就能实现不同的QQ辅助功能。
 
账号密码普通登录
1.为了方便抓包体验和重放，我们采取火狐浏览器抓包，谷歌浏览器分析js的方式。
 
2.到达登录界面，打开火狐的开发者模式，到网络选项卡，清除之前的数据包。
 
3.更改账号框的内容，然后点击密码框，此时抓到了一个数据包。   

14.点击响应选项卡，看看他返回了啥，并。。。。看不出来是个啥
 
用逐步去参数法，最后剩下四个参数。
 
pt_tea固定为2，其余的学过上面的都知道。由于暂时不知道是干嘛的接口，我们先留着。
5.输入密码之后点击登录，登陆成功，抓到了如下数据。(为了不跳页面，你可以选择故意输入错的密码)   15code开头的那个不要管了，返回的好像没什么用。report明显是报告的意思，应该是腾讯的日志收集，忽略。下一个就是login了，登陆的意思。点击login 包，查看响应内容。   

16.最后显示登陆成功，那这个就是最后确定登陆的包没错了。然后我们看看他的参数。
 
参数还不少，那么就用逐个去参数法看看哪些参数有用。
由于做的时间长，腾讯登录包要求严格，所以返回这个可以继续去除参数。
 
提示这个就是你把重要参数给删了，保留重要参数之后继续。
 
最后的结果
 
u是你自己qq,u1为登录链接，from_ui固定为1，aid就是你的appid，和前面的check包里的appid一样。
pt_vcode_v1，verifycode,pt_verifysession_v1,ptrandsalt经过对比，都是前面那个check包返回的。
 
ptrandsalt在后面，值为2。 

17.就剩一个p参数就登陆成功了，那么p从哪来的呢。既然之前的包没有返回p，那么就是从js加密得到的，我们打开谷歌浏览器，为防止页面跳转，我们故意输入错误的密码，让他停留在登录界面，点击登录之后得到登录包。

18.我们将鼠标悬停在这里。看到三个和他有关的函数。
 
submit是发送的意思，那么大概就是这个函数了。点击submit那行，进入调试器，点击美化代码(扫码登录第10条说明)，得到大概如图界面。   

19. 4128黄色行大概意思就是提交表单，表单在e中。在4122行声明了e，我们可以看到在pt对象中的plogin对象的getSubmitUrl函数决定了e的值。我们ctrl+f搜索getSubmitUrl(注意大小写)，在4054行找到了getSubmitUrl原函数。
 
我们看到i.u，i.verifycode，i.pt_verifysession_v1，i.p，i.pt_randsalt， i.u1之类的，是不是和登录包的那些参数一样！然后我们顺理成章的找到i.p在4066行，这就是p参数，它是由$.Encryption.getEncryption(n, pt.plogin.salt, i.verifycode, pt.plogin.armSafeEdit.isSafe)的返回值决定的。此时我们需要知道这些参数都代表什么。谷歌浏览器支持查看已运行代码中各个变量的值，我们要知道这些值，于是要在4066行后面下断点，让浏览器到这里暂停执行。我们在4067那个数字上点一下，发现断点下在了4068，可能4067不让停吧。
 
重新输入错误的密码(这里我们输入123456)，点击登录，屏幕变成半透明，表示程序暂停。
 
依次悬停在n，salt，verifycode，isSafe上，他们的值依次为
 
我们输入的密码123456。
 
未知，一会再说。
 
 
经过对比，是那个check包返回的。
 
这个变量没有声明，说明没用，实际做出登录协议可以不写这个参数。 

20.我们ctrl+f搜索关键词salt，找到两个有可能的结果
 
 
第一个的意思是，去除账号框你输入的可能有的@qq.com，然后剩下的就是qq号了，把qq号经过uin2hex函数处理，返回的就是salt。
第二个的意思是，check包返回的结果实际上调用了ptui_checkVC函数，i参数就是返回包里\x00\x00开头的那个16进制字符串。
所以这两个都有可能。而经过我的对比。。。这两种方式得到的结果一样，所以说用哪个你随便啦(*^▽^*)
 
下图是uin2hex函数
 
回到p参数的研究，我们找到getEncryption函数的来源
 
调用了上面的h参数，既然$.Encryption.getEncryption函数所需要的参数我们都拿到手了，直接调用就好了，省的继续分析了。我们把整个js放到对应编程语言的js引擎里，到时候直接调用这个函数就行。
在e4a中使用js引擎可调用该函数，以下图片以e4a为例子，后面把c_login_2.js全部复制进去就好了，方法参考e4a自带例程“浏览框与js交互”。   

21.把组装好的接口进行访问，返回如图数据
 
登陆成功，并由该接口返回了具有操作权限的cookie。
 
至此，账号密码普通登录的教程就结束了。之后还有bkn或g_tk的获取，需要验证码的登录，需要qq安全中心6位动态密码的登录的附加教程，后面请选择性阅读。 

需滑块验证的登录
1.在火狐浏览器中，进入登录界面，清空账号框
 
输入一个瞎编的qq号之后点击密码框，点开出现的check包，发现与不需要验证码的check返回有区别
 
暂时不知道这些参数都是干嘛用的，我们继续。   

以下是我熬夜做出来的o(╥﹏╥)o，做教程的时候才发现腾讯原先的验证码登录换成了滑块，于是现抓现写，好在与原先验证码登录的几个包没差多少。
随意输入密码点击登录
 
抓到了上图的包，我们打开cap_union_prehandle的数据包
 
不知道里面的参数是干嘛的，我们先留着。里面的参数经过前面讲的火狐浏览器的逐渐删参数法(之后用到逐渐删参数法的地方均省略过程)，最后确定剩余五个参数。
 
aid在上面被盖住了，不必说他是什么了。clientype和apptype为固定值2。uid是qq号。cap_cd经过对比，与check包中的第二个参数对应。 

23.第三个包是css，不分析。
第四个包cap_union_new_show返回结果
 
是个html，腾讯为什么要在一个接口返回html呢？可能每次里面的加密方式都不一样？(有点后怕)
参数有这些
 
其中长长的ua我们在前面的返回内容上好像没看到过，我们暂时忽略，去掉之后好像没影响网页内容。经过逐渐去参数法，剩余这几个参数。
 
经过对比，aid不用说，clientype和apptype为定值2，sess为cap_union_prehandle数据包返回的sess
 
uid为qq号，cap_cd在前面提到了，是check包返回的。 

24.中间很多数据包都没用，不是html静态页面就是js，还有样式表(css)，还有图片。
之后就是两个cap_union_new_getcapbysig，经过对比，仅最后一个参数img_index不同，前者为1，后者为2。返回的分别是滑块界面底图和滑块碎片图。
 
 
看了参数之后就是逐步去参数了，但是这个网页就算是原链接重新访问，也会出现500错误，可能腾讯不允许这个接口中的某个参数重复使用吧。
 
突然发现验证码界面有刷新按钮，于是清除目前的抓包，点击刷新。
 
发现一个刚才没看到过的包(可能之前不小心一并清除了吧)，cap_union_new_getsig包，看看他返回了什么。
 
发现一个取验证码图片需要用的参数vsig。
需要的参数
 
其实抓了这么久我们发现腾讯很多登录过程包的包体结构大体类似，于是我们大胆猜测：对于取验证码图片包，可能有如下参数。   

当然。不管你怎么重发这个包，腾讯都会给你返回错误。既然不让第二次访问，那我在浏览器第一次发包之前把包的参数删减一些，然后再发上去，看看腾讯是否给你图片，不就得了。这个功能谷歌浏览器中有，火狐有没有我不知道，因为我的工作重心放在谷歌上。事实证明这样发送是正确的，以下为谷歌浏览器验证过程(这里可能略微长并且难懂，后面教程中有一个没法二次访问的接口也用了这个方法验证，你可以选择跳过以下粗体字部分)： 

验证开始
 
 
用谷歌浏览器走一遍流程，一直到验证码出来之后，删去原先的包，然后点击刷新，在cap_union_new_getcapbysig包的initiator下悬浮，然后点击cap_union_new_show进入js分析
 
别忘了点美化代码按钮，然后ctrl+f直接寻找getcapbysig关键词
 
正好找到两个，分别对应两个图片，然后分别在这两个地方(1313和1336下断点)
 
然后点击安全验证中的刷新图片按钮，js在第一断点处停止，右侧查看器可以看到n的值。
 
n的值有点长，我们双击选定然后ctrl+c复制到记事本或者任意的文本编辑工具里，方便修改之后复制进去。
 
根据上文的猜测删除没用的参数，一定要快删，不然时间长了可能有的参数会失效，更改之后的结果
 
复制回去
 
点击跳到下一断点
 
下一段是滑块碎片图片，与背景图接口大同小异，所以我们这里不费心来修改了，直接继续跳断点直到程序执行完(也就是加载出图片)。   

发现背景图在删除我们预料之外的参数之后仍然能显示，切换到network选项卡，背景图接口包的链接和我们预计的一样，于是我们的猜想是正确的。
 
验证完成
 
5.我们把滑块滑到正确的地方，出现新的数据包
 
1包为验证的最后一步的包，因为之后分别是两个报告，一个2包开始登陆，还有一个因为密码错误而为下次登录准备的check包3包。
点开验证包1包，查看其返回的数据
 
返回了randstr,ticket
 
还有一个代表验证成功的ok
看看他的headers请求头(往下翻可以看到参数)
 
 
对，参数就是这么多，看看有哪些我们熟悉的参数
aid,clientype,apptype,sess,uid,cap_cd,vsig就这些没了，按理来说还需要传入验证的结果
思考：滑块位置可以用什么表示呢？那只能是坐标啦，二维坐标表示方法就是x和y嘛。
然后我们就真的发现了这个东西
 
那验证的时候把这货带上就好啦。

经过对比，他的y值(上图中的140)来源于cap_union_new_getsig包返回的inity的值，此值为滑块所在的纵坐标，因为滑块是水平移动，所以其纵坐标不变。他的横坐标就是需要人类来滑出答案啦！
经过上文粗体字那个方法的验证(提示:在cap_unuin_new_show源码中的1515行下断点，修改C中各项的值)，发现并不好使。
 
可能是我们少了参数，于是我们先把那些长的一匹的、没有已知来源的参数ua、websig、fpinfo去掉，经过上文粗体字方法的验证，这些参数确实不需要有就可以完成验证，那我们可以松一口气，其他参数全部当做定值处理。

成功之后返回
 
下面粗体字可以不看。
如果你非要较真的话，我可以告诉你真正需要的参数有这些
 
Apptype和clientype可以没有，cdata是你完成拼图的秒数(精确到小数点后一位)乘十。Subcapclass在cap_union_new_show的源码的第1496行，为定值10。没什么用的参数websig在1501行，为定值，每次访问cap_union_new_show返回的websig都不同，没什么用的参数fpinfo和cookie中fp3_id1参数相同。为什么我要和你说这些，因为我废了很久的功夫分析了他们最后发现没用，但我也不能白分析，对吧，所以我就告诉你了。
6.验证ok之后就是login包了，和我们第二节分析的login登录基本相同，但是有一些不同的地方。   

经过对比，其中的参数verifycode是验证成功包返回的@开头的那四个字符，pt_vcode_v1不需要验证为0，需要验证为1，pt_verifysession_v1为验证成功包返回的ticket，其余均遵照第二节登录包的规律就可以了。
需要QQ安全中心令牌的登录
1.使用一个需要QQ安全中心6为密码验证才能登录网页的QQ，一直弄到这个界面。
 
可以看到login包的返回数据发生了变化
 
由此可以再你的程序里判定用户是否需要验证密保
输入错误的动态密码
 
2.发现新的数据包，点开看返回数据
 
好像有乱码，那我们先看参数
 
就这些参数，没了
验证成功之后会返回一个链接，访问那个链接就能获得cookie。 

bkn的计算方式及腾讯为什么要弄bkn
1.登录之后到成员管理，打开开发者工具，然后刷新页面。看到这个包点开
 
他的参数
 
只有一个bkn
2.打开sources选项卡，按ctrl+alt+f全局搜索，在下面出现搜索栏，输入bkn然后回车搜索
 
之后双击搜索结果，美化代码之后看到了如下图所示界面。   

可以看到这个404行数据包data中一个叫bkn的参数来自于t函数，上面刚好有t函数源码，其内容为：e为cookie中的skey，t为5381，n为0，o是那个skey的长度。每次循环：t自加t的位左移5位再加e中第n个字母或符号对应的ascii码，之后n自加1。循环直到o比n大结束。最后返回2147483647和t位与的结果。 

其e4a源码如下，其余语言请自理
 
我认为为什么腾讯要有bkn：为了你的安全着想。在所有具有操作性质的接口和能够获取用户隐私的接口都有bkn存在。而bkn只能由cookie中的参数skey计算得出，能够给出bkn就代表操作者拥有用户的cookie。举例：手机qq中点击腾讯的网站，如果这个网站需要登录(需要腾讯网页cookie)，那么你会自动登录成功，因为手q自带浏览器能在qq域名中自动给出有效cookie，无需登录。

而如果没有bkn这个参数，你访问别人的网站，别人的网站可以让你跳转到腾讯的某个接口，跳转之后因为浏览器已经有了cookie，腾讯就以为是你进行了操作。没有了bkn，给你的直观感受就是，如果别人在网站中封装了腾讯自助冻结接口，你访问他的网站，然后你qq就被冻结了。这就是bkn对你的保护作用。   

以上就是以网页qq抓包为例讲解浏览器抓包+js加密分析教程了，感谢大家这么长时间的阅读。

谢谢大家对一个叫lzz的无名小白的关注。如果有什么缺点欢迎大佬们指正。