在桌面chrome中调试android设备中的web页面

准备工作

1, 桌面版chrome

2, Android设备(安装有chrome浏览器)

3, Android-sdk

Android-sdk安装及设置

SKD安装

http://developer.android.com/sdk/index.html下载android-sdk开发包,安装后,执行SDK Manager.exe,安装android SDK Platform-tools工具包。

clip_image001

环境变量配置:

在环境变量添加path,并添加路径<sdk>/platform-tools;

clip_image002

添加后,在cmd窗口执行adb,看到如下相关信息,表示配置成功。

clip_image004

Android设备工作

开启USB调试选项

进入设置,选择开发者选项,勾选USB调试

clip_image006

开启android设备上面chrome中USB网页调试选项

clip_image008

开始调试准备

设备检测

连接数据线后,进入cmd命令行,输入 adb devices,查看是否有设备列表。如图:

clip_image009

Chrome快捷方式

添加chrome快捷方式到桌面,修改目标:<path>\chrome.exe --remote-debugging-port=9222 --user-data-dir=remote-profile

点击该快捷方式启动chrome,在浏览器地址栏输入:localhost:9222

clip_image010

有缩略图可以选择。点击后,如果无法显示该页,请配置host文件

HOST配置

进入C:\Windows\System32\drivers\etc,编辑HOST文件,添加如下配置。

203.208.46.178 chrome-devtools-frontend.appspot.com

无法没有保存权限,请查找相关教程。

调试页面

前面工作完成后,点击localhost:9222中的缩略图,进入调试页面:

clip_image012

可以看到控制台,在console窗口中可以看到打印信息。

转载于:https://my.oschina.net/smellok/blog/75787

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值