借助Stetho在Chrome上调试Android网络&数据库

先来谈谈我的数据库调试历程

第一阶段:

这里写图片描述

这个熟悉的界面,记得那是13年初的时候,想要查看sqlite里面的数据都要通过这个Android Device Monitor找到/data/data/com.xxx.xxx/databases里面的db文件,然后导出到PC上,最后用PC上的数据库工具打开来查看。

还会遇到data文件夹死活打不开的情况(权限问题),说多了都是泪��

第二阶段:

后来手机上出现了一些资源查看的App(需要root权限),可以直接在手机上查看数据库啦

这里写图片描述

~(上图为RE文件管理器的截图)

这比上面那种方式真是方便太多了,但也有很多不足之处,比如需要两个应用切换来切换去、当数据量比较大的时候会比较卡。

第三阶段:

下面就是本文的重点啦~通过chrome来查看android数据库。

主角:Facebook推出的Stetho,

集成步骤:

1,引入依赖包

 compile 'com.facebook.stetho:stetho:1.3.1'

2,初始化一下

 public class MyApplication extends Application {
   public void onCreate() {
     super.onCreate();
     Stetho.initializeWithDefaults(this);
   }
 }

3,运行App, 打开Chrome输入chrome://inspect/#devices(别忘了用数据线把手机和电脑连起来哦)

这里写图片描述

如上图,chrome会检测到我们的app,点击inspect进入查看页面

这里写图片描述

注:有读者反馈第一次打开有遇到空白的情况,这时只要翻个墙就好了(20160817更新)

做过Web前端开发的小伙伴们对这个界面应该再熟悉不过了,此时如果你的app中有数据库存在的话就可以在Resources下的Web SQL中找到你的数据库文件查看数据库中的内容啦~

如果想要修改的话,可以点击数据库文件名就进入cmd模式了,可以通过sql命令来增删改查啦~~(≧▽≦)/~

这里写图片描述

第三阶段

通过Stetho来实现,chrome调试Android网络请求。

注:这里的例子是基于采用okhttp来发请求的,如果是HttpURLConnection可以到Stetho官网查看相关配置.

步骤:

引入依赖包

 compile 'com.facebook.stetho:stetho:1.3.1'
 compile 'com.facebook.stetho:stetho-okhttp3:1.3.1'
 compile 'com.squareup.retrofit2:retrofit:2.0.0-beta4'
 compile 'com.squareup.okhttp3:okhttp:3.2.0'
 compile 'com.squareup.retrofit2:converter-gson:2.0.0-beta4'

初始化一下

 public class MyApplication extends Application {
   public void onCreate() {
     super.onCreate();
     Stetho.initializeWithDefaults(this);
   }
 }

添加拦截器

 OkHttpClient client = new OkHttpClient.Builder()
             .addNetworkInterceptor(new StethoInterceptor())
             .build();

注:是addNetworkInterceptor不是addInterceptor

运行App, 打开Chrome输入chrome://inspect/#devices(跟上文查看数据库内容的步骤一样)

点击inspect进入查看页面,然后在app用okhttp发起一个请求,就可以在Network下拦截到请求的相关数据了。

这里写图片描述

小贴士:用Chrome开发者工具抓包的时候,会发现如果页面跳转了,那么上一个页面的请求信息就没有了。这个只要勾选上Preserve log就不会了。

有个小问题, Response返回的json数据没法自动格式化显示=_=,有解决过这个问题的朋友还请留言告知,3Q~

这里写图片描述

One more thing

界面UI树状结构也能抓的到呀!!!

Elements下查看~

普通text信息还可以直接修改并在手机上预览效果。~(≧▽≦)/~

这里写图片描述

全部测试代码下载地址:

https://github.com/hellsam/StethoTest

作者:hellsam
链接:http://www.jianshu.com/p/03da9f91f41f
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值