【准备】
1、在Android手机上安装Chrome( Chrome for Android )
应用超市、或者google官网即可下载。
2、电脑系统安装了最新版的Chrome
最新版Chrome,确保开发者工具正常使用
3、Android手机装了USB驱动
在设备管理器查看是否正确安装了驱动,如无,则需要到手机的官网下载,例如:小米1S的驱动http://bbs.xiaomi.cn/thread-121613-1-3.html
【开始】
一、安装Android SDK
下载Android SDK,地址:http://developer.android.com/sdk/index.html,本人的机器是windows,下载的文件为adt-bundle-windows-x86,解压并释放到D:/soft/android/adt(你也可以选择其他路径)
二、允许Android 手机启用USB调试
1、android系统设置:“设置”》“开发人员选项”》“USB调试”;
2、手机上Chrome浏览器设置:打开Chrome浏览器,点击左下角菜单按键,“设置”》“开发者工具”》“启用USB网页调试”
三、运行Android SDK
1、设置环境变量:右击“我的电脑”》“属性”》“高级”》“环境变量”》编辑“PATH”变量值,在末尾添加“;D:\soft\android\adt\sdk\platform-tools”
2、运行adb
打开cmd,输入如下命令:
adb forward tcp:9222 localabstract:chrome_devtools_remote
详情如图:
四、调试
1、在手机上用Chrome打开需要调试的网站
2、在电脑上用Chrome打开http://localhost:9222/,如图所示:
3、调试
点击需要调试的网站,熟悉的Developer Tools就出来了,如图所示:
【完成】
至此,利用Chrome在android手机上调试网站的方法告一段落。
更详细的方法请看:
https://developers.google.com/chrome-developer-tools/docs/remote-debugging
更多的资料请参考:
http://www.html5rocks.com/en/mobile/profiling/
相关推荐
首先,你需要在PC上安装Android SDK,这是调试Android设备的基础。Android SDK可以从官方网站下载,并按照官方文档(http://developer.android.com/sdk/installing/index.html)中的指示进行安装。安装完成后,你...
这款工具集成了IntelliJ IDEA插件和库,允许开发者在Android设备或模拟器上实时监控和调试Redux的状态变化,从而提升开发效率和代码质量。 首先,Redux是一个JavaScript的状态容器,提供可预测化的状态管理。它通过...
5. **Android SDK**:Android软件开发工具包,提供了开发、测试和调试Android应用所需的各种工具。了解SDK的使用对于理解这个DEMO的工作原理至关重要,因为调试工具可能依赖于ADB(Android Debug Bridge)来与设备...
8. **调试工具**:为了便于开发者调试和测试,AndroidUI4Web可能提供了专用的开发者工具,类似于Chrome DevTools,帮助开发者查看和调整组件状态,定位性能问题。 在实际应用中,开发者可以通过学习AndroidUI4Web...
Chrome Inspect 是一款强大的开发工具,它允许开发者对运行在各种设备上的网页应用进行远程调试。这个"chrome-inspect离线开发者工具包@194530_@196351.rar"文件很可能包含了离线版本的Chrome开发者工具,这在没有...
在IT行业中,尤其是在Web开发领域,开发者经常遇到各种调试问题,其中之一就是Chrome DevTools的WebView Inspector出现空白页的情况。这可能会极大地影响开发进度和效率。本文将深入探讨这个问题,提供解决方案,并...
手机端Web项目的测试和调试过程需覆盖多种设备和屏幕尺寸,可以使用模拟器、真机测试、远程调试工具(如Chrome DevTools)等方法,确保应用在各种环境下都能正常工作。 综上所述,手机端Web项目开发涵盖的技术范围...
基于Android的Web APP开发,主要是利用Web技术(如HTML5, CSS3, JavaScript等)结合Android平台的WebView组件来构建可以在手机上运行的Web应用。这种开发方式有以下几个关键点: 1. **WebView组件**:WebView是...
由于模拟器与本地开发环境的紧密连接,我们可以使用Chrome DevTools或Firefox Developer Tools的远程调试功能,直接在模拟器中进行网页的调试。 总结,"Android模拟器访问本地Web应用"这一主题涵盖了从创建和配置...
- **调试工具**:Chrome DevTools 是调试Android Web应用的强大工具。 - **步骤**: - 将Android设备通过USB连接到电脑。 - 在Chrome浏览器中启用开发者模式,连接设备。 - 利用DevTools查看网络请求、修改样式、...
8. **Web Inspector工具**:对于iOS设备,可以使用Safari的Web Inspector,对于Android设备,可以使用Chrome浏览器内置的开发者工具,或者使用Weinre(Web Inspector Remote)进行远程调试。 9. **JavaScript调试**...
通过在应用中集成Stetho,开发者可以利用Chrome Developer Tools(简称Chrome DevTools)进行远程调试,这与在Web开发中使用DevTools的方式相似。 1.2 主要功能 - SQLite数据库查看与操作:查看、编辑、执行SQL语句...
Go-chromedp是利用这个协议编写的一个Go语言库,它允许开发者直接控制和支持多种浏览器,包括Chrome、Edge、Safari以及Android上的浏览器,而无需依赖像Selenium或PhantomJS这样的外部工具。本文将深入探讨Go-...
6. **调试与优化**:Android Studio提供了一系列工具,如Chrome DevTools,可以远程调试WebView中的Vue应用,进行性能优化和问题排查。 7. **安全与性能**:为了提高安全性,可以考虑使用HTTPS而非HTTP,尽管对于...
9. **调试与优化**:使用Chrome开发者工具(Chrome DevTools)的远程调试功能,可以对`WebView`内的JavaScript进行调试,优化网页性能和用户体验。 10. **学习资源**:对于想深入学习这一领域的开发者,可以参考...
在 Android 平台上,Chromium 提供了一个强大的、高度可定制的 Web 渲染引擎,使得开发者能够构建高性能的 Web 应用和浏览器。本系列文章用图将深入探讨 Chromium 在 Android 上的关键组件、工作原理以及如何进行...
在Android设备上,可以使用Chrome DevTools的远程调试功能,将手机连接到电脑并同步浏览器视图进行调试。iOS设备则可以通过Safari的Web检查器进行类似操作。 5. **性能优化**:手机硬件资源有限,过多的SVG动画可能...
这一功能允许开发者在远程设备上运行Chrome,并通过本地开发工具进行实时调试,极大地提高了Web应用的开发与调试效率。源码分析通常包括对通信协议、调试接口、数据传输机制等方面的研究。 【标签】"Chrome","远程...
7. **调试工具DevTools**:Chrome DevTools是开发者调试Web应用的重要工具,源码可以揭示其内部工作原理,帮助你理解如何调试JavaScript、查看性能瓶颈等。 8. **性能优化**:Chrome源码还涉及到性能优化技巧,例如...
利用Chrome DevTools的远程调试功能,可以在Chrome浏览器中调试Hybrid App中的JavaScript代码,提高开发效率。 总结,"js与android交互"涉及JavaScript Interface、WebView方法调用、异步通信机制以及安全性和生命...