网页加载的异常监控方法及装置与流程

本申请涉及软件监控技术领域，特别涉及一种网页加载的异常监控方法及装置、电子设备、计算机可读存储介质。

背景技术：

基于混合模式开发的移动应用称为混合模式移动应用(hybridapp)，其提供了网络视图(webview)作为浏览器内核容器来加载网页，其中，混合模式移动应用所进行网页的加载是使用javascript语言进行的编程。由于开发人员编写的javascript代码可能存在错误，网络视图在对网页的加载过程中可能因无法正常加载出现白屏或网页数据异常等情况，导致用户体验感不佳；并且，如果用户在网页数据异常的情况下仍进行操作，会导致业务信息异常，严重时会造成业务事故。

因此，亟待解决现有混合模式移动应用在进行网页加载时，由于javascript代码错误，导致网页出现白屏或者网页数据异常而引起的业务问题。

技术实现要素：

基于上述技术问题，本申请提供了一种网页加载的异常监控方法及装置、电子设备、计算机可读存储介质。

本申请所揭示的技术方案包括：

一种网页加载的异常监控方法，所述方法应用于混合模式移动应用，所述混合模式移动应用提供网络视图作为加载网页的浏览器内核容器，所述方法包括：在所述混合模式移动应用通过所述网络视图进行网页加载的过程中，监控系统控制台所打印的消息日志；在监控到所述系统控制台打印了与浏览器内核相对应的异常消息日志时，获取所述异常消息日志，且根据所述异常消息日志获取所述浏览器内核加载网页所发生异常的级别；如果所述异常消息日志指示所发生的异常为错误级别，则在所加载的网页中载入异常提示信息。

进一步地，所述在所述混合模式移动应用通过所述网络视图进行网页加载的过程中，监控系统控制台所打印的消息日志，包括：根据所设置的监控线程，对所述系统控制台的应用程序编程接口进行监控；若监控到所述应用程序编程接口报错，则为监控到所述系统控制台打印了消息日志。

进一步地，在所述根据所设置的监控线程，对所述系统控制台的应用程序编程接口进行监控之前，所述方法还包括：检测配置中心所加载的应用程序编程接口名单是否存在更新；如果存在，则获取更新的所述应用程序编程接口名单，以按照所述应用程序编程接口名单所包含的应用程序编程接口对所述系统控制台进行监控。

进一步地，所述在监控到所述系统控制台打印了与浏览器内核相对应的异常消息日志时，获取所述异常消息日志，包括：在监控到所述系统控制台打印了与浏览器内核相对应的异常消息日志时，通过调用方法，将所述异常消息日志输出至系统命令行工具；从所述系统命令行工具中获取所述异常消息日志。

进一步地，所述如果所述异常消息日志指示所发生的异常为错误级别，则在所加载的网页中载入异常提示信息，包括：在所加载的网页中弹出异常信息提示框；如果检测到所述异常信息提示框被触发，则控制所加载的网页跳转至异常错误页面。

一种网页加载的异常监控装置，所述装置包括：消息日志监控模块，用于在混合模式移动应用通过网络视图进行网页加载的过程中，监控系统控制台所打印的消息日志；目标信息获取模块，用于在监控到所述系统控制台打印了与浏览器内核相对应的异常消息日志时，获取所述异常消息日志，且根据所述异常消息日志获取所述浏览器内核加载网页所发生异常的级别；网页异常提示模块，用于在所述异常消息日志指示所发生的异常为错误级别的情况下，则在所加载的网页中载入异常提示信息。

一种电子设备，所述电子设备包括：

处理器；

存储器，所述存储器上存储有计算机可读指令，所述计算机可读指令被所述处理器执行时，实现如前所述网页加载的异常监控方法。

一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时，实现如前所述网页加载的异常监控方法。

本申请实施例提供的技术方案可以包括以下有益效果：

混合模式移动应用在通过网络视图加载网页时，如果出现了javascript代码错误，系统控制台会实时打印对应的异常消息日志，因此，在上述技术方案中，需要监控系统控制台所打印的消息日志，如果监控到系统控制台打印了与浏览器内核相应的异常消息日志，且获取到该异常消息日志为错误级别，即可认定发生了javascript代码错误，此时则控制网络视图在所加载网页中弹出异常提示信息，避免网页出现白屏的问题，增加了用户体验感。

同时，用户可根据网页中弹出的异常提示信息获取相应的网页异常情况，从而不会在出现网页异常的情况下继续操作，避免造成业务事故。

应当理解的是，以上的一般描述和后文的细节描述仅是示例性的，并不能限制本申请。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本申请的实施例，并于说明书一起用于解释本申请的原理。

图1是根据一示例性实施例示出的本发明实施环境的示意图；

图2是根据一示例性实施例示出的一种混合模式移动应用的应用系统框架示意图；

图3是根据一示例性实施例示出的一种网页加载的异常监控方法的流程图；

图4是图3对应实施例中步骤110在一个实施例的流程图；

图5是根据一示例性实施例示出的一种网页加载的异常监控装置的框图。

通过上述附图，已示出本发明明确的实施例，后文中将有更详细的描述，这些附图和文字描述并不是为了通过任何方式限制本发明构思的范围，而是通过参考特定实施例为本领域技术人员说明本发明的概念。

具体实施方式

这里将详细地对示例性实施例执行说明，其示例表示在附图中。下面的描述涉及附图时，除非另有表示，不同附图中的相同数字表示相同或相似的要素。以下示例性实施例中所描述的实施方式并不代表与本申请相一致的所有实施方式。相反，它们仅是与如所附权利要求书中所详述的、本申请的一些方面相一致的装置和方法的例子。

首先对本申请实施例所涉及的几个名词进行解释：

网页加载：加载网页对应的资源文件和缓存数据的过程。其中，资源文件为网页记载时的必要组成文件，包括网页的html文件，css文件、js文件等，这些资源文件是用于网页显示的框架性基础元素，包括版面结构配置、功能模块配置、系统配置等信息，只有对网页进行修改时才会涉及对这些资源文件的修改和更新。缓存数据为需要加载到网页上的数据，一般指图片、文字、视频等相应信息。因此，在进行网页加载的过程中，由缓存数据和资源文件组合形成完整的网页。

混合模式移动应用(hybridapp)：是指介于网络应用(webapp)和本地应用(nativeapp)这两者之间的移动应用，兼具“本地应用良好用户交互体验的优势”和“网络应用跨平台开发的优势”。混合模式移动应用的安装需要从应用商店安装，但部分更新可以不通过应用商店升级。

网络应用：是一种使用网页浏览器在互联网或企业内部网上操作的应用软件，是一种以网页语言(例如html、javascript、java等编程语言)编写的应用程序，需要通过浏览器来运行。网络应用可以直接在电脑平台上运行，不需要实现安装或定期升级程序。

本地应用：又称原生态应用，是一种基于智能手机本地操作系统如ios系统、android系统、wp系统，并使用原生程序编写运行的第三方应用程序，一般采用java、c++、objective-c等编程语言进行应用开发。

js文件：js是javascript语言的简称，js文件是网页中使用高级语言javascript的格式文件。

网络视图(webview)：是一种浏览器内核容器，内置浏览器内核引擎，如webkit、webcore等，支持直接加载和显示网页，还支持前进后退、浏览历史等网页的动态功能。网络视图加载网页的功能和所加载网页的动态功能均是通过js文件中的javascript代码实现的。

图1是根据一示例性实施例示出的一种实施环境的示意图。如图1所示，本发明的实施环境包括：终端100和服务器200。

其中，终端100用于安装以及运行混合模式移动应用，以通过移动应用所提供的用户交互界面，实现与用户之间的交互。终端100可以是智能手机、平板电脑，或者是其他任意能够运行混合模式移动应用的客户端设备，本处不进行限定。

服务器200用于存储海量数据，以在移动应用的正常运行中，响应移动应用所发起的服务请求，并根据服务请求进行数据处理，为移动应用的运行提供可靠的服务。服务器200可以是一台服务器，或者是由若干服务器组成的服务器集群，本处也不进行限定。

图2是根据一示例性实施例提出的一种混合模式移动应用的应用系统框架示意图，该移动应用所对应智能手机的本地操作系统为android系统。

其中，网络视图是整个应用系统的核心基础，主要作为浏览器内核容器用于实现网页端网页的加载，以及对网页加载完成后的后续操作提供支持，例如：文件下载、文件上传、数据缓存等。

网页加载接口包括一些具体方法，这些方法用于对网络视图进行网页加载的过程进行跟踪，例如，通过跟踪网页加载进度的百分比，来获知网页开始加载、网页加载出错、网页加载完成等情况。

js接口包括用于提供本地端调用网页端的js功能(利用javascript代码实现的功能)的具体方法，相应的，android接口包括用于提供网页端调用本地端的系统功能的具体方法。由此，混合模式移动应用要实现本地端和网页端之间的交互，需要进行框架中js接口和android接口之间的相互调用。

android接口还用于直接调用框架中集成的系统功能，如图2所示的升级功能、消息提示功能、系统工具类功能等，或者通过android接口在应用系统中自定义系统功能(例如退出、返回键相应等功能)。

本地端则可通过调用框架接口来获取框架中集成的系统功能，例如，通过调用如图2所示的升级接口，来获取框架中集成的升级功能。

应当说明的是，图2所示的混合模式移动应用的应用系统框架只是适配于本发明的一个示例，不能认为是提供了对本发明的使用范围的任意限制。该混合模式移动应用的应用系统框架也不能解释为需要依赖或者必须具有图2中所示出一个或者多个组件。

图3是根据一示例性实施例示出的一种网页加载的异常监控方法的流程图。如图3所示，该方法至少包括以下步骤：

步骤110，在混合模式移动应用通过网络视图加载网页的过程中，监控系统控制台所打印的消息日志。

其中，系统控制台为混合模式移动应用在应用系统中所设置的控制端应用程序，用于控制和协调应用系统的各种功能，例如通话功能、多媒体功能、浏览器功能等。

当系统控制台监测到应用系统在运行过程中出现异常时，系统控制台会打印相应的消息日志，因此，系统控制台所打印的消息日志应当包括应用系统中的全部消息日志。

而混合模式移动应用在通过网络视图加载网页的过程中，为了及时获知网络视图对当前网页的加载是否出现异常，需监控系统控制台所打印的消息日志，尤其是与浏览器内核相对应的消息日志。

应当说明的是，系统控制台对应用系统运行所出现的异常的监测，以及根据所监测到的异常打印消息日志的功能，是由移动设备本地操作系统(如android系统)所提供的原生功能，本处不做赘述。

并且，由于html5(简称h5)网页支持更多的交互功能，且能够在移动设备(如智能手机)上支持多媒体功能，在本实施例中，网络视图所加载网页具体可以是h5网页。

在一种实施例中，如图4所示，监控系统控制台所打印的消息日志具体可以包括以下步骤：

步骤111，根据所设置的监控线程，对系统控制台的应用编程接口进行监控。

其中，系统控制台的应用编程接口(api，applicationprogramminginterface)具体为控制端应用程序中预先定义的函数，用于提供其他应用程序得以访问系统控制台的能力。

系统控制台所包含不同的应用程序编程接口，分别与系统控制台对应用系统中的不同应用程序所进行的监测一一对应，其中，应用系统中的不同应用程序分别用于在该应用系统中实现不同的功能。

例如，网络视图在加载网页的过程中，对网页加载是否存在异常的监测可以是通过网页端所提供的javascript应用编程接口来实现的，其中javascript应用编程接口具体可以包括与应用程序的运行情况相对应的多个接口。

举例来说，假设在网页端的javascript应用程序中，当调用android系统中的原生(console)对象时，android系统的webkit引擎支持以下的javascript应用编程接口，则可通过所设置的监控线程以下应用编程接口进行监控：

“console.log(string)

console.info(string)

console.warn(string)

console.error(string)”。

步骤113，若监控到所述应用程序编程接口报错，则为监控到系统控制台打印了消息日志。

其中，应用程序编程接口报错，表示系统控制台监测到应用系统中用以实现不同功能的应用程序在运行中出现了异常，系统控制台则打印与所出现的异常相对应的消息日志。

由此，如果监控线程监控到系统控制台的应用程序编程接口报错，则视为监控到系统控制台打印了消息日志。

在更佳的实施例中，实现监控系统控制台所打印的消息日志的方法，在执行上述步骤111之前还可以包括以下步骤：

检测配置中心所加载的应用程序编程接口名单是否存在更新；

如果存在，则获取更新的应用程序编程接口名单，按照应用程序编程接口名单所包含应用程序编程接口对系统控制台进行监控。

其中，配置中心为运行在混合模式移动应用所对应服务器上的应用程序，用于根据所包含的配置数据对应用系统中的各种应用程序进行配置。

在本实施例中，配置中心加载有应用程序编程接口名单，系统控制台需按照该名单中所包含的应用程序编程接口，来对应用系统中各应用程序的运行情况进行监测。

由于在配置中心加载的应用程序编程接口名单中，所包含的应用程序编程接口可进行动态配置，因此，在执行步骤111之前，还需检测配置中心所加载的应用程序编程接口名单是否存在更新。

如果检测到该名单存在更新，则获取该名单，并按照名单中所包含的应用程序编程接口对系统控制台进行监控，即，所监控系统控制台的应用程序编程接口，应当与配置中心所加载应用程序编程接口名单所包含的应用程序编程接口一一对应。

应当说明的是，应用程序编程接口名单存在更新的情况包括，对该名单所包含的应用程序编程接口进行了增加、删除、或者替换的操作。

举例来说，由于应用程序一般只有在相应代码运行出现错误(error)的情况下，才可能导致代码不能正常运行，因此，在如前所述android系统的webkit引擎所支持的javascript应用编程接口中，可以只对“console.error(string)”接口进行监控。

由此，可通过对配置中心所加载应用程序编程接口名单进行动态配置，以实现对系统控制台中指定的应用程序编程接口进行监控，灵活性和扩展性更佳。并且，还可以通过本实施例提供的方法对应用系统中不必要的功能进行过滤，从而节省了系统资源。

步骤130，在监控到系统控制台打印了与浏览器内核相对应的异常消息日志时，获取异常消息日志，且根据异常消息日志获取浏览器内核加载网页所发生异常的级别。

其中，由于网络视图加载网页时需要调用浏览器内核，因此，本实施例中需要监控系统控制台是否打印了与浏览器内核相对应的异常消息日志。系统控制台所打印的异常消息日志中，包括相应应用程序所运行出现异常的代码内容、异常代码所对应的代码行数、异常代码所对应的异常级别等。异常代码所对应的异常级别也称为异常消息日志的类型信息，可包括info、debug、trace、warn、error等不同级别。

如前所述，监控到系统控制台打印了与浏览器内核相对应的异常消息日志，是指监控到系统控制台与浏览器内核相对应的应用程序编程接口报错。如果监控到系统控制台打印了该异常消息日志，则表示网络视图在加载当前网页的过程中出现了异常情，需根据异常消息日志判断，导致网络视图加载网页异常的原因。

由于网络视图加载网页的功能是通过开发人员所编写的javascript代码实现的，因此，需要获取系统控制台所打印的异常消息日志，以通过对所获取异常消息日志进行解析，来得到导致网页加载异常的原因是否为应用系统中所设置的javascript代码错误。

在一实施例中，获取系统控制台所打印异常消息日志的方法至少可以包括以下步骤：

在监控到系统控制台打印了与浏览器内核相对应的异常消息日志时，通过调用方法，将异常消息日志输出至系统命令行工具；

从系统命令行工具中获取异常消息日志。

其中，当监控线程监控到系统控制台打印了异常消息日志时，应用系统通过回调方法，将系统控制台所打印的异常消息日志输出至应用系统的命令行工具(logcat)中。

命令行工具则是本地操作系统的日志系统所提供的一个用于收集和查看系统日志的调试输出机制，通过从应用系统的各种应用程序中收集一系列消息日志，然后将所收集的消息日志放入命令行工具中，则可使用命令行工具对应的命令查看和过滤这些消息日志。

具体的，在网页端的javascript应用程序中，当调用原生(console)对象时，可通过调用“onconsolemessage()”方法，使系统控制台打印的异常消息日志输出至命令行工具中，然后，再通过调用网络视图的“setwebchormeclient(方法)”把异常消息日志传递给网络视图。

同时，还可以通过调用网络视图的“messagelevel()”方法，来获取异常消息日志的异常级别，由此可使得网络视图在进行加载网页的过程中，能够及时获知当前网页加载异常的信息。

步骤150，如果异常消息日志指示所发生的异常为错误级别，则在所加载的网页中载入异常提示信息。

其中，异常消息日志指示所发生的异常为错误级别是指，通过步骤130所描述的方法，获得异常消息日志所记录的异常级别为error级别。异常提示信息具体可以包括异常信息提示框和/或异常错误页面。

在一种实施例中，如果异常消息日志为错误级别，则控制网络视图在当前所加载的网页中弹出异常信息提示框，从而防止所加载网页中出现白屏，增加了用户体验。

异常信息提示框用于提示用户当前网页加载异常的情况，此时，用户可以选择关闭当前网页，或者退出混合模式移动应用，从而避免用户继续进行业务操作，而引起不必要的业务问题。

而在另一种实施例中，在当前所加载网页中弹出异常信息提示框之后，如果检测到该异常信息提示框被触发，则控制网络视图将当前所加载的网页跳转至异常错误页面。

其中，异常信息提示框所对应的触发操作可以是用户点击或者长按用户交互界面中，该异常信息提示框所对应的区域，或者还可以是该异常信息提示框的显示达到指定时间长度时，由应用系统所设置应用程序主动触发的。或者还可以采用其他的触发方式，本处不进行任何限定。

应当说明的是，本实施例所描述的异常错误页面具体可以是h5网页，以进一步阻止用户在网页异常的情况下继续进行业务操作。

而在另一种更佳的实施例中，异常错误页面具体为一经由特殊设计的网页，例如是一款网页小游戏，或者能够带给用户良好视觉效果的图片，进一步提升用户对该移动应用的体验感。

因此，与现有技术相比，本申请所提供的方法能够避免网页出现白屏，有效地提升了用户体验感，同时在网页加载异常的情况下，能够避免用户继续进行操作而引发的业务问题。

图5是根据一示例性实施例所示出的一种网页加载的异常监控装置的框图。如图5所示，该装置包括消息日志监控模块210、目标信息获取模块230和网页异常提示模块250。

消息日志监控模块210用于在混合模式移动应用通过网络视图进行网页加载的过程中，监控系统控制台所打印的消息日志；

目标信息获取模块230用于在监控到所述系统控制台打印了与浏览器内核相对应的异常消息日志时，获取所述异常消息日志，且根据所述异常消息日志获取所述浏览器内核加载网页所发生异常的级别；

网页异常提示模块250用于在所述异常消息日志指示所发生的异常为错误级别的情况下，在所加载的网页中载入异常提示信息。

在另一示例性实施例中，消息日志监控模块210具体包括线程监控单元和信息识别单元。

其中，线程监控单元用于根据所设置的监控线程，对所述系统控制台的应用程序编程接口进行监控。

信息识别单元用于在监控到所述应用程序编程接口报错的情况下，则识别为监控到所述系统控制台打印了消息日志。

在另一示例性实施例中，消息日志监控模块210还包括更新信息检测单元和更新信息获取单元。

其中，更新信息检测单元用于检测配置中心所加载的应用程序编程接口名单是否存在更新。

更新信息获取单元用于在更新信息检测单元检测到配置中心所加载的应用程序编程接口名单存在更新的情况下，获取更新的所述应用程序编程接口名单，以按照所述应用程序编程接口名单所包含的应用程序编程接口对所述系统控制台进行监控。

在另一示例性实施例中，目标信息获取模块230具体包括异常日志输出单元和异常日志获取单元。

其中，异常日志输出单元用于在监控到所述系统控制台打印了与浏览器内核相对应的异常消息日志时，通过调用方法，将所述异常消息日志输出至系统命令行工具。

异常日志获取单元用于从所述系统命令行工具中获取所述异常消息日志。

在另一示例性实施例中，网页异常提示模块250具体包括提示框载入单元和触发检测单元。

其中，提示框载入单元用于在所加载的网页中弹出异常信息提示框。

触发检测单元用于检测所述异常信息提示框是否被触发，且在检测到所述异常信息提示框被触发时，控制所记载的网页跳转至异常错误页面。

需要说明的是，上述实施例所提供的装置与上述实施例所提供的方法属于同一构思，其中各个模块执行操作的具体方式已经在方法实施例中进行了详细描述，此处不再赘述。

在一示例性实施例中，本申请还提供一种电子设备，该电子设备包括：

处理器；

存储器，该存储器上存储有计算机可读指令，该计算机可读指令被处理器执行时，实现如前所述网页加载的异常监控方法。

在一示例性实施例中，本申请还提供一种计算机可读存储介质，其上存储有计算机程序，该计算机程序被处理器执行时，实现如前所述网页加载的异常监控方法。

应当理解的是，本申请并不局限于上面已经描述并在附图中示出的精确结构，并且可以在不脱离其范围执行各种修改和改变。本申请的范围仅由所附的权利要求来限制。