29033人阅读
DHTML & H5（40）
兵马未动，粮草先行。安排好 debug 工作的道理也一样，调试的基本工作务必先于开发之前搞得好，不然后果很严重……！哈哈，这样的开场白太那个了……其实实不相瞒，俺的实际情况是，到项目后期才懂得那么一点页面调试手段，之前怎么弄……不怕见笑，还是 console.log/alert 几招，甚至几招都算不上，，好原始的说……嗯，少废话，来上货，，一、基于 weinre 的方案的：Weinre 主页：直接用 Weinre 那就要自己搭建服务器，麻烦。想不那么麻烦可以试试下面介绍的。A.Phonegap 集成了 Weinre：先在你欲调试的页面置入这段脚本，js src 源来自 phonegap 的，其中 # 号后面紧跟着就是你的 id，由你来指定：&script src=&/target/target-script-min.js#sp42&&&/script&然后启动你的 Chrome 浏览器，最好是 Chrome，别的浏览器不行，访问 ，便可看到我们十分熟悉的 Chrome 调试器界面：B.Adobe Shadow不是说要进军 HTML5 市场的吗，所以在 Weinre 的基础上搞了 Shadow（影子），Shadow&与 Phonegap 的相差无几。请恕我这里唐突，先来个Shadow 的官方介绍：关于Adobe Shadowweinre非常方便，目前来说是针对移动设备进行远程调试的最佳工具，但在进行真正的跨平台移动web应用开发时，通常开发者要面对多个不同型号的移动设备，此时要使用weinre同时同步在所有设备上进行调试就是一个非常费时费力的事情，Adobe在3月7日通过站点推出了Adobe Shadow，其核心利用了weinre进行远程调试，但是提供了针对多设备同步调试的功能。如果你感兴趣，可以在此下载试用：真正有用的地址：Adobe 蛮贴心的，还弄了个 bookmarklet，——俺有空还想瞧瞧这个小 bookmarklet 能作何用……javascript:(function(e){e.setAttribute(&src&,&http://debug.:8080/target/target-script-min.js#anonymous&);document.getElementsByTagName(&body&)[0].appendChild(e);})(document.createElement(&script&));void(0); // 最后这个 void(0); 亮了～二、Google 原生方案所谓“原生方案”，就是利用 Google Chrome 调试工具本身，与 Chrome for Android 浏览器自带的调试工具相对接，与上述的方案有点近似但更为强大。尽管 Google 这个方案比较强大，但是美中不足的是，因为要访问这个，所以对国内用户而言，是要翻墙的（总之一见到这个 *. 就逃不掉的了……）。Google 教程介绍得简洁明了，访问地址如下：我想还是略微介绍下使用步骤，主要的五步如下：1、确认你已经安装 Android SDK，因为我们需要命令行工具 adb.exetips：建议将 adb.exe 加入环境变量，方便调用。2、成功安装 sdk 后，敲入：adb forward tcp:9222 localabstract:chrome_devtools_remote会出现下列提示，表面建立守护进程成功：3、打开两边的浏览器，一个是手机上的，请注意不是默认浏览器，是 Chrome，切记；然后打开本地 PC 桌面的浏览器，接着输入地址：localhost:9222，供你选择浏览器的哪一张 tab 调试：4、点击后，跳到
（可能要翻墙），就可以 do what you want:5、最后，你在 console 控制台中试试 alert('Hello world!'); 看看？至于这个基于 Chrome 的原生方案，一点仍需注意的就是，在 Hybird 的模式下可能派不上用场，但前面介绍的 Weinre 方案相信可以。原因不详述了。另外是否支持 iPhone 呢？时间关系，我没有做多的测试。因为 iPhone 的 Chrome 装上了，也不知是不是就是使用着 Chrome 的核心？——这个真不晓得，因为曾听说过， 苹果不允许别的浏览器核心，，不过话说回来，既然 Android 弄好了，iPhone 也可以放心许多……P.S: 如果您是 iOS 程序员或者手头上有苹果的机器，那么就幸福多了，把你的 iPhone/iPad 升级到 iOS 6，然后在“设置 & Safari & 高级”开启 Safari 的远程调试功能即可，——不像 Android 的那样强制 Chrome 浏览器， iOS 使用自带的 Safari 即可。该功能点是 iOS 6 新增的功能，用来代替原来简单的“调试控制台”。接着就是打开 Safari，开启你要调试的网页。更详细的操作步骤在：《iOS6新功能 如何用 Mac远程调试iPhone》三、Logcat前两个方案都有一个特点，就是适合于界面的调试，html/css 那些，如果你只是调试 js，那么推荐用 Sdk 自带的 logcat 就可以。当然 Eclipse 那里已整合 Logcat（如上图），这里就介绍一下命令行的，不依赖 IDE。用法如下：adb logcat &|& grep Console?这样你 js 中的 console.log(xx) 可以打出来了。这里的话，同事告诉我 grep 是 liunx 过滤器，，注意有些手机并不支持浏览器 console 打印，我这里的 HTC 双擎便是不支持。后来换 Moto ME811 立刻 OK。ref :《安卓平台的javascript远程调试》《用Weinre远程调试移动网页》《getting-started-with-weinre-mobile-debugging-on-windows》还有我以前翻译的一篇文章：，不过现在感觉没什么用了……
&&相关文章推荐
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：1808710次
积分：18230
积分：18230
排名：第464名
原创：245篇
转载：19篇
译文：55篇
评论：916条直接在手机上调试Android APP教程-安卓教程-手机开发-壹聚教程网直接在手机上调试Android APP教程
Android应用程序调试和运行，是Android开发的一个重点，因为开发和调试不在同一设备，一般是安装虚拟机。本教程我们来学习如何在真实的设备上（比如手机）调试运行Android应用。
在本教程中，我们将使用Windows 64位平台上的下列工具：
Eclie 4.2 Juno
Sony Xperia Tipo
为了在真实设备上调试和运行应用，大体上需要遵循以下步骤：
如果你使用的是Android开发手机(ADP)，例如Nexus One或者Nexus S，下载Google的USB驱动。
如果你使用的是其他Android设备，如索尼、LG、HTC、那么下载对应OEM的USB驱动。
在手机上开启USB调试。
将设备连到电脑。
使用adb.exe devices命令确认设备已经成功连接。
设置Eclipse，以便手动选择运行应用的目标设备。
1. 下载USB驱动
如果您使用的是Android开发手机(ADP)的设备，你只需要打开Android SDK管理器然后安装谷歌的USB驱动程序。
如果你使用的是其他的Android设备，可以按照官方的Android USB驱动程序指南，下载自己的设备驱动程序。
正如前面提到的，我将使用索尼的Xperia Tipo。如果您使用的是索尼的设备，可以在索尼手机页面找到合适的驱动程序。在我的例子中，当手机插到电脑上时，就会提示需要安装索尼PC伴侣。
这将把所有手机连接到电脑需要的驱动程序都安装上，包括用于Android调试的USB驱动程序。我认为这应该是最现代化的智能手机的案例。如果你遇到任何问题，可以随时访问厂商的网页下载驱动程序。安装完驱动程序后，可能需要重新启动计算机。
2. 在设备上启用USB调试
为了在真实设备上运行Android应用，需要在手机上开启USB调试功能。
进入 &设置&
&开发者选项&
&USB调试&。
3. 把设备连接到电脑上
在本步骤中，必须将手机连接到PC，并确认它能被系统正确识别。如果这一步工作正常，这意味着USB驱动程序工作正常。
如果你的手机已经连接，打开命令提示符并进入到Android SDK的安装文件夹中，进入 platform-tools目录。在该文件夹中有很多Android的命令行工具。
粘贴以下命令：
1adb.exe devices
正如上图看到的，设备已成功连接，并被分配ID BX903DMU63。太好了!
4. Eclipse 开发设置
如果你已经开发了一段时间的Android应用程序，可能你一直在使用Android模拟器。 Eclipse中默认的设置是在Android虚拟设备上部署应用程序。因此，我们要对其进行配置，允许手动选择，我们希望应用程序运行在手动选择的设备上。其中的一个选项必须是我们的真实设备。
在Eclipse中选择&运行-&运行配置&。然后从左边列表中选择想要运行的Android项目。单击&目标&选项卡。选择选项&始终提示选择设备&。另外，您可以选择&启动所有兼容的设备/AVD&。此选项将在所有可用的Android设备上，包括模拟器和真实设备，在同一时间运行您的项目。
在本教程中我将使用一个工作区中已有的Android项目，它是一个简单的Android进度条的例子。
5. 运行项目
现在，当运行Android项目时会提示你选择一个设备。选中&选择一个运行中的Android设备&，然后选择自己的设备。
现在让我们看看我们的应用在真实设备上是什么样子的。这是主画面：
当我们轻点按钮：
这就是关于如何在Android真实设备上调试应用的Android教程。
名称：大小：9.96MM下载：
上一页： &&&&&下一页：相关内容在安卓设备上使用 Chrome 远程调试功能
你的网页内容在移动设备上的体验可能和电脑上完全不同。Chrome DevTools 提供了远程调试功能，这让你可以在安卓设备上实时调试开发的内容。
安卓远程调试支持：
在中调试网站。
在原生安卓应用中调试。
将屏幕从你的安卓设备上到你的开发机器上。
使用和来让安卓设备访问开发使用的服务器。
要开始远程调试，你需要：
安装 Chrome 32 或者之后的版本。
连接安卓设备用的 USB 线缆。
对于通过浏览器调试：安卓 4.0 以上并且安装了 。
对于通过应用调试：安卓 4.4 以上并且应用包括 WenView 组件。
提示：远程调试需要你电脑端的 Chrome 版本要高于安卓端的版本。想更好地使用此功能，请使用电脑端的
（Mac/Windows） 或者
发行版（Linux）。
如果使用远程调试的时候出现了问题，请参考 。
设置安卓设备
请按照以下说明来设置安卓设备：
1. 打开 USB 调试选项
在安卓设备上，进入设置&开发者选项。
设置页面的开发者选项
注意：在安卓 4.2 及以后的版本中，默认情况下开发者选项是隐藏的。要启用开发者选项，选择设置&关于手机然后点击版本号7次。
在开发者选项中，选中 USB 调试复选框。
在安卓上启用 USB 调试
之后会有一个警告，提示你是否要开启 USB 调试模式。选择 OK。
2. 连接你的设备
将你的安卓设备和电脑用 USB 线连接起来。
注意：如果你在 Windows 下进行开发，那么你需要为你的安卓设备安装驱动。具体可以参考安卓开发者网站上的
在 Chrome 中找到设备
在安卓设备上设置好远程调试后，在 Chrome 中找到你的设备。
在电脑端的 Chrome 里，在地址栏输入 chrome://inspect。进入后确认 Discover USB devices 已经勾选了：
**提示**：你也可以从 Chrome menu & More tools & Inspect Devices 来进入 chrome://inspect
在你的设备上，会跳出一个警告，告诉你是否要允许在电脑端进行 USB 调试。选择 OK。
提示：如果希望以后不再弹出系那个管提示，勾选 Always allow from this computer
注意：在远程调试时， Chrome 会阻止你的设备进入休眠状态。该特性对于调试相当有用，但在安全性上有所欠缺。所以在调试的时候要注意看好你的手机！
在电脑端，打开选项卡并启用 WebViews 调试后，chrome://inspect 页面会显示全部已连接的设备。
从 chrome://inspect 也卖弄查看已连接的设备
如果从 chrome://inspect 页面查找设备时遇到了问题，请参考
调试远程浏览器
在页面 chrome://inspect 上，你可以加载 DevTools 并且调试你的远程浏览器。
要开始调试，请点击你希望调试的浏览器选项卡下面的 inspect。
接着你的电脑会加载新的 DevTools。在新的 DevTools 上，你可以在你的安卓设备上和选中的浏览器实时交互。
通过电脑上的 DevTools 来调试安卓手机上的网页
比如，你可以在你的设备上使用 DevTools 来监审查网页元素：
当你的鼠标悬浮在 Elements 面板中的某个元素上时，DevTools 会在你的设备上高亮显示相关元素。
你也可以点击 审查元素
然后点击设备的屏幕，DevTools 就会在 Elements 面板中让选中的元素高亮显示。
注意：你设备的 Chrome 版本将会决定远程调试中 DevTools 的版本。由于这个原因，你在远程调试时使用的 DevTools 可能和你平常使用的不大一样。
下面是使用远程调试功能的一些提示：
按 F5（或者在Mac上 Cmd + r）来重新加载远程页面。
让设备的网络处于打开状态。使用
面板来查看实际移动设备的网络流状态。
面板来分析提交数据和 CPU 使用状态。在移动设备上运行的程序通常会比在开发机器上运行的要慢一些。
如果你是在本地的 web 服务器上运行的，使用或者 技术来让设备访问你的站点。
调试 WebViews
在安卓 4.4 及后续版本中，你可以使用 DevTools 来调试原生安卓应用中的 WebView 的内容。
将 WebViews 配置为可调试状态
你的应用程序必须允许调试 WebView。要开启 WebView 调试，在 WebView 类里面调用静态函数 setWebContentsDebuggingEnabled。
if (Build.VERSION.SDK_INT &= Build.VERSION_CODES.KITKAT) {
WebView.setWebContentsDebuggingEnabled(true);
该设置对该应用中所有的 WebView 都会生效。
提示： WebView 的调试并不会受到应用中 manifest 文件的 debuggable 标签状态的影响。如果你想只有在 debuggable 为 true 时启用 WebView 调试，请在运行的时候测试该标签的状态。
if (Build.VERSION.SDK_INT &= Build.VERSION_CODES.KITKAT) {
if (0 != (getApplicationInfo().flags &= ApplicationInfo.FLAG_DEBUGGABLE))
{ WebView.setWebContentsDebuggingEnabled(true); }
在 DevTools 中打开 WebView
chrome://inspect 页面会显示设备中所有可调试的 WebView.
要开始调试，点击你想调试的 WebView 下面的 inspect。接下来就像使用一样使用 DevTools。
使用 Chrome DevTools 来调试远程安卓 Webview
在 WebView 中列出的灰色图片表示其大小以及相对设备屏幕的大小。如果你的 WebView 有设置名称，那么其名称也会列出来。
要在两个屏幕间不断转移注意力是相当不方便的。Screencast 将你设备的屏幕显示在开发机上的 DevTools 右侧。你也可以在 screencast 中与你的设备进行交互。
在 KitKat 4.4.3，screencast 既可以给浏览器选项卡使用也可以给安卓 WebView 使用。
开启截屏会话
要开启 screecast，点击远程调试窗口右侧上方的 Screencast
Screecast 图标
Screencast 面板在左侧打开并且显示设备屏幕的实时状况。
在你的电脑上与你的安卓设备实时进行交互
截屏只会显示网页内容。该截屏的透明部分涵盖了多功能框、设备键盘以及其他设备接口。
注意：由于截屏会连续捕获帧，会造成不小的性能开销。如果你的测试是对帧速率敏感的，最好禁用截屏。
使用截屏来与设备交互
当你使用截屏来互动的时候，点击会被转换为触屏，会在设备上触发适当的触控事件。电脑端的按键会发送到设备，这样就可以避免使用大拇指来打字。
其他的 DevTools 工作也可以在截屏上使用。例如，要检查元素，点击 Inspect Element
然后在截屏内点击就可以查看网页源码中对应部分。
要模拟一个缩放手势，拖动鼠标的时候按住 Shift。要在页面上滚动，使用你的触控板或者鼠标滚轮，也可以拖动鼠标指针。
你的手机不一定所有时候都能直接连接到你开发用的服务器。他们可能处于不同的网络环境下，此外，你也可能在一个受限的企业网络下进行开发。
Chrome for Android 上的端口转发使得在移动设备上测试你所开发的站点变得轻松很多。其工作原理是在你的移动设备上创建一个监听 TCP 端口，该端口映射到你的开发机器上的一个指定 TCP 端口。这些端口之间的流量通过 USB 来传输，因此该连接不需要依赖于你的网络环境。
要启用端口转发：
在你开发用的机器上打开 chrome://inspect。
点击 Port Forwarding。下面是端口转发的设置页面。
在 Device port 后面输入你的安卓设备希望监听的端口号（默认是8080）。
在 Host 后面输入你的 web 应用运行环境的 IP 地址（或者主机名称）以及端口号。
检查 Enable port forwarding 是否已经勾选。
点击 Done 来完成设置。
端口转发设置
当端口转发开启成功时，chrome://inspect 页面的端口状态将会显示为绿色。
使用端口转发来在你的安卓设备上查看本地网页
现在你可以打开一个新的 Chrome for Android 选项卡并且在你的设备上查看本地服务器的内容。
虚拟主机映射
当你在 localhost 域名上进行开发的时候，端口转发非常有效。但是有些情况下你可能需要是哟高自定义的本地域名。
例如，假设你正在使用的第三方 JavaScript SDk 只有在白名单上的域名中才能运行。所以你需要在你的端口文件中加入一个进入点，比如 127.0.0.。又或者你需要在你的 web 服务器上通过虚拟主机来设置特定的域名。
如果你想让你的手机能够访问到你自定域名上的内容，你可以结合端口转发和代理服务器技术。代理会把来自设备上的请求映射到主机上的相应位置。
在代理上使用端口转发
虚拟主机映射要求你在主机上开启一个代理服务器。所有来自你的安卓设备的请求都会发送到这个代理上。
要在代理上使用端口转发：
在主机上安装代理软件，比如
运行代理服务器，要记住该服务器使用的端口号。 注意：代理服务器和你开发用的服务器必须在不同的端口上运行.
在 Chrome 浏览器中，进入 chrome://inspect。
点击 Port forwarding。下面是端口转发设置页面。
在 Device port 后面输入你的安卓设备希望监听的端口号。使用安卓允许的端口，比如 9000.
在 Host 处输入 localhost:XXXX，其中 XXXX 是你的代理服务器占用的端口号。
检查 Enable port forwarding 是否已经勾选。
点击 Done 来完成设置。
代理服务器的端口转发
在你的设备上设置代理
你的安卓设备需要和主机上的代理服务器交互。
要在你的设备上设置代理：
选择 设置 & WiFi。
长按你当前连接的网络。注意：代理设置适用于所有网络.
点击修改网络。
选择高级设置。代理设置页面如下：
点击代理菜单并选择手动。
在代理主机名处输入 localhost。
在代理端口号处输入 9000。
点击保存。
通过这些设定，你的设备会将它所有的请求都发给代理服务器。该代理代表你的设备发出新的请求，故而对你本地特定域名的请求会被合理地解析。
现在你就可以像在主机上那样在 Chrome for Android 上加载本地域名了。
使用虚拟主机映射技术来在安卓设备上访问特定的本地域名
提示：要恢复正常的浏览模式，在断开连接后将设备上的代理设置还原就可以了。
我在 chrome://inspect 页面无法看到我的设备
如果你在 Windows 下进行开发，请确认你是否安装好了你的设备所对应的驱动。安卓开发者网站上的
可供参考。
确认你的设备是否直接或者通过集线器连接到了你的主机上。
确认设备上 USB 调试模式 有没有打开。记得在提示是否允许 USB 调试的时候选择是。
在电脑上打开 chrome://inspect 并确认 Discover USB devices 有没有勾选。
远程调试要求你电脑上的 Chrome 版本高于安卓设备的。尽量使用 （Mac/Windows）或者
发行版（Linux）。
如果你仍然无法看到你的设备，请断开设备与主机的连接。然后在你的设备上，打开 设置 & 开发者选项。选择撤销 USB 调试授权。然后重新尝试以及。
在 chrome://inspect 页面中我无法看到我的浏览器选项卡
在你的设备中，打开 Chrome 浏览器并进入到你想调试的页面。然后刷新 chrome://inspect 页面。
我无法在 chrome://inspect 页面中看到我的 WebView
确认在你的应用中已经启用。
在你的设备上，启动应用并打开你想调试的 WebView。然后，刷新 chrome://inspect 页面。
在我的安卓设备上我无法访问 web 服务器
如果是网络限制条件导致你的设备无法连接到开发用的服务器，请尝试或者。
最后，如果远程调试仍然无法工作，你可以使用 Android SDK 中的 adb 二进制包将你的工作流恢复到最近的状态。
远程调试和 ADB
在远程调试浏览器选项卡以及 WebView 的时候你不要设置 ADB 或者 ADB 插件。Android 上的远程调试现在是标准 Chrome DevTools 的一部分。在所有的操作系统上它都可以使用：Windows，Mac，Linux 以及 Chrome OS。
如果你在使用远程调试的时候遇到了问题，你可以尝试通过 Android SDK 提供的 adb 二进制包来使用。
注意：你的安卓设备和 Chrome 之间的连接可能会中断 adb 连接。在建立 adb 连接前，取消 chrome://inspect 上对 Discover USB devices 的勾选。您目前使用的浏览器该进博物馆啦~~~
为了更佳的浏览体验，请使用现代浏览器访问本站
Outdated Browser
您的浏览器已禁用 Javascript，启用它获得更好的体验。
Outdated Browser
这是为桌面用户准备的工具，但您可以安心在这里浏览
46.5% 的互联网用户在使用 此款浏览器
GOOGLE CHROME
支持如下操作系统
16.5% 的互联网用户在使用 此款浏览器
MOZILLA FIREFOX
支持如下操作系统
21.6% 的互联网用户在使用 此款浏览器
INTERNET EXPLORER
支持如下操作系统
10.3% 的互联网用户在使用 此款浏览器
APPLE SAFARI
支持如下操作系统
1.5% 的互联网用户在使用 此款浏览器
支持如下操作系统
冷静 这是为桌面用户提供的不是为手机用户提供的