热搜:fiddler git ip ios 代理
历史搜索

手機抓包秘籍大公開!輕鬆掌握https 請求,洞察數據奧秘

游客2024-07-09 09:30:01

配置完憑證之後再次刷新頁面,就可以看到所有的https請求了,可以清楚的看到請求體和回應體的內容

手機抓包

首先抓包的前提是手機和電腦要處於一個網路下。關閉電腦端的防火牆,然後在手機的wifi設定中,把WiFi的代理模式設定為手動代理,主機名稱和連接埠號碼是電腦的ip位址+的連接埠號碼。  ip位址可以透過終端的查詢。

配置完之後手機發送的請求在的清單中就能看到了。在手機端存取一下掘金的官網。

在工具列這塊可以透過選項對請求進行過濾。可以在中看到手機端存取的清單資料。

應用場景

的強大遠遠不止能抓包這麼簡單,它還有很多其他的功能。

主機

整合[3]的功能,使用者只需透過簡單配置( ://id)即可使用,具體參見[4],更多行動端調試方法可以參考:利用調試行動端頁[5]。

相信有過h5開發經驗的同學都遇到過這種情況,我電腦f12模擬行動端調試的時候非常的完美,但是一到真機上會出現各種奇奇怪怪的問題,而這些問題往往是比較難以定位問題並修復的,因為在真機的h5頁面上沒有控制台,我們無法審查元素。

但是當你使用了你會發現只需要配置一行規則,就可以輕鬆的調出控制台調試真機的h5頁面,這就是控制台。具體效果如下圖,這裡為了方便展示,真機調試就用pc端模擬手機代替(真實調試的時候,需要先實現上述的手機抓包,即手機電腦在同一網絡下,並且修改手機wifi的代理。 )。可以看到左側並不是瀏覽器自帶的控制台,而是自帶的功能,在視察與修改左側元素時,我們手機上的內容也會隨之改變。

那麼如何實現上面的效果呢?

我們只需要在控制台左側的Rules中新增一條規則即可。

${監聽的網址} ://${實例名稱} 這個實例名稱是工具列中下拉框中的名字可以任意起

https://juejin.cn/ weinre://juejin 

點擊工具列中下面的即可跳到控制台頁面,再刷新下監聽網址的頁面即可審查元素。

借助控制台,我們可以更容易的解決真機相容性問題。

篡改回應

修改響應體還是很常用的,例如修復bug的時候,如果懷疑是介面回傳值有誤導致的問題,就可以透過修改響應體,來排查到底是不是後端的問題。

在調試介面的時候,例如後端介面新增了一個回傳值,我們需要根據這個回傳值進行對應的邏輯處理,這時候我們也可以透過修改回應體的方式mock一下新增的字段,只要確保自己mock的結果和介面回傳的結構一樣,就可以提前完成介面聯調。

具體做法:

前半段是請求位址(支援正規比對) 後半段是響應體的檔案。  file://${路徑} 預設找的是下檔。

Ctrl+右鍵點選橘色的路徑,會自動跳到下方對應的檔案裡,如果沒有會自動建立非常方便。

mock.json

可以看到加完配置之後對應介面的響應體就變成了mock.json裡面的內容。

解決跨域

解決跨域是篡改回應的一種應用,有的後端介面沒有配置CORS,導致前端介面跨域

歷史解決:透過vite 或等工具做一個反向代理

通過的可直接修改跨域介面的回應頭,增加cors 配置

/getList/ resHeaders://{cors}

# cors 文件
access-control-allow-credentials: true always
access-control-allow-headers: *
access-control-allow-methods: GET, PUT, POST, DELETE, HEAD, OPTIONS
access-control-allow-origin: *
access-control-expose-headers: *
access-control-max-age: 18000L
content-type: application/json
date: Fri, 02 Dec 2022 04:00:28 GMT
server: 123123
Access-Control-Allow-Origin: *

當然功能遠不止這些,還可以竄改API回應時間、HTTP回應狀態碼等。  。  。

篡改請求

可以使用修改修改請求體,它會把merge.json檔案的請求體合併到原本介面的請求體中。

/savePerson/ reqMerge://{merge.json}

# merge.json
{
    name:'张三'
}

進行js注入

使用可以在目標網址的中加入任意的js程式碼。我們這裡向頁面中註入一個行動端調試工具。  ${注入到哪個位址} ://${注入的js路徑}

https://juejin.cn/ jsPrepend://https://cdn.jsdelivr.net/npm/eruda@2.4.1/eruda.min.js
https://juejin.cn/ jsPrepend://{test.js}

test.js

var vConsole = new window.VConsole();

打開控制台可以發現,我們注入的js被添加到了head的最頂部。

成功顯示到了頁面上

域名映射

# 可以一个ip 配置多个域名 并且支持端口号
127.0.0.1:9000 ddd.com aaa.com