網頁在手機瀏覽器打開時,怎麼調試?
安卓設備的 Chrome 瀏覽器支持遠程調試,可以使用桌面瀏覽器的開發者工具。本文介紹如何進行遠程調試。

Step 1:啟用開發者模式
遠程調試需要打開”開發者模式”。如果你的手機已經打開,可以跳過這一步。
開發者模式的打開方法是,進入”設置 > 關於手機”菜單,找到”內部版本號”這一項(或類似名稱的條目),在上面連續按七次。退回上一級菜單,應該就能看到”開發者模式”。
進入其中,打開”USB 調試”選項。

Step 2:連接手機
使用 USB 線將手機和電腦連接起來。手機可能會有彈框,詢問是否允許訪問手機數據,選擇”允許”。

打開電腦的 Chrome 瀏覽器,進入”開發者工具”。點擊右上角三個點,進入設置菜單,打開”更多工具 / 遠程設備”窗口。

選中 “Discover USB devices” 選項。

這時應該可以看到手機已經連接成功了。

Step 3:調試網頁
安卓手機裡面,打開 Chrome 瀏覽器。這時,桌面電腦的開發者工具應該會同步顯示所有已經打開的 Tab 頁。
並且,開發者工具還有一個輸入框,讓你輸入想要訪問的網址。輸入以後,單擊”打開”,就會在手機瀏覽器打開這個網址。

在開發者工具裡面,所有已經打開的 Tab 頁,選中想要調試的網頁,點擊後面的”Inspect”按鈕。

這時,就會彈出一個獨立的調試窗口。左側是手機瀏覽器的預覽,右側是各種調試工具,供開發者使用。

“Inspect”按鈕旁邊的”更多選項”,還提供了重載、關閉等操作。

參考鏈接
- Debugging your website from Android Devices, Tapas Adhikary
- Get Started with Remote Debugging Android Devices, Kayce Basques
(完)












