成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

移動(dòng)端所有瀏覽器頁面調(diào)試方法

betacat / 3558人閱讀

摘要：在測(cè)試過程中，通常解決兼容性占了大部分時(shí)間，對(duì)那些手機(jī)廠商自帶瀏覽器和第三方瀏覽器深惡痛絕，為什么不使用統(tǒng)一標(biāo)準(zhǔn)。移動(dòng)端瀏覽器調(diào)試工具頁面調(diào)試抓包工具。體驗(yàn)肯定沒端瀏覽器的好，但能夠滿足大部分調(diào)試的需求。

通常在移動(dòng)端頁面調(diào)試時(shí)，除了移動(dòng)端chrome和safiri,幾乎對(duì)其他瀏覽器無法調(diào)試。在測(cè)試過程中，通常解決兼容性占了大部分時(shí)間，對(duì)那些手機(jī)廠商自帶瀏覽器和第三方瀏覽器深惡痛絕，為什么不使用統(tǒng)一標(biāo)準(zhǔn)。

spy-debugger 移動(dòng)端瀏覽器調(diào)試工具

頁面調(diào)試、抓包工具。遠(yuǎn)程調(diào)試任何手機(jī)瀏覽器頁面，任何手機(jī)移動(dòng)端webview（如：微信，HybridApp等）。支持HTTP/HTTPS，無需USB連接設(shè)備。

1.安裝

需要安裝node，在這不做介紹了，然后安裝 spy-debbugger 依賴包到全局環(huán)境。（這里使用了npm,yarn也不錯(cuò)）

npm install spy-debugger -g
2.PC端運(yùn)行

打開終端運(yùn)行

spy-debugger

當(dāng)出現(xiàn)下圖所示即表示在PC端運(yùn)行成功，記住IP和node-mitmproxy啟動(dòng)端口，后面需要使用，上圖這個(gè)樣子就成功啟動(dòng)了，瀏覽器打開 http://127.0.0.1:65443，后續(xù)調(diào)試的的功能都在這個(gè)頁面上操作。

3. 設(shè)置手機(jī)端HTTP代理

首先電腦和手機(jī)保持在一個(gè)網(wǎng)絡(luò)下，或連接同一個(gè)wifi。然后到手機(jī)端設(shè)置所連wifi的代理。進(jìn)入wlan列表，


長按或者點(diǎn)擊最右的箭頭（IOS是i符號(hào)），進(jìn)入當(dāng)前wifi詳情頁


手機(jī)滑到最下面有個(gè)代理，點(diǎn)開選擇為手動(dòng)


然后連接電腦端的代理，就下圖中的 將第2步中的IP和端口分別填入主機(jī)名和端口

4.手機(jī)端下載并安裝證書（首次使用安裝）

手機(jī)端第三方瀏覽器輸入 http://s.xxx （不要用自帶瀏覽器和微信瀏覽器），下載證書到本地。

安卓端安裝證書的兩種方式：

其一：設(shè)置——WiFi——高級(jí)設(shè)置——安裝證書

其二：設(shè)置——更多設(shè)置——系統(tǒng)安全——從存儲(chǔ)設(shè)備安裝證書

IOS端安裝證書的方式看下面鏈接就行：

https://www.jianshu.com/p/d31...

5.用手機(jī)瀏覽器訪問你要調(diào)試的頁面即可

下圖就是用手機(jī)端瀏覽器打開頁面，targets會(huì)顯示監(jiān)聽到打開的頁面。

菜單欄的 Elements 、Resources、Network、Timeline、Console和chrome的開發(fā)工具項(xiàng)類似。

體驗(yàn)肯定沒PC端瀏覽器的好，但能夠滿足大部分調(diào)試的需求。

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/101501.html

相關(guān)文章

  • 移動(dòng)端所有瀏覽器頁面調(diào)試方法

    摘要：在測(cè)試過程中，通常解決兼容性占了大部分時(shí)間，對(duì)那些手機(jī)廠商自帶瀏覽器和第三方瀏覽器深惡痛絕，為什么不使用統(tǒng)一標(biāo)準(zhǔn)。移動(dòng)端瀏覽器調(diào)試工具頁面調(diào)試抓包工具。體驗(yàn)肯定沒端瀏覽器的好，但能夠滿足大部分調(diào)試的需求。 通常在移動(dòng)端頁面調(diào)試時(shí)，除了移動(dòng)端chrome和safiri,幾乎對(duì)其他瀏覽器無法調(diào)試。在測(cè)試過程中，通常解決兼容性占了大部分時(shí)間，對(duì)那些手機(jī)廠商自帶瀏覽器和第三方瀏覽器深惡痛絕，為...

    xuweijian 評(píng)論0 收藏0

  • 9102了，你還不會(huì)移動(dòng)端真機(jī)調(diào)試？

    摘要：移動(dòng)端調(diào)試?yán)щy很多時(shí)候，我們?cè)谶M(jìn)行移動(dòng)端開發(fā)時(shí)，都是先在端使用手機(jī)模擬器進(jìn)行調(diào)試，沒有問題后，我們才會(huì)在手機(jī)端的瀏覽器進(jìn)行測(cè)試，這個(gè)時(shí)候，如果沒有出現(xiàn)問題，皆大歡喜。 移動(dòng)端調(diào)試?yán)щy 很多時(shí)候，我們?cè)谶M(jìn)行移動(dòng)端開發(fā)時(shí)，都是先在PC端使用手機(jī)模擬器進(jìn)行調(diào)試，沒有問題后，我們才會(huì)在手機(jī)端的瀏覽器進(jìn)行測(cè)試，這個(gè)時(shí)候，如果沒有出現(xiàn)問題，皆大歡喜。但是一旦出現(xiàn)問題，我們就很難解決，因?yàn)槿狈梢暬?..

    lushan 評(píng)論0 收藏0

  • 前端如何高效的與后端協(xié)作開發(fā)

    摘要：移動(dòng)端應(yīng)用一般都運(yùn)行在微信瀏覽器中中手機(jī)瀏覽器中。因?yàn)槲⑿艦g覽器是定制的瀏覽器，一般的遠(yuǎn)程調(diào)試方式都不可用，需要配合特定的工具，如微信開發(fā)者工具。 前端如何高效的與后端協(xié)作開發(fā) 1. 前后端分離 前端與后端的分離，能使前端的開發(fā)脫離后端的開發(fā)模式，擁有更大的自由度，以此便可做前端工程化、組件化、單頁面應(yīng)用等。 可以參考：前后端分離、web與static服務(wù)器分離 2. 盡量避免后端模板...

    rozbo 評(píng)論0 收藏0

  • 前端如何高效的與后端協(xié)作開發(fā)

    摘要：移動(dòng)端應(yīng)用一般都運(yùn)行在微信瀏覽器中中手機(jī)瀏覽器中。因?yàn)槲⑿艦g覽器是定制的瀏覽器，一般的遠(yuǎn)程調(diào)試方式都不可用，需要配合特定的工具，如微信開發(fā)者工具。 前端如何高效的與后端協(xié)作開發(fā) 1. 前后端分離 前端與后端的分離，能使前端的開發(fā)脫離后端的開發(fā)模式，擁有更大的自由度，以此便可做前端工程化、組件化、單頁面應(yīng)用等。 可以參考：前后端分離、web與static服務(wù)器分離 2. 盡量避免后端模板...

    learning 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

閱讀需要支付1元查看
<