自学内容网 自学内容网

aosp15上winscope离线html如何使用?

背景:

aosp15上的如何使用Winscope前面已经有分享过相关的blog,这块其实和aosp14没啥大的差别,具体可以看如下2个文章:
手把手教你aosp14编译Winscope
安卓aosp15手机上如何离线获取winscope文件

文章中也说明在aosp15如果直接使用编译好的离线html是有问题的,无法正常显示抓取的Winscope文件。针对这样一个问题对于有些同学来说还是很不友好,因为很可能他们不想搭建node相关的环境,那么针对 aosp15上Winscope离线的html是否真的不可以使用呢?

这个问题的解决还得感谢我们有前端背景学员朋友“小周佩奇i”提供的相关方案,下面来分享一下aosp15上winscope离线html如何使用。

无法使用离线html原因

1、直接文件方式打开html
在这里插入图片描述
2、导入对应Winscope包发现画面没有反应,其实是报错了,具体报错情况如下:
在这里插入图片描述

'Worker': Script at 'file:///media/test/49a0eb6b-f410-4eed-9e0a-952e3c75d2b2/home/test/aosp15/development/tools/winscope/dist/prod/engine_bundle.js' cannot be accessed from origin 'null'.
    at initWasm (wasm_engine_proxy.ts:24:20)
    at parser_factory_ParserFactory.initializeTraceProcessor (parser_factory.ts:131:7)
    at parser_factory_ParserFactory.createParsers (parser_factory.ts:63:39)
    at TracePipeline.loadUnzippedArchive (trace_pipeline.ts:210:57)
    at async TracePipeline.loadFiles (trace_pipeline.ts:72:37)
    at async Mediator.loadFiles (mediator.ts:238:7)
    at async mediator.ts:123:43
    at async AppFilesUploaded.visit (winscope_event.ts:71:21)
    at async Mediator.onWinscopeEvent (mediator.ts:119:67)
    at async AppComponent.onFilesUploaded (app_component.ts:531:25)

报错大概原因(引用学员朋友写的):
就是sf layer 是bp的方式存储,js使用bp应该是要通过wasm来,可以理解为js通过一个标准接口来执行native代码,类似jni

不过我们可能不关心原因,因为这块毕竟属于前端的知识,我们更关心应该怎么解决

解决html直接导入Winscope文件报错

1、用npm安好http-server

npm install -g http-server

2、然后到cd到html目录执行http-server
例如我们到development/tools/winscope/dist/prod目录下执行http-server

test@test:~/aosp15/development/tools/winscope/dist/prod$ http-server 
Starting up http-server, serving ./

http-server version: 14.1.1

http-server settings: 
CORS: disabled
Cache: 3600 seconds
Connection Timeout: 120 seconds
Directory Listings: visible
AutoIndex: visible
Serve GZIP Files: false
Serve Brotli Files: false
Default File Extension: none

Available on:
  http://127.0.0.1:8080
  http://192.168.31.142:8080
Hit CTRL-C to stop the server

3、进入浏览器,访问http://127.0.0.1:8080地址既可以
在这里插入图片描述
这个时候再进行导入Winscope相关文件,或者在线抓取也可以,最后可以看到如下图所示的成功画面:

在这里插入图片描述
更多framework实战相关干货,请关注下面“千里马学框架”


原文地址:https://blog.csdn.net/learnframework/article/details/144384808

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!