“网页源码的隐藏”和js调试

最近在抓包的时候，发现诸多“诡异”的现象。点击按钮，第一个get包里面直接带了一个key值。当时的这个key值怎么来的满头的雾水！

当时非常的迷惑，主要的原因就是这个key值的产生在第一个get包里，不是后面的各种类型的包产生的！包括网页类型，js。

后来只有反推思考，竟然当点击按钮以后产生的第一个包就存在这么一个值，那么这个值就应该是点击按钮存在的那个页面里就应该存在了。

为了证明我这个推论，我就用google开发工具查看点击按钮区域的代码，结果要找的key值就在那里。

当这个key映入眼帘的时候，欣喜若狂。果然在该页里。

我迅速点击右键查看网页源码，搜索key，此时“诡异”的现象又出现了，竟然搜索不到key。不可能啊，难道是我眼睛看错了？我对比了几下，发现问题来了。

如果要google的开发工具查看是可以找到，但是不在网页源码里面。

结合上面两张图，我们发现，在div（choose-amount fl）下面应该存在一个div（choose-btn-qiang）。

竟然现象已经产生，我们还是得尊重事实，找出问题的原因。因为我也是第一次碰到这样的情况，不敢果断下结论，只能做以下判断：

一 这段div用某种手段隐藏了

二 这断div通过js动态加载，不存在静态页面源码里。当触发某个事件的时候，js动态调用进来的一段。

 最后，种种感觉让我不得不去查看页面的js文件，虽然很不情愿。

我们都知道，javascript是可以对页面的div进行操作的，那么只有去js文件里去找这个div（choose-btn-qiang）。

到目前为止，虽然碰到的问题很多，但是方向和推测都是正确的，找到这个div当然只是时间的问题。后面终于在qiang.js里面找到了。

下面是部分代码：

var Qiang = {
originBuyUrl: $(‘#InitCartUrl‘).attr(‘href‘),
init: function (a, b) {
this.sku = a || pageConfig.product.skuid,
this.key = b || pageConfig.product.skuidkey,
this.btnWrap = $(‘#choose-btns‘),
this.btnTPL = {
a: ‘<div id="choose-btn-qiang" class="btn disabled"><a class="btn-qiang" href="#none">{T}<b></b></a></div>‘
},
this.get()
},

get: function () {
var a = this;
var b = ‘http://yushou.jd.com/youshouinfo.action?sku=‘ + this.sku;
var c = pageConfig.product.specialAttrs && /isKO/.test(pageConfig.product.specialAttrs.join(‘-‘));
c && (b = ‘http://item.ko.jd.com/itemShowBtn?skuId=‘ + this.sku),
$.ajax({
url: b,
dataType: ‘jsonp‘,
success: function (b) {
‘1‘ === b.type ? (a.set(b), pageConfig.qiang = !0) : ‘2‘ === b.type ? (a.setStage2(b), pageConfig.qiang = !0) : ‘3‘ === b.type ? (a.setKO(b), pageConfig.qiang = !0) : pageConfig.qiang = !1
}
})
},

其实我们应该看最重要的一段：

var Qiang = {
originBuyUrl: $(‘#InitCartUrl‘).attr(‘href‘),
init: function (a, b) {
this.sku = a || pageConfig.product.skuid,
this.key = b || pageConfig.product.skuidkey,
this.btnWrap = $(‘#choose-btns‘),
this.btnTPL = {
a: ‘<div id="choose-btn-qiang" class="btn disabled"><a class="btn-qiang" href="#none">{T}<b></b></a></div>‘
},
this.get()
},

 通过上面代码我们可以看出来，对象的key值，通过一个变量b赋予。大胆的推测下，是不是可以通过js断点调试得出k值呢？其实我当时心里并没有谱，只有试试了。

这个时候我们需要用一个js调试的神器，火狐浏览器的调试器！

这里断点下到哪里要注意一下，因为b值的生成要用到下面的get:function()，所以要下到54行。

现在我们开始调试，刷新页面。下面是我们得到的调试结果：

如果,b值已经出现了。“http://yushou.jd.com/youshouinfo.action?sku=1478342961”这段就是我们需要的b值，大家肯定要问了，这个跟我们key啥关系，

别心急，把这段复制到浏览器打开，我们得到如下信息：

{"type":"1","num":437,"d":323701,"flag":false,"stime":"","etime":"2015-04-05 10:00:00","state":4,"sku":1478342961,"url":"http://yushou.jd.com/qianggou.action?sku=1478342961&key=e9d318dd32984052fd440c6b23472597","info":"抢购进行中"}

 没有看错，url：里面出来了我们要的key值，其实这段url就是我们要的get提交地址。

一切顺利解决！

谢谢ccav！