我已经使用 Angular 构建了一个基于 Electron 的应用程序,现在我正在尝试集成 Heap session 记录。到目前为止,我能够录制 session ,但面临以下一些问题:
问题:因此,主要问题是 session 的录音未捕获 UI/CSS,只能看到标签。
See the issue on the screenshot
尝试的解决方案/代码/发现
我从 Heap 的官方网站上获取了代码,并将该代码片段粘贴到了 Angular 一侧的
index.html
中在 session 记录中,堆不会像普通屏幕录像机那样简单地记录 session ,而是以事件的形式跟踪用户正在执行的所有操作,其中包含有关登陆的信息页面、CSS 文件和其他信息。因此,当播放 session 重放时,堆会顺序遍历这些记录的事件,以从存储在事件中的 URL 获取当时的信息。因此,在 Web 应用程序中,这是可能的,因为网页具有预加载的 CSS 文件。不过,在 Electron 应用程序中,这是不可能的,因为 CSS 文件是动态应用于内容的。因此,当播放 session 录音时,不会应用 CSS。
Heap 文档中还提到,Heap session 记录仅适用于 Web 应用程序,而且 Heap 使用网络爬虫定期点击客户网站上的每个链接。
Hotjar、FullStory 和 Smartlook 中的 Electron 也面临同样的问题
最佳答案
我是 Heap session 重放团队的一名工程师,有一些有用的消息要告诉您。我们正在尝试一项更改,以解决 Electron 应用程序的 CSS 问题。目前,我们依靠各种爬行技术来查找应用程序的相关样式。很快我们就会推出一个功能,可以直接将相关样式发送给我们,无需爬取。应该很快就能到野外了。希望有帮助!
关于angular - 堆 session 记录不适用于基于 Electron JS 的应用程序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/75245229/