使用 PC 版 Chrome 來 Debug 手機版的 Chrome
  • 16,634 views,
  • 2015-05-04,
  • 上傳者: Kuann Hung,
  •  0
如果要開發手機版的網頁,經常會遇到一個問題就是,在 PC 上有很方便的 DevTools,但是在手機上面就很痛苦了~~~
幸好 Android 提供了一個好方法來 Debug~ 
 
先看看設定好之後的結果吧~ 第一張圖是手機的畫面,第二張就是電腦的畫面,操作會同步反應到手機上喔!!
 
48c1d2426049e5e445e6865a1cee7f05.png
 
a8f63a7c6b2bc532d54717fe2965b3b0.png
設定步驟
1.
準備需要的軟體
  1. 當然是 Chrome 囉~ 在 PC 跟 Android 手機上都需要安裝喔!
  2. 用 USB 線接到你的電腦上
  3. 這需要 Android 4.0 以上的版本才能使用喔!
2.
啟用 USB 偵錯
先到 [設定] > 啟用 [開發人員選項] 中,開啟 [USB 偵錯]
 
* 如果找不到開發人員選項,請參考 解開 Nexus 5 封印
3.
更新 USB Driver
可以到這邊下載 Google 的 USB Drivers
或是直接下載 latest_usb_driver_windows.zip
 
下載解開後,進入裝置管理員,找到你的設備,並 更新驅動程式
更新好後就會看到 Android Device > Android Composite ADB Interface 
這樣就 ok 了~!
 
* 如果你不是用 Nexus 系列的話,可能要確認一下是否可以更換回來喔!!!  (不要跟我確認喔!!!)
4.
接上 USB
接上之後,手機應該會跳一個請你驗證的畫面
5.
開啟  Chrome (手機跟 PC 的都要開啟)
在 PC 的 Chrome 輸入 chrome://inspect/
6.
按下 [inspect] 就可以使用囉!
 
Facebook 討論區載入中...
資料夾 :
發表時間 :
2015-05-04 17:43:00
觀看數 :
16,634
發表人 :
Kuann Hung
部門 :
老洪的 IT 學習系統
QR Code :