最近在调研一个鸿蒙的跨端项目,采用H5方案,需要调试一些页面,要用到webview的调试,记录一下模拟器如何打开webview调试

官网这篇文章说的也很清楚,直接看官网的文章也可以

https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/web-debugging-with-devtools-V5

1、配置鸿蒙环境

https://blog.csdn.net/guo_zhen_qian/article/details/145019360可以参考我这篇文章,首先配置好鸿蒙环境,至少hdc得生效

2、打开调试

2.1 代码中打开webview调试开关

aboutToAppear() {
    // 开启 WebView 调试模式
    webview.WebviewController.setWebDebuggingAccess(true);
  }

2.2 创建模拟器

创建完之后用hdc看看设备列表

➜  ~ hdc list targets                                              
127.0.0.1:5555

2.3 配置转发

这个比较重要,每次你的app重启之后都需要配置一遍

一定把你的app run起来再执行以下操作

进入hdc shell

hdc shell

执行cat /proc/net/unix | grep devtools查询arkweb的domain socket

cat /proc/net/unix | grep devtools

退出 hdc shell

exit

执行端口转发hdc fport tcp:9222 localabstract:webview_devtools_remote_你的端口

hdc fport tcp:9222 localabstract:webview_devtools_remote_你的端口

检查端口转发是否成功 hdc fport ls

hdc fport ls

执行结果

执行成功

2.4 进入Chrome inspect

浏览器输入 chrome://inspect/#devices

点inspect 就可以进入调试模式了

Logo

讨论HarmonyOS开发技术,专注于API与组件、DevEco Studio、测试、元服务和应用上架分发等。

更多推荐