[发明专利]云平台web前端性能监控方法、系统及介质

说明书

本发明公开了云平台web前端性能监控方法、系统及介质，属于网页监控技术领域，要解决的技术问题为如何兼容适配现在主流浏览器，为不同的云产品提供一种统一的监控。将监控代码以探针方式配置于云平台各个产品前端代码的根界面中，执行如下步骤：通过windows的performance属性获取网页加载信息；通过windows的navigators对象获取浏览器信息；通过windows的onerror属性监控并捕捉网页异常信息；通过XMLHttpRequest的onreadystatechange属性以及重构fetch的get属性，监听网页的后端请求；通过img的src属性将信息拼接到src的url上。

技术领域

本发明涉及网页监控技术领域，具体地说是云平台web前端性能监控方法、系统及介质。

背景技术

云平台具有高度的开放性和兼容性，针对云平台上各种云产品，如果都单独去开发监控系统，需要大量人力和物力。但是网页性能，网页浏览量，页面异常信息等等又是云平台上产品持续优化升级离不开的重要数据，因此，更需要一种统一的监控技术去获取一些日常用户活跃和分布信息，以及我们更加关注的网页的异常信息等等。

如何兼容适配现在主流浏览器，为不同的云产品提供一种统一的监控，是需要解决的技术问题。

发明内容

本发明的技术任务是针对以上不足，提供云平台web前端性能监控方法、系统及介质，来解决如何兼容适配现在主流浏览器，为不同的云产品提供一种统一的监控的问题。

第一方面，本发明云平台web前端性能监控方法，基于JavaScript编写性能监控代码，并将所述监控代码以探针方式配置于云平台各个产品前端代码的根界面中，通过所述监控代码对云平台web前端性能进行监控，所述监控代码执行如下步骤：

通过windows的performance属性获取网页加载信息，所述网页加载信息包括网页性能指标、耗时指标以及静态资源信息；

通过windows内置的navigators对象获取加载当前网页的浏览器信息；

通过windows的onerror属性监控并捕捉网页异常信息；

通过XMLHttpRequest的onreadystatechange属性以及重构fetch的get属性，监听网页的后端请求并判断后端请求为成功或失败，得到后端请求信息；

通过img的src属性将所述网页加载信息、浏览器信息、网页异常信息以及后端请求信息拼接到src的url上。

作为优选，所述网页性能指标包括：

白屏时间，所述白屏时间的计算公式为：白屏时间＝domloadng–fetchStart；

DOM Ready时间，所述DOM Ready时间的计算公式为：DOM Ready时间＝domContentLoadedEventEnd–fetchStart；

页面onload时间，所述页面onload时间的计算公式为：页面onload时间＝loadEventEnd–fetchStart；

所述耗时指标包括：

DNS查询耗时，所述DNS查询耗时的计算公式为：DNS查询耗时＝domainLookupEnd–domainLookupStart；

TCP链接耗时，所述TCP链接耗时的计算公司为：TCP链接耗时＝connectEnd–connectStart；

网络请求耗时，所述网络请求耗时的计算公式为：网络请求耗时＝responseEnd–responseStart；