使用wireshark進行數據連接層的抓包分析——流量分析（一）

哈，這是在segmentFault寫的第一篇博客文章，祝好！
tags: 技術, wordpress, DIY, SEO, 安全, 前端, 互聯網, 二次開發

今天瘋了般地弄了數據鏈路層分析、應用層網站流量導向分析有關的東東…先來講說這個數據連接層的分析，限於篇幅和類型，明天再寫第二篇。

分析背景：幫朋友弄二次開發的商城系統今天拿到微信上測試了，打開後發現頂部的圖片小圖標不見了，各類分析（對移動端的分析夠折騰的）後才發現是利用了css的一個特性——條件控制，針對高分辨率的顯示屏CSS代碼裏提供了簡單的條件控制（見下面的代碼，關注一下@media only screen），當時直接扒騰訊微購前端代碼時是在PC端測試的，並無仔細看這裏的代碼，在PC端72dpi下面@2x.png的圖片壓縮一半的分辨率同樣能夠顯示的很清晰，可是若是拿這個圖在高分辨率的移動端時，就顯得很模糊，影響體驗了。

@media only screen and (-webkit-min-device-pixel-ratio:1.5),only screen and (min--moz-device-pixel-ratio:1.5),only screen and (min-resolution:240dpi){
.icon_arrow_right{background-image:url(../images/weigou-20131223171219@2x.png?20131223171219);background-position:-203px -96px;background-size:211px}
.icon_back{background-image:url(../images/weigou-20131223171219@2x.png?20131223171219);background-position:-186px -81px;background-size:211px}
.icon_cart{background-image:url(../images/weigou-20131223171219@2x.png?20131223171219);background-position:-47px -109px;background-size:211px}
/* ....... */

但是這和數據鏈路層分析有什麼關係呢？——騰訊在最近把微購頁面作了安全訪問控制後，在PC端不能直接訪問了，訪問時直接告知appid錯誤，須要登陸。——也就是說，直接扒微購的連接樣式已經行不通了。第一次扒的時候只保存了由@2x.png壓縮後的sprite圖，後面再想扒已經沒有連接了，我須要採起其餘手段來獲取圖片連接了。

如今的需求：@2x.png圖片連接。

解決方法：

一、以前在瀏覽器上下載@2x.png壓縮後的圖片有歷史記錄吧？沒由於看AV什麼的清空記錄吧？對的，通常這樣的圖片就放在同一個資源服務器上，找到它（妹的當時忘記去找了）。

二、下載歷史記錄被清空了…微購網站連接有對吧？CSS代碼已經扒下來了對吧？直接把CSS代碼裏須要的圖片url和已保存的微購連接拼接，多試幾回也許能夠成功——若是是把圖片資源和網站文件放在同一臺服務器（特指同一個域名）上的小型網站通常是能夠成功的（可是騰訊微購不是）。

三、拼接若干次仍是返回404，那仍是抓包分析吧。下面詳細介紹這個（採用此方法，成功）。

抓包原理：
具體的請自行百度，這裏就說說簡單的。手機使用微信訪問騰訊微購時採用的是HTTP協議，數據從你請求訪問微購網站時，從你的手機上的無線網卡發送出去，通過運營商們的各類操做後把請求數據送到了目的地址——微購網站的服務器網卡，微購服務器分析發現你是要請求訪問微購網站首頁的，驗證身份後承認請求，便開始把首頁數據打包發送到運營商，各類操做後數據包又到了你的手機無線網卡上，這時手機解包、分析協議、解析數據、呈現數據到你看到首頁漂亮MM，整個過程在網速快的狀況下不到2秒。咱們簡單的抓包就在網卡上進行——可是尼瑪手機無線網卡咋抓包啊？！手機上抓包不會可是電腦上抓包我會啊（大學老師教的好），那就考慮在手機->運營商->服務器中間加一道電腦網卡，即中轉一次，在電腦上不是會用wifi共享麼？那就能夠用有線網卡和運營商鏈接，把無線網卡開啓做爲無線熱點，而後手機鏈接電腦共享的wifi，這樣訪問就構成了手機->電腦無線網卡->電腦有線網卡->電信聯通等運營商->服務器，咱們只須要在電腦無線網卡（較好）或在電腦有線網卡上抓包便可。此方法可行，可是程序員的惰性開始發做了——電腦正用着wifi呢，無線網卡被佔用了不想從新給有線網卡接線——或者用臺式機壓根就沒有無線網卡腫麼破？這時就想起來有個虛擬機的東西……

咱們如今是須要抓@2x.png這張圖的地址。咱們打算用虛擬機的方法去抓它。那行，move on.

一、安裝抓包工具wireshark：

二、安裝安卓開發包（含java環境、eclipse編程環境、android虛擬機），官網去下載壓縮包解壓、配置一下就好了，教程多多自行搜索。

三、打開安卓虛擬機（出現PANIC、ERROR神馬的在網上搜索一下就有解決方法，通常是路徑問題）：

四、在安卓虛擬機上使用瀏覽器下載安裝微信（虛擬機默認會開虛擬網卡和電腦物理網卡NAT鏈接給安卓系統當3G網使用）：

五、下載的同時打開wireshark觀察流量變化較大的網卡（通常就兩個），肯定虛擬網卡後能夠監聽它了：

六、登陸微信號並打開公衆帳號，進入微購物界面：

七、查看wireshark抓到的包，並找到HTTP協議的包，分析找到相關代碼（圖中高亮顯示，根據CSS代碼拼接就完成了）：

結尾：其實文章更強調一個解決實際問題的過程，再怎麼難的問題，分解成一步一步便能很快解決。另外，wireshark真心強大啊，有志之士定得多研究研究！