CN111522706A - 前端应用的页面异常的监控方法及其装置 - Google Patents

Abstract

本发明公开了一种前端应用的页面异常的监控方法及其装置，涉及研发管理技术领域。该方法包括：获取待监控前端应用的脚本语言文件，在待监控前端应用的脚本语言文件中设置异常监控标签。其中，异常监控标签用于调用异常监控脚本，异常监控脚本包括多个异常监控函数。获取待监控前端应用对应的访问请求，根据访问请求，加载待监控前端应用中的页面，以及异常监控脚本。将异常监控函数检测到的异常数据进行封装，并将异常数据发送至异常监控平台。由此，实现了通过包括多个异常监控函数的异常监控脚本对待监控前端应用的页面异常进行监控，能够对各种类型的页面异常进行监控。

Description

前端应用的页面异常的监控方法及其装置

【技术领域】

本发明涉及研发管理技术领域，尤其涉及一种前端应用的页面异常的监控方法及其装置。

【背景技术】

前端应用，又被称作Web应用，是一种可以通过Web页面进行访问的应用。Web页面通常可以使用HTML、JavaScript等脚本语言进行编写，并使用“htm”、“html”、“js”后缀的脚本语言文件对Web页面进行存储。

用户在使用前端应用时，需要对前端应用中的Web页面进行访问，但是Web页面可能存在异常，影响用户的使用体验。

相关技术中，通过异常抛出机制来对用户访问页面时的异常进行记录，但是现有的异常抛出机制能够监控的异常类型种类较少，不能对各种类型的页面异常进行监控。

【发明内容】

有鉴于此，本发明实施例提供了一种前端应用的页面异常的监控方法及其装置，能够对各种类型的页面异常进行监控。

一方面，本发明实施例提供了一种前端应用的页面异常的监控方法，包括：获取待监控前端应用的脚本语言文件；在所述待监控前端应用的脚本语言文件中设置异常监控标签；其中，所述异常监控标签用于调用异常监控脚本，所述异常监控脚本包括多个异常监控函数；获取所述待监控前端应用对应的访问请求；根据所述访问请求，加载所述待监控前端应用中的页面，以及所述异常监控脚本；以及将所述异常监控函数检测到的异常数据进行封装，并将所述异常数据发送至异常监控平台。

可选地，所述异常监控函数包括：脚本语言文件监控函数，静态资源监控函数，页面异步更新监控函数，无效链接监控函数，页面加载监控函数，文档对象模型结构异常监控函数，开发环境组件监控函数，内存异常和页面崩溃监控函数中的至少一种。

可选地，所述脚本语言文件监控函数通过对错误事件的监听函数进行封装，来实现对所述脚本语言文件运行过程中的异常进行监控。

可选地，所述静态资源监控函数通过窗口事件监听函数，来实现对静态资源加载过程中的异常进行捕获。

可选地，所述页面异步更新监控函数获取页面异步更新函数在出现异常时创建的图像标签，来对页面异步更新过程中的异常进行捕获。

可选地，所述无效链接监控函数通过获取页面中的有效链接，以确定所述页面中的无效链接。

可选地，所述页面加载监控函数通过对资源时间性能缓冲区溢出事件进行监听，来对页面加载过程中的崩溃进行监控。

可选地，所述文档对象模型结构异常监控函数在所述待监控页面加载完成后，通过正则匹配的方式，对文档对象模型进行异常监控。

可选地，所述开发环境组件监控函数通过错误边界组件对业务组件进行包裹，以捕获所述业务组件的异常，并结合生命周期函数，对开发环境下的所有所述业务组件的异常进行捕获。

可选地，所述内存异常和页面崩溃监控函数通过检测所述待监控应用中的页面的内存使用情况，来监控内存异常，以及通过代理服务器接收所述待监控应用中的页面的崩溃情况，来监控页面崩溃异常。

一方面，本发明实施例提供了一种前端应用的页面异常的监控装置，包括：第一获取模块，用于获取待监控前端应用的脚本语言文件；设置模块，用于在所述待监控前端应用的脚本语言文件中设置异常监控标签；其中，所述异常监控标签用于调用异常监控脚本，所述异常监控脚本包括多个异常监控函数；第二获取模块，用于获取所述待监控前端应用对应的访问请求；加载模块，用于根据所述访问请求，加载所述待监控前端应用中的页面，以及所述异常监控脚本；封装模块，用于将所述异常监控函数检测到的异常数据进行封装；以及发送模块，用于将所述异常数据发送至异常监控平台。

可选地，所述异常监控函数包括：脚本语言文件监控函数，静态资源监控函数，页面异步更新监控函数，无效链接监控函数，页面加载监控函数，文档对象模型结构异常监控函数，开发环境组件监控函数，内存异常和页面崩溃监控函数中的至少一种。

可选地，所述脚本语言文件监控函数通过对错误事件的监听函数进行封装，来实现对所述脚本语言文件运行过程中的异常进行监控。

可选地，所述静态资源监控函数通过窗口事件监听函数，来实现对静态资源加载过程中的异常进行捕获。

可选地，所述页面异步更新监控函数获取页面异步更新函数在出现异常时创建的图像标签，来对页面异步更新过程中的异常进行捕获。

可选地，所述无效链接监控函数通过获取页面中的有效链接，以确定所述页面中的无效链接。

可选地，所述页面加载监控函数通过对资源时间性能缓冲区溢出事件进行监听，来对页面加载过程中的崩溃进行监控。

可选地，所述文档对象模型结构异常监控函数在所述待监控页面加载完成后，通过正则匹配的方式，对文档对象模型进行异常监控。

可选地，所述开发环境组件监控函数通过错误边界组件对业务组件进行包裹，以捕获所述业务组件的异常，并结合生命周期函数，对开发环境下的所有所述业务组件的异常进行捕获。

可选地，所述内存异常和页面崩溃监控函数通过检测所述待监控应用中的页面的内存使用情况，来监控内存异常，以及通过代理服务器接收所述待监控应用中的页面的崩溃情况，来监控页面崩溃异常。

一方面，本发明实施例提供了一种计算机设备，包括存储器和处理器，所述存储器用于存储包括程序指令的信息，所述处理器用于控制程序指令的执行，所述程序指令被处理器加载并执行时实现上述的前端应用的页面异常的监控方法的步骤。

一方面，本发明实施例提供了一种计算机可读存储介质，所述计算机可读存储介质包括存储的程序，其中，在所述程序运行时控制所述计算机可读存储介质所在设备执行上述的前端应用的页面异常的监控方法的步骤。

在本发明实施例中，通过包括多个异常监控函数的异常监控脚本对待监控前端应用的页面异常进行监控，能够对各种类型的页面异常进行监控。

【附图说明】

为了更清楚地说明本发明实施例的技术方案，下面将对实施例中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动性的前提下，还可以根据这些附图获得其它的附图。

图1为本发明实施例所提供的一种前端应用的页面异常的监控方法的流程示意图；

图2为本发明实施例所提出的一种前端应用的页面异常的监控装置的结构示意图；以及

图3为本发明实施例提供的一种计算机设备的示意图。

【具体实施方式】

为了更好的理解本发明的技术方案，下面结合附图对本发明实施例进行详细描述。

应当明确，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其它实施例，都属于本发明保护的范围。

在本发明实施例中使用的术语是仅仅出于描述特定实施例的目的，而非旨在限制本发明。在本发明实施例和所附权利要求书中所使用的单数形式的“一种”、“所述”和“该”也旨在包括多数形式，除非上下文清楚地表示其他含义。

应当理解，本文中使用的术语“和/或”仅仅是一种描述关联对象的相同的字段，表示可以存在三种关系，例如，A和/或B，可以表示：单独存在A，同时存在A和B，单独存在B这三种情况。另外，本文中字符“/”，一般表示前后关联对象是一种“或”的关系。

应当理解，尽管在本发明实施例中可能采用术语第一、第二、第三等来描述预设范围等，但这些预设范围不应限于这些术语。这些术语仅用来将预设范围彼此区分开。例如，在不脱离本发明实施例范围的情况下，第一预设范围也可以被称为第二预设范围，类似地，第二预设范围也可以被称为第一预设范围。

取决于语境，如在此所使用的词语“如果”可以被解释成为“在……时”或“当……时”或“响应于确定”或“响应于检测”。类似地，取决于语境，短语“如果确定”或“如果检测(陈述的条件或事件)”可以被解释成为“当确定时”或“响应于确定”或“当检测(陈述的条件或事件)时”或“响应于检测(陈述的条件或事件)”。

基于前述对现有技术的说明，可以知道，相关技术中，通过异常抛出机制来对用户访问页面时的异常进行记录，但是现有的异常抛出机制能够监控的异常类型种类较少，不能对各种类型的页面异常进行监控。

基于此，本发明实施例提供了一种前端应用的页面异常的监控方法，通过包括多个异常监控函数的异常监控脚本对待监控前端应用的页面异常进行监控，能够对各种类型的页面异常进行监控。

图1为本发明实施例所提供的一种前端应用的页面异常的监控方法的流程示意图。如图1所示，该方法包括：

步骤S101，获取待监控前端应用的脚本语言文件。

基于前述说明，可以知道，对于HTML、JavaScript等脚本语言编写的Web页面来说，脚本语言文件为“htm”、“html”、“js”后缀的文件。而对于前端应用来说，可能包括多个Web页面，相应地，包括多个脚本语言文件。

步骤S102，在待监控前端应用的脚本语言文件中设置异常监控标签。

其中，异常监控标签用于调用异常监控脚本，异常监控脚本包括多个异常监控函数。

需要说明的是，当在HTML编写的脚本语言文件中插入JavaScript脚本语句时，需要使用<script>标签，具体通过<script>和</script>标识JavaScript脚本语句。

由于本发明实施例所提出的异常监控脚本通过JavaScript脚本语句进行编写，因此需要在待监控前端应用的脚本语言文件中设置异常监控标签，并在一对异常监控标签之间插入JavaScript脚本语句编写的异常监控脚本。

应当理解，待监控前端应用中的页面通过脚本语言文件进行存储，因此在脚本语言文件中插入异常监控脚本，能够对待监控前端应用出现的页面异常进行监控。

此外，为了能够对不同类型的异常进行监控，本发明实施例中的异常监控脚本包括多个异常监控函数。当待监控前端应用出现不同类型的页面异常时，异常监控脚本中包括的异常监控函数能够捕获对应类型的页面异常，并将该页面异常上报。

具体来说，常见的前端应用的页面异常包括：脚本语言文件运行过程中的异常，静态资源加载过程中的异常，页面异步更新过程中的异常，页面中存在无效链接的异常，页面加载过程中出现崩溃的异常，文档对象模型存在异常，开发环境下的业务组件存在异常，页面使用时的内存异常，页面使用时的崩溃异常。

相应地，本发明实施例中的异常监控函数包括：脚本语言文件监控函数，静态资源监控函数，页面异步更新监控函数，无效链接监控函数，页面加载监控函数，文档对象模型结构异常监控函数，开发环境组件监控函数，内存异常和页面崩溃监控函数中的至少一种。

下面详细说明不同类型的异常监控函数是如何对不同类型的页面异常进行监控的。

具体来说，脚本语言文件监控函数通过对错误事件的监听函数进行封装，来实现对脚本语言文件运行过程中的异常进行监控。

需要说明的是，JavaScript提供的异常处理机制包括错误事件的监听(oneror事件的监听)和try-catch异常捕获。但是try-catch异常捕获需要修改JavaScript中的函数，以使JavaScript中的函数在运行过程中的异常能够被try-catch捕获，修改成本高，而且会使得JavaScript被侵入的风险提高。因此，本发明实施例中的脚本语言文件监控函数通过对JavaScript提供的错误事件的监听函数进行封装，来对脚本语言文件运行过程中的异常进行监控。

静态资源监控函数通过窗口事件监听函数，来实现对静态资源加载过程中的异常进行捕获。

其中，静态资源是指图片或者脚本，当一项静态资源加载失败时，脚本语言文件用于加载资源的元素会触发异常事件，该异常事件能够被窗口事件监听函数window.addEventListener捕获，可以理解，一旦窗口事件监听函数捕获到异常，静态资源监控函数即可调用窗口事件监听函数捕获到的异常，进行上报，从而实现对静态资源加载过程中的异常进行监控。

页面异步更新监控函数获取页面异步更新函数在出现异常时创建的图像标签，来对页面异步更新过程中的异常进行捕获。

其中，页面异步更新是指在页面更新时，保留原页面的部分内容，仅更新页面中与原页面不同部分的内容，在页面异步更新过程中，即便出现了异常，也不会抛出异常事件。

相关技术中，通过第三方库提供的异常全局监控接口来对页面异步更新过程出现的异常进行监控，但是由于页面异步更新可能会出现页面跨域的情况，无法实现页面异常的监控。

下面详细说明页面跨域时，无法实现页面异常的监控的原理。具体来说，每个Web页面对应于一个域名地址，用户在请求访问Web页面时，需要根据域名地址访问对应的Web页面。域名地址包括协议、子域名、主域名、端口号和请求资源地址。当两个Web页面对应的域名地址中，协议、子域名、主域名、端口号中任意一个不相同时，说明两个Web页面出现了跨域。

JavaScript出于安全考虑，不允许跨域调用其他Web页面中的对象，使得跨域的页面之间无法相互调用对象，也就无法通过全局监控接口来对页面异步更新过程出现的异常进行监控。

因此，本发明实施例通过获取页面异步更新函数在出现异常时创建的图像标签，来对页面异步更新过程中的异常进行捕获。

具体来说，当页面异步更新函数出现异常时，会创建一个图像标签，即<img>标签。需要说明的是，<img>标签并不会在页面中插入图像，而是从页面上链接图像。<img>标签创建的是被引用图像的占位空间，因此当页面异步更新监控函数发现页面异步更新后，存在<img>标签，则可以确定页面异步更新过程中的出现了异常。

无效链接监控函数通过获取页面中的有效链接，以确定页面中的无效链接。

相关技术中，通过向页面中的全部链接发出访问请求，并根据返回的HTTP头信息来对链接进行识别，确定页面中的无效链接。如果由前端应用中脚本来实现上述方案，则会占用前端应用的内存，消耗前端应用的性能。如果由服务器来实现上述方案，则无法获得真实的用户使用数据。因此，本发明实施例通过前端应用中的无效链接监控函数不断获取页面中的有效链接，发送给服务器，由服务器来对有效链接进行检测，一旦发现有效链接存在异常，则将其列为无效链接，从而减少了前端应用的资源消耗。

页面加载监控函数通过对资源时间性能缓冲区溢出事件进行监听，来对页面加载过程中的崩溃进行监控。

需要说明的是，JavaScript提供了资源时间性能缓冲区溢出事件监听函数onresourcetimingbufferfull，当页面的资源时间性能缓冲区出现溢出时，触发该监听函数，从而对页面加载过程中的崩溃进行监控。

文档对象模型结构异常监控函数在待监控页面加载完成后，通过正则匹配的方式，对文档对象模型进行异常监控。

其中，文档对象模型，又被称为Document Object Model，简称DOM，是一种基于树的API文档，要求在处理过程中整个文档都表示在存储器中。在开发过程中，由于开发人员的疏忽，可能出现ID重复、文档类型未声明、双标签未闭合等异常情况。

具体来说，可以通过document.onreadystatechange函数判断页面已经加载完成，进而通过正则匹配的方式，确定文档对象模型中是否存在ID重复、文档类型未声明、双标签未闭合等异常情况，从而对文档对象模型进行异常监控。

开发环境组件监控函数通过错误边界组件对业务组件进行包裹，以捕获业务组件的异常，并结合生命周期函数，对开发环境下的所有业务组件的异常进行捕获。

其中，错误边界组件ErrorBoundary能够对被包裹的子组件进行异常捕获，生命周期函数componentDidCatch能捕获子组件树中的任何Javascript异常，因此开发环境组件监控函数通过获取错误边界组件和生命周期函数捕获的异常，能够对开发环境下的所有业务组件的异常进行捕获。

内存异常和页面崩溃监控函数通过检测待监控应用中的页面的内存使用情况，来监控内存异常，以及通过代理服务器接收待监控应用中的页面的崩溃情况，来监控页面崩溃异常。

应当理解，在使用前端应用时，终端分配给前端应用的内存有限，一旦前端应用占用的内存过多，会导致前端应用中的页面出现卡顿甚至崩溃。

因此，本发明实施例中的内存异常是指内存使用超过一定比例，由于内存使用情况在动态变化，需要不停地对内存使用情况进行检测。

此外，本发明实施例中的代理服务器Service Worker独立于页面，拥有单独的工作线程，也就是说，即便待监控应用中的页面出现了崩溃，代理服务器依然能够正常工作，因此可以使用代理服务器对页面崩溃异常进行监控，页面通过navigator.serviceWorker.controller.postMessage函数向对应的代理服务器发送信息，内存异常和页面崩溃监控函数从代理服务器获取待监控应用中的页面的崩溃情况，来监控页面崩溃异常。

步骤S103，获取待监控前端应用对应的访问请求。

需要说明的是，步骤S102，通过在待监控前端应用的脚本语言文件中设置异常监控标签，在待监控前端应用的脚本语言文件中插入了多个异常监控函数。

为了让异常监控函数能够进行监控，还需要运行待监控前端应用，具体来说，需要用户对待监控前端应用中的页面进行访问，也就是获取待监控前端应用对应的访问请求。

步骤S104，根据访问请求，加载待监控前端应用中的页面，以及异常监控脚本。

可以理解，当接收到用户输入的访问请求后，待监控前端应用中的页面进行加载，相应地，插入在脚本语言文件的异常监控脚本也进行了加载。

当用户使用待监控前端应用中的页面时，出现前述的各种类型的页面异常，本发明实施例中的异常监控函数能够及时捕获对应类型的页面异常。

步骤S105，将异常监控函数检测到的异常数据进行封装，并将异常数据发送至异常监控平台。

应当理解，对页面异常进行监控的目的是为了对前端应用进行改进和优化，因此需要将异常监控函数检测到的页面异常发送至异常监控平台，为了让不同异常监控函数检测到的页面异常的数据格式保持一致，便于传输和展示，本发明实施例对将异常监控函数检测到的异常数据进行了封装。

如下表所示，每一条异常数据包括七种属性，分别是异常发生时间、异常发生的类型、异常发生平台相关信息对象、异常发生消息提示、异常发生页面地址、异常请求地址、异常发生堆栈信息，使得开发人员能够充分了解页面异常的相关信息。

属性名	数据类型	描述
			currentTime	String	异常发生时间
types	String	异常发生的类型
			userInfo	Object	异常发生平台相关信息对象
errorMessage	String	异常发生消息提示
			errorurl	String	异常发生页面地址
sendURL	String	异常请求地址
			stackInfo	String	异常发生堆栈信息

综上所述，本发明实施例所提出的一种前端应用的页面异常的监控方法，获取待监控前端应用的脚本语言文件，在待监控前端应用的脚本语言文件中设置异常监控标签。其中，异常监控标签用于调用异常监控脚本，异常监控脚本包括多个异常监控函数。获取待监控前端应用对应的访问请求，根据访问请求，加载待监控前端应用中的页面，以及异常监控脚本。将异常监控函数检测到的异常数据进行封装，并将异常数据发送至异常监控平台。由此，实现了通过包括多个异常监控函数的异常监控脚本对待监控前端应用的页面异常进行监控，能够对各种类型的页面异常进行监控。

为了实现上述实施例，本发明实施例还提出了一种前端应用的页面异常的监控装置，图2为本发明实施例所提出的一种前端应用的页面异常的监控装置的结构示意图。如图2所示，该装置包括：第一获取模块210，设置模块220，第二获取模块230，加载模块240，封装模块250，发送模块260。

第一获取模块210，用于获取待监控前端应用的脚本语言文件。

设置模块220，用于在待监控前端应用的脚本语言文件中设置异常监控标签。

其中，异常监控标签用于调用异常监控脚本，异常监控脚本包括多个异常监控函数。

第二获取模块230，用于获取待监控前端应用对应的访问请求。

加载模块240，用于根据访问请求，加载待监控前端应用中的页面，以及异常监控脚本。

封装模块250，用于将异常监控函数检测到的异常数据进行封装。

发送模块260，用于将异常数据发送至异常监控平台。

进一步地，异常监控函数包括：脚本语言文件监控函数，静态资源监控函数，页面异步更新监控函数，无效链接监控函数，页面加载监控函数，文档对象模型结构异常监控函数，开发环境组件监控函数，内存异常和页面崩溃监控函数中的至少一种。

进一步地，脚本语言文件监控函数通过对错误事件的监听函数进行封装，来实现对脚本语言文件运行过程中的异常进行监控。

进一步地，静态资源监控函数通过窗口事件监听函数，来实现对静态资源加载过程中的异常进行捕获。

进一步地，页面异步更新监控函数获取页面异步更新函数在出现异常时创建的图像标签，来对页面异步更新过程中的异常进行捕获。

进一步地，无效链接监控函数通过获取页面中的有效链接，以确定页面中的无效链接。

进一步地，页面加载监控函数通过对资源时间性能缓冲区溢出事件进行监听，来对页面加载过程中的崩溃进行监控。

进一步地，文档对象模型结构异常监控函数在待监控页面加载完成后，通过正则匹配的方式，对文档对象模型进行异常监控。

进一步地，开发环境组件监控函数通过错误边界组件对业务组件进行包裹，以捕获业务组件的异常，并结合生命周期函数，对开发环境下的所有业务组件的异常进行捕获。

进一步地，内存异常和页面崩溃监控函数通过检测待监控应用中的页面的内存使用情况，来监控内存异常，以及通过代理服务器接收待监控应用中的页面的崩溃情况，来监控页面崩溃异常。

综上所述，本发明实施例所提出的一种前端应用的页面异常的监控装置，在进行前端应用的页面异常的监控时，获取待监控前端应用的脚本语言文件，在待监控前端应用的脚本语言文件中设置异常监控标签。其中，异常监控标签用于调用异常监控脚本，异常监控脚本包括多个异常监控函数。获取待监控前端应用对应的访问请求，根据访问请求，加载待监控前端应用中的页面，以及异常监控脚本。将异常监控函数检测到的异常数据进行封装，并将异常数据发送至异常监控平台。由此，实现了通过包括多个异常监控函数的异常监控脚本对待监控前端应用的页面异常进行监控，能够对各种类型的页面异常进行监控。

为了实现上述实施例，本发明实施例还提出一种计算机设备，包括存储器、处理器以及存储在存储器中并可在处理器上运行的计算机程序，其特征在于，处理器执行计算机程序时实现如前述方法实施例的前端应用的页面异常的监控方法的步骤。

图3为本发明实施例提供的一种计算机设备的示意图。如图3所示，该实施例的计算机设备50包括：处理器51、存储器52以及存储在存储器52中并可在处理器51上运行的计算机程序53，该计算机程序53被处理器51执行时实现实施例中的前端应用的页面异常的监控方法，为避免重复，此处不一一赘述。或者，该计算机程序被处理器51执行时实现实施例中基于婴儿哭声的情绪检测装置中各模型/单元的功能，为避免重复，此处不一一赘述。

计算机设备50可以是桌上型计算机、笔记本、掌上电脑及云端服务器等计算设备。计算机设备可包括，但不仅限于，处理器51、存储器52。本领域技术人员可以理解，图3仅仅是计算机设备50的示例，并不构成对计算机设备50的限定，可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件，例如计算机设备还可以包括输入输出设备、网络接入设备、总线等。

所称处理器51可以是中央处理单元(Central Processing Unit，CPU)，还可以是其他通用处理器、数字信号处理器(Digital Signal Processor，DSP)、专用集成电路(Application Specific Integrated Circuit，ASIC)、现场可编程门阵列(Field-Programmable Gate Array，FPGA)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件等。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。

存储器52可以是计算机设备50的内部存储单元，例如计算机设备50的硬盘或内存。存储器52也可以是计算机设备50的外部存储设备，例如计算机设备50上配备的插接式硬盘，智能存储卡(Smart Media Card,SMC)，安全数字(Secure Digital,SD)卡，闪存卡(Flash Card)等。进一步地，存储器52还可以既包括计算机设备50的内部存储单元也包括外部存储设备。存储器52用于存储计算机程序以及计算机设备所需的其他程序和数据。存储器52还可以用于暂时地存储已经输出或者将要输出的数据。

为了实现上述实施例，本发明实施例还提出一种计算机可读存储介质，计算机可读存储介质存储有计算机程序，其特征在于，计算机程序被处理器执行时实现如前述方法实施例的前端应用的页面异常的监控方法的步骤。

所属领域的技术人员可以清楚地了解到，为描述的方便和简洁，上述描述的系统，装置和单元的具体工作过程，可以参考前述方法实施例中的对应过程，在此不再赘述。

在本发明所提供的几个实施例中，应该理解到，所揭露的系统，装置和方法，可以通过其它的方式实现。例如，以上所描述的装置实施例仅仅是示意性的，例如，单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，例如，多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口，装置或单元的间接耦合或通信连接，可以是电性，机械或其它的形式。

作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。

另外，在本发明各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，也可以采用硬件加软件功能单元的形式实现。

上述以软件功能单元的形式实现的集成的单元，可以存储在一个计算机可读取存储介质中。上述软件功能单元存储在一个存储介质中，包括若干指令用以使得一台计算机装置(可以是个人计算机，服务器，或者网络装置等)或处理器(Processor)执行本发明各个实施例方法的部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器(Read-OnlyMemory，ROM)、随机存取存储器(Random Access Memory，RAM)、磁碟或者光盘等各种可以存储程序代码的介质。

以上仅为本发明的较佳实施例而已，并不用以限制本发明，凡在本发明的精神和原则之内，所做的任何修改、等同替换、改进等，均应包含在本发明保护的范围之内。

Claims (9)

1.一种前端应用的页面异常的监控方法，其特征在于，包括：

获取待监控前端应用的脚本语言文件；

在所述待监控前端应用的脚本语言文件中设置异常监控标签；其中，所述异常监控标签用于调用异常监控脚本，所述异常监控脚本包括多个异常监控函数；

获取所述待监控前端应用对应的访问请求；

根据所述访问请求，加载所述待监控前端应用中的页面，以及所述异常监控脚本；以及

将所述异常监控函数检测到的异常数据进行封装，并将所述异常数据发送至异常监控平台。

2.如权利要求1所述的监控方法，其特征在于，所述异常监控函数包括：脚本语言文件监控函数，静态资源监控函数，页面异步更新监控函数，无效链接监控函数，页面加载监控函数，文档对象模型结构异常监控函数，开发环境组件监控函数，内存异常和页面崩溃监控函数中的至少一种。

3.如权利要求2所述的监控方法，其特征在于，所述脚本语言文件监控函数通过对错误事件的监听函数进行封装，来实现对所述脚本语言文件运行过程中的异常进行监控。

4.如权利要求2所述的监控方法，其特征在于，所述静态资源监控函数通过窗口事件监听函数，来实现对静态资源加载过程中的异常进行捕获。

5.如权利要求2所述的监控方法，其特征在于，所述页面异步更新监控函数获取页面异步更新函数在出现异常时创建的图像标签，来对页面异步更新过程中的异常进行捕获。

6.如权利要求2所述的监控方法，其特征在于，所述无效链接监控函数通过获取页面中的有效链接，以确定所述页面中的无效链接。

7.一种前端应用的页面异常的监控装置，其特征在于，包括：

第一获取模块，用于获取待监控前端应用的脚本语言文件；

设置模块，用于在所述待监控前端应用的脚本语言文件中设置异常监控标签；其中，所述异常监控标签用于调用异常监控脚本，所述异常监控脚本包括多个异常监控函数；

第二获取模块，用于获取所述待监控前端应用对应的访问请求；

加载模块，用于根据所述访问请求，加载所述待监控前端应用中的页面，以及所述异常监控脚本；

封装模块，用于将所述异常监控函数检测到的异常数据进行封装；以及

发送模块，用于将所述异常数据发送至异常监控平台。

8.一种计算机设备，包括存储器、处理器以及存储在所述存储器中并可在所述处理器上运行的计算机程序，其特征在于，所述处理器执行所述计算机程序时实现如权利要求1至6任一项所述的前端应用的页面异常的监控方法的步骤。

9.一种计算机可读存储介质，所述计算机可读存储介质存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现如权利要求1至6任一项所述的前端应用的页面异常的监控方法的步骤。

Images