用Chrome和android SDK远程调试移动端页面

准备：

1. JDK，猛击我下载
2. Android SDK，猛击我下载
3. PC上的Chrome（17.0.963.66以上，因为我自己的是17.0.963.66，嘻嘻），猛击我下载
4. 移动端的Chrome，自己搜自己的吧

开始：

 

一．安装JDK，详细步骤见地址，这里就不详细展开啦，猛击我看步骤

二．安装Android SDK

1. 下载Android SDK：猛击我下载
2. 安装Android SDK：有两个地方要注意。一是到了下面这个界面的时候，等待一下，直到它找到自己的JDK为止：
   另外，安装的时候记下自己安装的路径，稍后有用。
3. 安装完Android SDK后，打开Android SDK Manager，安装Android SDK Platform-tools，如下图。如果网速太慢，可以到这个地址下载，猛击我下载（是platform-tools文件夹的压缩包），下载后解压到安装目录下即可
   
4. 配置path环境变量：在对应值后追加;/platform-tools
   其中为你的安装路径
   
5. 在cmd下输入命令adb,看到如下相关信息，表示配置成功
   

三．移动端设置：

1. 打开系统的USB调试功能：设定/设置（——应用程序设置）——开发——勾选“USB调试”
2. 打开移动端版本的Chrome：设置——开发者工具——勾选启用USB网页调试，然后随便打开一个网页。

四．连接：

1. 进入C:\Windows\System32\drivers\etc,编辑hosts文件（可用记事本打开），添加如下配置
   203.208.46.178 chrome-devtools-frontend.appspot.com，如图
   为什么要追加一条配置呢？因为原来的地址是会被和谐，而这个IP是北京Google的，貌似我们的远程功能要连接google去下载something。
2. 用你的数据线把移动端和PC连起来
3. 打开cmd，输入命令adb devices，成功找到设备如下图：
   
4. 输入命令adb forward tcp:9222 localabstract:chrome_devtools_remote
5. 打开PC端的Chrome，输入网址：http://localhost:9222/（大家可能留意到9222是因为上面的命令而设置的，所以这个端口是可改的^_^）
6. 如果你看到以下界面，表示你和手机连接基本没问题了
   
7. 点击那个小框后，耐心等待等待。。。。。。
   
8. 当你看到如下界面时，恭喜你，你成功了！！！欢乐去吧！！！
   

 

转载请注明来自 web前端开发， http://www.candoudou.com/archives/231