起因：維護老項目，需查看本地數據庫數據，起初使用了DDMS調試，但使用時發現真機需Root、而我又不想使用模擬器，在此基礎下我發現了Stetho三方框架能實現我的需求，故在使用真實有效的基礎下總結此篇，包括遇到的每一個問題~

搭檔篇

• DDMS調試之旅
• 使用Stetho查看真機數據庫
• Android Debug Database 本地數據庫調試工具
• Android Studio - Database Inspector 調試數據庫

走起 ~

• • • • stetho基本了解
      • • 內置功能
        • 監控Network
        • dumpapp插件
        • console配置
      • 項目配置
      • • 依賴注入
        • Application 注冊
      • 游覽器工具
      • • 喚出工具
        • 使用工具
        • 完美狀態
      • 崎嶇道路一路錯
      • • 無法打開 chrome://inspect/#devices
        • 使用Chrome后依舊無法打開 chrome://inspect/#devices
        • 不顯示手機型號、包名、項目名等數據
        • Inspect點擊之后出現空白界面
        • Elements正常顯示，但Resources顯示空白

stetho基本了解

stetho 為facebook于2015年開發的Android調試工具，Github顯示在2019年依舊有代碼更新，故此可以看出目前這個框架依舊有團隊在進行維護 ~ 同時在Github有很明白的框架使用描述，不過為了兼顧像我一樣英文不太好的還是看我寫的吧，畢竟在我大白話的介紹下差不多可以滿足基本使用了 ~

內置功能

• Elements：查看界面的視圖結構
  開發中我一般使用 Component Tree、Layout Inspector、Hierarchy Viewer 或直接通過 DDMS調試 查看視圖結構

• Network：監控網絡請求，包含請求狀態、請求參數、返回參數等等
  開發中我一般使用 Fiddler抓包，既能抓到請求，又可以模擬弱網環境，從而優化我們的用戶體驗；對了，DDMS 也可以抓請求，不過我還是用fiddler居多 ~

• Resources：查看本地數據，比如sqlite數據庫，sharepreference等；同時也可以執行sql語句

• Console：在這里執行js語句，可以在APP上彈出一個Toast

• dumpapp： 目前只可在linux/mac上使用的命令行交互接口工具（都不能在Windows用，所以沒去研究）

監控Network

除了攔截Network之外，其余功能直接操作，攔截Network還需要根據官網描述簡單配置一下 ~

• 添加對應依賴

implementation 'com.facebook.stetho:stetho-okhttp3:1.5.1'

or

implementation 'com.facebook.stetho:stetho-urlconnection:1.5.1'

• 添加攔截器

stetho開發團隊在此部分配置階段，有下面這樣一段原話，供大家參閱下：
請注意，okhttp 2.x也可以使用，但是語法略有不同，因此必須使用stetho-okhttp工件（不是stetho-okhttp3）。
由于攔截器可以修改請求和響應，因此請在所有其他攔截器之后添加Stetho攔截器，以準確了解網絡流量。
如果您使用HttpURLConnection，則可以使用StethoURLConnectionManager 來輔助集成，盡管您應該意識到這種方法有一些注意事項。特別是，您必須顯式添加 Accept-Encoding: gzip到請求標頭并手動處理壓縮的響應，以便Stetho報告壓縮的有效負載大小

如果你項目中的網絡框架是基于okhttp開發的，那么在自己封裝的網絡基層內加入類似OkHttp 3.x 攔截配置中 .addNetworkInterceptor(new StethoInterceptor()) 的代碼，應該就可以實現攔截了 ~

OkHttp 2.x

OkHttpClient client = new OkHttpClient();client.networkInterceptors().add(new StethoInterceptor());

OkHttp 3.x

個人覺得應該基本都是3.0的了，因為官網現在都已經不顯示2.0這樣的配置了 - -

new OkHttpClient.Builder().addNetworkInterceptor(new StethoInterceptor()).build()

dumpapp插件

這部分沒去研究，有想看的這里跳轉這里，這位朋友講的也還行，雖然不是很細 ~

配置方式

Stetho.initialize(Stetho.newInitializerBuilder(context).enableDumpapp(new DumperPluginsProvider() {@Overridepublic Iterable<DumperPlugin> get() {return new Stetho.DefaultDumperPluginsBuilder(context).provide(new MyDumperPlugin()).finish();}}).enableWebKitInspector(Stetho.defaultInspectorModulesProvider(context)).build())

console配置

個人感覺對于app是個雞肋功能…

• 添加依賴（啟用JavaScript控制臺）

implementation 'com.facebook.stetho:stetho-js-rhino:1.5.1'

• 配置方式
  啟動 app，在 Chrome 開發者工具的 Console 輸入下面代碼使 app 打印一個Toast

importPackage(android.widget); importPackage(android.os); var handler = new Handler(Looper.getMainLooper()); handler.post(function() { Toast.makeText(context, "hello", Toast.LENGTH_LONG).show() });

---

項目配置

以下倆步的實現只是為了讓stetho的游覽器工具可以識別到我們的手機

依賴注入

build.gradle

implementation 'com.facebook.stetho:stetho:1.5.1'

或

<dependency><groupId>com.facebook.stetho</groupId><artifactId>stetho</artifactId><version>1.5.1</version> </dependency>

Application 注冊

但凡一個正常的Android項目都有屬于自己的Application,首先他是程序執行的第一個入口，同時兼顧很多的配置；所以不論是三方的的配置，還是說Android本身的兼容問題都會使用到Application！關于Application的一些問題，我也會在本文后半場說明 ~

• Application 的 onCreate()生命周期內加入下方代碼

Stetho.initializeWithDefaults(this);

• 如此這般

@Overridepublic void onCreate() {super.onCreate();Stetho.initializeWithDefaults(this);}

---

游覽器工具

喚出工具

在此過程中你可能會遇到游覽器 報404、識別不到設備、無inspect按鈕等問題，但無須擔心，在本文后半場都有解決方式 ~

將下方鏈接copy到谷歌游覽器中（劃重點”谷歌游覽器“，要考的 - - ~）

chrome://inspect/#devices

在Google游覽器打開的正確效果如下 > < ~

使用工具

喚出DevTools工具后如Element可顯示布局結構，那么恭喜你成功第一步了

完美狀態

這里你可能會遇到 WebSql 打開空白界面的情況，莫擔心本文后半場有詳解

菜單欄Resources下查看WebSql，打開內部的data - data 你就可以看到想念已久的數據庫信息了 ~

哦，對了，如果想同步查看手機中項目的當前效果，可直接點右上角的手機 ，會同步效果的 ~

---

崎嶇道路一路錯

無法打開 chrome://inspect/#devices

我曾嘗試使用baidu、360、火狐等游覽器請求該鏈接，但是結果有的直接報404錯誤、有的直接空白界面等，反正就是各種打不開 ~

首先確定當前使用的游覽器是否為Chrome （谷歌），如果不是請及時下載Chrome ，下載之后使用Chrome 重新請求即可；

使用Chrome后依舊無法打開 chrome://inspect/#devices

這個原因請私信我 > <

不顯示手機型號、包名、項目名等數據

• 查看Android項目是否配置完畢
• 查看手機是否已經打開App
• 這個原因請私信我

Inspect點擊之后出現空白界面

• 確定是否為Chrome 瀏覽器
• 查看Chrome 是否為最新版本
• 這個原因請私信我（第一次需要這樣，后面不需要）

Elements正常顯示，但Resources顯示空白

• 確定游覽器為Chrome
• 切入到Resources后，稍等倆分鐘，最多倆分鐘，即使數據傳輸慢，但是倆分鐘后還沒加載出來，那么肯定是有問題
• 刷新當前界面 - F5
• 嘗試切換為網絡環境（這個原因請私信我）
• 操作右上角手機圖標，同步顯示手機當前狀態
• 開啟一個新的Chrome 瀏覽器窗口，然后根據 chrome://inspect/#devices → inspect → Resources 操作，我是重復嘗試到第三次的時候成功獲取到了Resources內存的數據信息 ~

總結

以上是生活随笔為你收集整理的Android进阶之路 - 使用Stetho查看真机数据库的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。