利用Vconsole和Fillder進(jìn)行移動(dòng)端抓包調(diào)試方法
在開發(fā)中,有時(shí)候我們需要在手機(jī)上進(jìn)行測(cè)試,可是如果遇到bug,我們?cè)趺催M(jìn)行抓包調(diào)試呢?這里介紹兩種方式:
- Vconsole
- Fillder
利用Vconsole進(jìn)行調(diào)試
一個(gè)輕量、可拓展、針對(duì)手機(jī)網(wǎng)頁的前端開發(fā)者調(diào)試面板
Vconsole特性:
- 查看 console 日志
- 查看網(wǎng)絡(luò)請(qǐng)求
- 手動(dòng)執(zhí)行 JS 命令行
- 自定義插件
入門
①首先需要下載Vconsole,地址https://www.npmjs.com/package/vconsole
②
npm install vconsole
③ Import dist/vconsole.min.js to your project:
<script src="path/to/vconsole.min.js"></script> <script> // init vConsole var vConsole = new VConsole(); console.log('Hello Vconsole'); </script>
利用Fillder進(jìn)行調(diào)試
打開Fiddler,然后點(diǎn)擊菜單欄的Tools > Options,打開“Options”對(duì)話框
在打開的對(duì)話框中切換到“HTTPS”選項(xiàng)卡。
在打開的“HTTPS”選項(xiàng)卡中,勾選“Capture HTTPS CONNECTs”和“Decrypt HTTPS traffic”前面的復(fù)選框,然后點(diǎn)擊“OK”。
Connection勾選允許遠(yuǎn)程連接
配置host文件:C:\Windows\System32\drivers\etc(該操作視情況而定)
重啟fiddler
用一個(gè)wifi設(shè)置手機(jī)代理,服務(wù)器地址為自己電腦的IP,端口跟fiddler一致(默認(rèn)8888)
用手機(jī)瀏覽器 打開IP:端口號(hào),下載證書
安裝完證書后,連接設(shè)置了代理的wifi
--------------可以happy的進(jìn)行調(diào)試了-----------------------------
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- 詳解vue移動(dòng)端項(xiàng)目代碼拆分記錄
- 使用vue開發(fā)移動(dòng)端管理后臺(tái)的注意事項(xiàng)
- vue插件mescroll.js實(shí)現(xiàn)移動(dòng)端上拉加載和下拉刷新
- 移動(dòng)端(微信等使用vConsole調(diào)試console的方法
- jQuery移動(dòng)端跑馬燈抽獎(jiǎng)特效升級(jí)版(抽獎(jiǎng)概率固定)實(shí)現(xiàn)方法
- jQuery實(shí)現(xiàn)適用于移動(dòng)端的跑馬燈抽獎(jiǎng)特效示例
- 如何封裝了一個(gè)vue移動(dòng)端下拉加載下一頁數(shù)據(jù)的組件
- 原生js實(shí)現(xiàn)移動(dòng)端Touch輪播圖的方法步驟
- js實(shí)現(xiàn)移動(dòng)端輪播圖
- 移動(dòng)端使用CSS或JS判斷橫屏和豎屏的講解
相關(guān)文章
通過Javascript將數(shù)據(jù)導(dǎo)出到外部Excel文檔的函數(shù)代碼
通過Javascript將數(shù)據(jù)導(dǎo)出到外部Excel文檔的函數(shù)代碼,需要的朋友可以參考下2012-06-06使用js實(shí)現(xiàn)將后臺(tái)傳入的json數(shù)據(jù)放在前臺(tái)顯示
今天小編就為大家分享一篇使用js實(shí)現(xiàn)將后臺(tái)傳入的json數(shù)據(jù)放在前臺(tái)顯示,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-08-08JavaScript實(shí)時(shí)更新當(dāng)前的時(shí)間的示例代碼
這篇文章主要介紹了JavaScript實(shí)時(shí)更新當(dāng)前的時(shí)間的示例代碼,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-07-07bootstrap table表格插件之服務(wù)器端分頁實(shí)例代碼
Bootstrap Table是基于Bootstrap的輕量級(jí)表格插件,只需要簡(jiǎn)單的配置就可以實(shí)現(xiàn)強(qiáng)大的支持固定表頭、單復(fù)選、排序、分頁、搜索以及自定義表頭等功能。這篇文章主要介紹了bootstrap table表格插件之服務(wù)器端分頁實(shí)例代碼,需要的朋友可以參考下2018-09-09js之點(diǎn)擊 超連接,提示一個(gè)層.點(diǎn)擊空白層消失
最近寫一個(gè)功能,需要用到點(diǎn)擊空白層就讓指定的一個(gè)層消失,這里簡(jiǎn)單介紹下實(shí)現(xiàn)方法,需要的朋友可以參考下2007-05-05JavaScript控制輸入框中只能輸入中文、數(shù)字和英文的方法【基于正則實(shí)現(xiàn)】
這篇文章主要介紹了JavaScript控制輸入框中只能輸入中文、數(shù)字和英文的方法,基于正則驗(yàn)證實(shí)現(xiàn)字符輸入限制功能,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2017-03-03CascadeView級(jí)聯(lián)組件實(shí)現(xiàn)思路詳解(分離思想和單鏈表)
本文介紹自己最近做省市級(jí)聯(lián)的類似的級(jí)聯(lián)功能的實(shí)現(xiàn)思路,為了盡可能地做到職責(zé)分離跟表現(xiàn)與行為分離,這個(gè)功能拆分成了2個(gè)組件并用到了單鏈表來實(shí)現(xiàn)關(guān)鍵的級(jí)聯(lián)邏輯,下一段有演示效果的gif圖2016-04-04