7-10.【WebView】WebView 出现白屏或内存暴涨，如何排查？如何抓取 WebView 崩溃日志？如何监控内存占用？是否支持 DevTools 调试

WebView 的白屏和内存问题通常比原生开发更难捕捉，因为它们发生在独立的 Render 进程 中。要解决这些问题，你需要利用 HarmonyOS 提供的多维调试工具。

---

1. 如何排查 WebView 白屏？

白屏通常由以下四个原因引起，排查思路如下：

• 渲染进程崩溃（Render Process Gone） ：

  由于内存溢出或内核 Bug，渲染进程被系统杀掉。

  • 排查：检查 onRenderExited 回调。如果触发了此回调且 reason 不是正常退出，说明进程崩了。

• 网络/协议错误：

  HTTPS 证书校验失败或资源加载 404。

  • 排查：在 onHttpError 和 onSslError 中打印日志，确认是否因为安全策略拦截了关键 JS 脚本。

• 混合模式（Mixed Content）锁定：

  在 HTTPS 页面加载了 HTTP 的 JS 资源，导致脚本被静默拦截。

  • 排查：检查 mixedMode 设置。

• JS 执行异常：

  首屏关键 JS 报错导致 DOM 无法挂载。

  • 排查：开启 DevTools（见下文）查看 Console 报错。

---

2. 如何监控内存占用与排查内存暴涨？

WebView 内存暴涨通常是因为 H5 侧的内存泄漏（如未清理的定时器、全局变量、大图片缓存）。

• 使用 Profiler 监控：

  打开 DevEco Studio 的 Profiler，选择 Memory 模块。

  • 注意：你会看到应用进程内存平稳，但系统整体内存在飙升，那是 Render 进程 的开销。

• 查看进程快照：

  利用 shell 命令 hidumper -s WindowManagerService -a "list" 找到 WebView 对应的渲染进程 PID，然后使用 hidumper -p [PID] -c 查看详细的内存分表（堆、栈、GL 纹理等）。

• H5 堆栈分析：

  如果确认是网页问题，需在 Chrome DevTools 的 Memory 面板中拍摄 Heap Snapshot，对比两次快照查找未释放的对象。

---

3. 如何抓取 WebView 崩溃日志？

渲染进程的崩溃日志（Crash Log）不会出现在标准的应用日志中。

• Hilog 过滤：

  在 DevEco Studio 的 Log 窗口，搜索关键字 NWEB、Chromium 或 signal 11。内核级的崩溃通常会抛出 C++ 层面的堆栈信息。

• FaultLog 查询：

  使用系统设置或命令访问 faultlog 目录。

  Bash

  hilog | grep -i "RenderProcess"
  

• 应用侧感知：

  在 ArkTS 中通过 onRenderExited 捕获崩溃事件，并手动上报埋点，记录崩溃时的 URL 和内存状态。

---

4. 是否支持 DevTools 调试？（核心调试手段）

支持。 这是排查 WebView 问题最强大的利器。

开启步骤：

1. 代码开启（仅限调试版本）：

   TypeScript

   import web_webview from '@ohos.web.webview';
   // 在 Web 组件加载前调用
   web_webview.WebviewController.setWebDebuggingAccess(true);
   

2. 连接电脑：

   将手机连接至 PC，确保开启了 USB 调试。

3. 浏览器访问：

   在 PC 端的 Chrome 浏览器地址栏输入 chrome://inspect/#devices。

4. 开始调试：

   你会看到手机上正在运行的 WebView 页面列表，点击 inspect 即可打开熟悉的 Chrome 调试面板。你可以实时查看 Network、Console、Elements 和进行断点调试。

---

5. 排查工具矩阵

问题类型	核心工具	关键指标/回调
逻辑报错	Chrome DevTools	Console Tab 错误堆栈。
加载性能	Lighthouse / Network	TTFB (首字节时间)、资源大小。
渲染崩溃	ArkTS 回调	onRenderExited 事件。
内存溢出	DevEco Profiler	Native 内存占用、GPU 内存波动。

架构师建议：

对于生产环境，建立一个 “白屏自检机制” ：在 Web 加载 5 秒后，如果 onPageEnd 没触发，或者通过 runJavaScript 获取 DOM 节点高度为 0，则自动触发重载或引导用户反馈，并上报当前的内存快照。