如何使用DevTools工具调试前端页面?

如何使用DevTools工具调试前端页面?

HarmonyOS
2024-08-07 10:33:18
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
coolhead2000

(1)开启Web组件前端调试能力

web_webview.WebviewController.setWebDebuggingAccess(true);

(2)配置网络权限

"requestPermissions":[
   {
     "name" : "ohos.permission.INTERNET"
   }
 ]

(3)设备连接上电脑,在电脑端配置端口映射,配置方法如下:

//查找 devtools 远程调试所需的应用browser进程号,重启调试应用后,需要重复此步骤,以完成端口转发 hdc shell ps -ef | grep "应用包名" exit

// 添加映射 [pid] 替换成实际的browser进程id
hdc fport tcp:9222 localabstract:webview_devtools_remote_[pid]
// 查看映射 
hdc fport ls
示例:
hdc shell
ps -ef | grep "myapp"
//显示browser进程和render进程
20020131     45151   681 3 16:39:05 ?     00:00:04 com.example.myapplication
1000010      45221   780 4 16:39:05 ?     00:00:05 com.example.myapplication
exit
hdc fport tcp:9222 localabstract:webview_devtools_remote_45151
hdc fport ls

(4)电脑端Chrome浏览器地址栏中输入chrome://inspect/#devices,页面识别到设备后,就可以开始页面调试。

分享
微博
QQ
微信
回复
2024-08-07 15:24:18
相关问题
使用Devtools调试webview
233浏览 • 1回复 待解决
HarmonyOS WebView组件前端页面调试
273浏览 • 1回复 待解决
HarmonyOS Devtools 做Web调试
52浏览 • 1回复 待解决
HarmonyOS DevTools调试网页中找不到设备
532浏览 • 1回复 待解决
前端页面和原生页面如何进行通信?
405浏览 • 1回复 待解决
hdc工具支持远程调试吗?
3599浏览 • 1回复 待解决
HarmonyOS 应用访问前端页面方法
79浏览 • 1回复 待解决
HarmonyOS 调试工具执行命令异常
487浏览 • 1回复 待解决
HarmonyOS RN调试工具flipper连接不上
128浏览 • 1回复 待解决
如何使用gdb调试native应用
775浏览 • 1回复 待解决
如何使用发布证书进行调试
476浏览 • 1回复 待解决
性能调试工具及其滑动丢帧案例分享
861浏览 • 1回复 待解决
如何使用Charles工具抓包
2370浏览 • 1回复 待解决
HarmonyOS 如何使用发布证书进行调试
823浏览 • 1回复 待解决