chrome调试webview

原创 2015年11月17日 22:26:34

1.来看下高大上的chrome://inspect 
通过它和USB,你可以调试andriod手机上的h5页面,非常的方便和强大。 它支持以下的调试: 1.浏览器tab页打开的h5页面 
2.webview里面打开的页面 
3.实时将你andriod设备的屏幕录制到你的开发机上 
4.通过port forwarding和virtual host mapping调试你自己的开发服务器

如果想要调试,你需要准备: 1.开发机上有chromne 32或以上版本(实验证明需要40以上的版本) 
2.用USB将设备连接到电脑上 
3.对于浏览器调试,需要andriond 4.0+及chrome for andriod 
4.对于app调试,需要andriod 4.4+及webview特殊配置 
PS:对于远程调试,需要你开发机上面的chrome版本比andriod设备上面的chrome版本新,为了保险,可以用 Chrome Canary(Mac/Windos)或者Chrome Dev channel release(Linux)

现在开始调试: 1.需要开启设备USB调试。 

2.将设备通过USB连接到电脑上

3.在电脑上的chrome打开chrome://inspect,这时候可以看到你的设备了: 

4.在设备的chrome中打开一个网站,变可以看到: 

点击“inspect”,便会启动一个devloper tools: 

所有chrome可以做的,这里都可以做,非常强大

版权声明:本文为博主原创文章,未经博主允许不得转载。

app移动端H5页面开发调试之Chrome远程调试

移动端采用原生开发还是H5开发一直接争论不休。但不论怎么说,采用H5开发app不仅仅快速高效,而且布局简单、漂亮,目前许多的框架已经可以做到让人看不出是原生还是H5开发了。 采用H5开发有一个好处就是...
  • gfg156196
  • gfg156196
  • 2016年05月23日 15:51
  • 4131

使用Chrome 浏览器调试移动端网页 chrome://inspect/#devices

我使用的是小米(红米NOTE2 ),电脑是win 10 系统,以下几步就可以轻松使用浏览器内置的功能调试移动端网页了: 1. 手机开启调试模式连接电脑,确保是调试模式连接的(不知道怎么打开调试模式的可...
  • byc233518
  • byc233518
  • 2016年09月05日 09:35
  • 24740

移动端Web开发调试之Chrome远程调试(Remote Debugging)

近几年,浏览器厂商也纷纷推出自己的远程调试(RemoteDebugging)工具,比如Opera Mobile 可以借助其推出的跨设备跨平台桌面开发者工具Opera Dragonfly 实现远程调试,...
  • freshlover
  • freshlover
  • 2015年01月08日 20:22
  • 167123

使用Chrome DevTools调试安卓设备WebViews

一.摘要       移动端自动化脚本编写时,常常碰到混合型APP,这就涉及到对webview的处理。由于使用uiautomater不能直接对webview界面元素进行定位,这就需要我们借助其他工具...
  • dushu990
  • dushu990
  • 2016年09月30日 09:48
  • 2393

Android WebView调试利器之 Chrome DevTools

前言Android开发时不时需要与H5交互这个时候如果没有能调试的工具效率简直是极低,我们项目就有一个活动页面需要与H5交互,当时还不知道有这么一个调试工具的时候只能用alert()(关键是这个问题他...
  • lipingaccp
  • lipingaccp
  • 2017年08月06日 23:51
  • 665

webview基本调试技巧

随着嵌入式硬件平台的迅速发展,目前JS与WEBKIT的应用越来越广泛。目前在ANDROID平台,有幸可以尝试下这方面的应用开发。   webview的基本用法:   mWebV...
  • focusxi
  • focusxi
  • 2011年09月16日 11:58
  • 2576

调试Android WebView

调试Android WebView   从Android4.4(KitKat)开始,可以使用DevTools对原生Android应用程序的Android WebViews内容进行调试。 ...
  • y_chengyong
  • y_chengyong
  • 2016年02月24日 16:02
  • 4940

app移动端H5页面开发调试之Chrome远程调试

移动端采用原生开发还是H5开发一直接争论不休。但不论怎么说,采用H5开发app不仅仅快速高效,而且布局简单、漂亮,目前许多的框架已经可以做到让人看不出是原生还是H5开发了。 采用H5开发有一个好处就是...
  • gfg156196
  • gfg156196
  • 2016年05月23日 15:51
  • 4131

利用 Chrome 开发者工具远程调试 Android 中的原生 WebView

之前写过一篇关于 Android Studio 断点调试技巧 的文章,但都是针对 Native 代码的调试,对于 Hybrid 开发模式下的 WebView 却无从下手。幸运的是,PC 中的 Chro...
  • u010164190
  • u010164190
  • 2017年05月03日 10:58
  • 1336

移动端Web开发调试之Chrome远程调试(Remote Debugging)

近几年,浏览器厂商也纷纷推出自己的远程调试(RemoteDebugging)工具,比如Opera Mobile 可以借助其推出的跨设备跨平台桌面开发者工具Opera Dragonfly 实现远程调试,...
  • freshlover
  • freshlover
  • 2015年01月08日 20:22
  • 167123
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:chrome调试webview
举报原因:
原因补充:

(最多只允许输入30个字)