CN115033240A - 报错信息的处理方法、装置、计算机设备及存储介质 - Google Patents

Abstract

本申请实施例属于大数据领域，涉及一种报错信息的处理方法，包括：在目标页面运行过程中，基于预设的错误收集脚本监听错误事件的触发情况；在监听到所述错误事件被触发后，收集与所述错误事件对应的报错信息；获取与所述目标页面的页面代码文件对应的目标项目的项目信息；基于预设的文件管理中心获取与所述项目信息对应的目标信息文件；基于所述报错信息与所述目标信息文件，确定所述报错信息在相应的源文件中的错误定位信息。本申请还提供一种报错信息的处理装置、计算机设备及存储介质。此外，本申请还涉及区块链技术，错误定位信息可存储于区块链中。本申请实现了对前端项目在发生异常时的快速定位，有效地提高了错误定位处理的处理效率。

Description

报错信息的处理方法、装置、计算机设备及存储介质

技术领域

本申请涉及大数据和应用程序开发技术领域，尤其涉及报错信息的处理方法、装置、计算机设备及存储介质。

背景技术

在前端开发中，对于生产环境的代码通常会进行压缩和混淆处理，以减小代码体积并提高源代码安全性。然而当生产环境有JavaScript错误发生时，根据压缩和混淆的代码的报错信息会让定位错误变得更困难。

针对前述问题，目前虽然已有Source Map方案，但是当web前端项目上线时，出于安全考虑不会同时上传Source Map文件。因此出现错误时，往往需要相关用户人工查找并上传本地的Source Map文件，再基于Source Map文件进行人工分析并定位错误，这样的错误定位处理方式需要花费较多的人力物力，处理效率较低。

发明内容

本申请实施例的目的在于提出一种报错信息的处理方法、装置、计算机设备及存储介质，以解决现有的错误定位处理方式需要花费较多的人力物力，处理效率较低的问题。

为了解决上述技术问题，本申请实施例提供一种报错信息的处理方法，采用了如下所述的技术方案：

在目标页面运行过程中，基于预设的错误收集脚本监听错误事件的触发情况；

在监听到所述错误事件被触发后，收集与所述错误事件对应的报错信息；

获取与所述目标页面的页面代码文件对应的目标项目的项目信息；

基于预设的文件管理中心获取与所述项目信息对应的目标信息文件；

基于所述报错信息与所述目标信息文件，确定所述报错信息在相应的源文件中的错误定位信息。

进一步的，在所述基于预设的文件管理中心获取与所述项目信息对应的目标信息文件的步骤之前，还包括：

在所述目标项目的打包过程中集成预设的文件上传插件；

基于所述文件上传插件获取所述目标项目打包完成后生成的信息文件；

调用所述文件管理中心的上传接口将所述信息文件上传至所述文件管理中心内。

进一步的，所述项目信息包括第一项目名称与项目版本号，所述基于预设的文件管理中心获取与所述项目信息对应的目标信息文件的步骤，具体包括：

基于所述第一项目名称与所述项目版本号对所述文件管理中心进行文件查询处理，判断所述文件管理中心内是否存储有与所述第一项目名称及所述项目版本号均匹配的第一信息文件；

若存储有所述第一信息文件，将所述第一信息文件作为所述目标信息文件；

获取所述目标信息文件。

进一步的，所述项目信息包括第二项目名称，所述基于预设的文件管理中心获取与所述项目信息对应的目标信息文件的步骤，具体包括：

基于所述第二项目名称对所述文件管理中心进行文件查询处理，从所述文件管理中心中查询出与所述第二项目名称匹配的所有第二信息文件；

展示所述文件管理中心内存储的所有所述第二信息文件；

接收第一目标用户从所有所述第二信息文件中选择的第三信息文件；

将所述第三信息文件作为所述目标信息文件，并获取所述目标信息文件。

进一步的，所述基于所述报错信息与所述目标信息文件，确定所述报错信息在相应的源文件中的错误定位信息的步骤，具体包括：

对所述报错信息进行解析处理得到对应的错误堆栈信息；

调用预设的信息库；

基于所述信息库对所述错误堆栈信息与所述目标信息文件进行错误定位处理，得到所述报错信息在相应的源文件中的错误定位信息。

进一步的，在所述在目标页面运行过程中，基于预设的错误收集脚本监听错误事件的触发情况的步骤之前，还包括：

从预设的所有文件生成配置中筛选出与生成所述目标项目的信息文件对应的多个候选文件生成配置；

获取与各所述候选文件生成配置分别对应的功能描述信息；

展示各所述候选文件生成配置，以及展示与各所述候选文件生成配置分别对应的功能描述信息；

接收第二目标用户从所有所述候选文件生成配置中选择的目标候选文件生成配置；

在所述目标项目的配置文件中的指定选项内填充所述目标候选文件生成配置。

进一步的，在所述基于所述报错信息与所述目标信息文件，确定所述报错信息在相应的源文件中的错误定位信息的步骤之后，还包括：

获取预设的信息输出模板；

将所述错误定位信息输入至所述信息输出模板内，生成与所述错误定位信息对应的报错报告；

展示所述报错报告。

为了解决上述技术问题，本申请实施例还提供一种报错信息的处理装置，采用了如下所述的技术方案：

监听模块，用于在目标页面运行过程中，基于预设的错误收集脚本监听错误事件的触发情况；

收集模块，用于在监听到所述错误事件被触发后，收集与所述错误事件对应的报错信息；

第一获取模块，用于获取与所述目标页面的页面代码文件对应的目标项目的项目信息；

第二获取模块，用于基于预设的文件管理中心获取与所述项目信息对应的目标信息文件；

确定模块，用于基于所述报错信息与所述目标信息文件，确定所述报错信息在相应的源文件中的错误定位信息。

为了解决上述技术问题，本申请实施例还提供一种计算机设备，采用了如下所述的技术方案：

在目标页面运行过程中，基于预设的错误收集脚本监听错误事件的触发情况；

在监听到所述错误事件被触发后，收集与所述错误事件对应的报错信息；

获取与所述目标页面的页面代码文件对应的目标项目的项目信息；

基于预设的文件管理中心获取与所述项目信息对应的目标信息文件；

基于所述报错信息与所述目标信息文件，确定所述报错信息在相应的源文件中的错误定位信息。

为了解决上述技术问题，本申请实施例还提供一种计算机可读存储介质，采用了如下所述的技术方案：

在目标页面运行过程中，基于预设的错误收集脚本监听错误事件的触发情况；

在监听到所述错误事件被触发后，收集与所述错误事件对应的报错信息；

获取与所述目标页面的页面代码文件对应的目标项目的项目信息；

基于预设的文件管理中心获取与所述项目信息对应的目标信息文件；

基于所述报错信息与所述目标信息文件，确定所述报错信息在相应的源文件中的错误定位信息。

与现有技术相比，本申请实施例主要有以下有益效果：

在监听到目标页面在运行过程中触发的错误事件后，会自动收集错误事件对应的报错信息，并获取与目标页面对应的目标项目的项目信息，之后基于预设的文件管理中心快速获取与项目信息对应的目标信息文件，进而基于得到的报错信息与目标信息文件，自动确定出报错信息在相应的源文件中的错误定位信息，实现了对前端项目在发生异常时的快速定位，有效地提高了错误定位处理的处理效率，提高了用户的使用体验。

附图说明

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

图1是本申请可以应用于其中的示例性系统架构图；

图2根据本申请的报错信息的处理方法的一个实施例的流程图；

图3是根据本申请的报错信息的处理装置的一个实施例的结构示意图；

图4是根据本申请的计算机设备的一个实施例的结构示意图。

具体实施方式

除非另有定义，本文所使用的所有的技术和科学术语与属于本申请的技术领域的技术人员通常理解的含义相同；本文中在申请的说明书中所使用的术语只是为了描述具体的实施例的目的，不是旨在于限制本申请；本申请的说明书和权利要求书及上述附图说明中的术语“包括”和“具有”以及它们的任何变形，意图在于覆盖不排他的包含。本申请的说明书和权利要求书或上述附图中的术语“第一”、“第二”等是用于区别不同对象，而不是用于描述特定顺序。

在本文中提及“实施例”意味着，结合实施例描述的特定特征、结构或特性可以包含在本申请的至少一个实施例中。在说明书中的各个位置出现该短语并不一定均是指相同的实施例，也不是与其它实施例互斥的独立的或备选的实施例。本领域技术人员显式地和隐式地理解的是，本文所描述的实施例可以与其它实施例相结合。

为了使本技术领域的人员更好地理解本申请方案，下面将结合附图，对本申请实施例中的技术方案进行清楚、完整地描述。

如图1所示，系统架构100可以包括终端设备101、102、103，网络104和服务器105。网络104用以在终端设备101、102、103和服务器105之间提供通信链路的介质。网络104可以包括各种连接类型，例如有线、无线通信链路或者光纤电缆等等。

用户可以使用终端设备101、102、103通过网络104与服务器105交互，以接收或发送消息等。终端设备101、102、103上可以安装有各种通讯客户端应用，例如网页浏览器应用、购物类应用、搜索类应用、即时通信工具、邮箱客户端、社交平台软件等。

终端设备101、102、103可以是具有显示屏并且支持网页浏览的各种电子设备，包括但不限于智能手机、平板电脑、电子书阅读器、MP3播放器(Moving PictureExpertsGroup Audio Layer III，动态影像专家压缩标准音频层面3)、MP4(MovingPictureExperts Group Audio Layer IV，动态影像专家压缩标准音频层面4)播放器、膝上型便携计算机和台式计算机等等。

服务器105可以是提供各种服务的服务器，例如对终端设备101、102、103上显示的页面提供支持的后台服务器。

需要说明的是，本申请实施例所提供的报错信息的处理方法一般由服务器/终端设备执行，相应地，报错信息的处理装置一般设置于服务器/终端设备中。

应该理解，图1中的终端设备、网络和服务器的数目仅仅是示意性的。根据实现需要，可以具有任意数目的终端设备、网络和服务器。

继续参考图2，示出了根据本申请的报错信息的处理方法的一个实施例的流程图。所述的报错信息的处理方法，包括以下步骤：

步骤S201，在目标页面运行过程中，基于预设的错误收集脚本监听错误事件的触发情况。

在本实施例中，报错信息的处理方法运行于其上的电子设备(例如图1所示的服务器/终端设备)。需要指出的是，上述无线连接方式可以包括但不限于3G/4G/5G连接、WiFi连接、蓝牙连接、WiMAX连接、Zigbee连接、UWB(ultra wideband)连接、以及其他现在已知或将来开发的无线连接方式。

实际应用中，本申请应用于前端开发，开发的页面的代码需要经过浏览器的解析进行页面展示运行。所述错误收集脚本为目标页面对应的目标项目打包时，通过插件自动引入到目标页面的页面代码文件中的。错误事件为页面发生异常时触发的事件，即前端运行出错时产生错误信息所对应的事件。为了对页面运行进行错误监控，页面代码文件中的错误收集脚本会先被解析执行。具体的，插件是基于webpack的插件，webpack是代码编译工具，有入口、出口、loader和插件。webpack是一个用于现代JavaScript应用程序的静态模块打包工具。当webpack处理应用程序时，它会在内部构建一个依赖图(dependency graph)，此依赖图对应映射到项目所需的每个模块，并生成一个或多个bundle。在实现时通过在webpack的配置文件中配置错误收集脚本的超文本传输协议地址，引入的位置以及文件的类型，在页面代码打包时通过将该插件进行集成即可。另外，错误收集脚本的引入位置设置为页面的顶部，由于浏览器进行文件解析时是从上到下的顺序决定的，从而只有在页面顶部时，才能够保证对页面中的所有的异常错误信息进行监控和捕获。此外，页面代码文件可以为HTML文件、js文件等。本申请通过使用插件的方式实现将错误收集脚本自动引入到页面代码文件中，当需要对多个页面进行错误事件监控时，能够避免在每个页面中都引入错误收集脚本，有效地提高了对于页面的错误监控的处理效率。

步骤S202，在监听到所述错误事件被触发后，收集与所述错误事件对应的报错信息。

在本实施例中，错误事件会在前端发生对应的异常时触发，因此可以通过监听错误事件的触发情况来进行判断页面是否发生异常，并进行后续的报错信息的捕获。错误事件主要是由Window对象监听的。在实际应用还可以根据实际需求监听更多种事件，本申请中不作限制。即错误事件可以任意的能够通过监听捕获报错信息的事件。举例地，所述错误事件具体可为JS错误对应的error事件，error事件可通过window.addEventListener对象监听error事件并进行收集。或者，所述错误事件还可为框架错误对应的事件，框架错误一般利用框架暴露的钩子函数收集，比如Vue.config.errorHandler。

具体的，当目标页面发生运行异常时，其对应的错误事件会触发。当监听到错误事件触发后，可以捕获到相应的报错信息。举例地，对于前述error事件，可以捕获到的报错信息可以为目标页面中javascript代码异常报错的错误信息、错误堆栈、错误行数列数、对应的文件名。

步骤S203，获取与所述目标页面的页面代码文件对应的目标项目的项目信息。

在本实施例中，目标页面的页面代码文件与目标项目具有对应关系，可根据目标页面的页面代码文件来查询出对应的目标项目的项目信息。所述项目信息至少包括目标项目的项目名称，还可包括目标项目的项目版本号。

步骤S204，基于预设的文件管理中心获取与所述项目信息对应的目标信息文件。

在本实施例中，所述目标信息文件具体是指与目标项目对应的Source Map文件。Source Map文件为保存源代码映射关系的文件，在项目开发完成并进行打包时，打包文件夹中除了js，css图片字体等资源文件外，还包括xxx.js.map的文件。将后缀为map的文件作为Source Map文件，即Source Map文件为保存了源代码和编译后代码映射关系(通常经过压缩混淆和其他转换)的信息文件。另外，对于各种主流前端打包工具都支持生成SourceMap文件。举例地，对于Webpack前端打包工具，通过在其配置文件webpack.config.js中的devtool选项设置一个文件生成配置，即可生成与该文件生成配置相应的Source Map文件。

为了获取与错误信息相对应的源代码，可以先基于预先创建的文件管理中心来获取Source Map文件，进而基于与Source Map文件对应的转换规则来获取与报错信息对应的源代码。另外，预先创建的文件管理中心用于集中管理SourceMap文件的添加和删除。相关用户可以通过文件管理中心查看每个项目对应的SourceMap文件。此外，还提供了通过文件管理中心进行选择SourceMap文件进行关联的功能，对于不能每次每个版本都能上传SourceMap文件的项目，相关用户能够进行列表和搜索选择需要匹配的Source Map文件。

步骤S205，基于所述报错信息与所述目标信息文件，确定所述报错信息在相应的源文件中的错误定位信息。

在本实施例中，在得到报错信息以及目标项目的Source Map文件后，可以调用预设的信息库对Source Map文件与报错信息进行错误定位，解析出源代码级别上的错误信息，即与报错信息相对应的源代码信息。该源代码信息指报错信息在相应的源文件中的错误定位信息，具体可包括报错信息在源文件中的行号、文件源代码、文件真实路径以及报错出发点位置等信息。源文件是指目标项目对应的源文件。具体的，所述信息库为source-map库，可通过source-map库将Source Map文件转换为SourceMapConsumer对象，SourceMapConsumer对象表示一个已解析的源映射的相关信息，通过为SourceMapConsumer对象提供文件位置和文件内容来在生成的源文件列表中查询有关原始文件位置的信息并输出。所述文件位置可对Source Map文件进行解析获取，具体指Source Map文件对应的源文件在预设的源文件列表中的位置信息，所述文件内容可从报错信息解析生成的错误堆栈信息中进行获取，文件内容指报错信息中需要查找的行列数。

进一步地，还可基于与Source Map文件对应的文件解析规范来对Source Map文件与报错信息进行处理，以确定出报错信息在相应的源文件中的错误定位信息。具体的，可先基于文件解析规范对Source Map文件进行处理确定出与报错信息对应的源文件，再基于报错信息中的行号与源文件，来确定报错信息在源文件中的错误定位信息，错误定位信息具体可包括报错信息在源文件中的行号、源文件中的代码、源文件路径与报错信息错出发点位置等信息。

本申请在监听到目标页面在运行过程中触发的错误事件后，会自动收集错误事件对应的报错信息，并获取与目标页面对应的目标项目的项目信息，之后基于预设的文件管理中心快速获取与项目信息对应的目标信息文件，进而基于得到的报错信息与目标信息文件，自动确定出报错信息在相应的源文件中的错误定位信息，实现了对前端项目在发生异常时的快速定位，有效地提高了错误定位处理的处理效率，提高了用户的使用体验。

在本实施例的一些可选的实现方式中，在步骤S204之前，上述电子设备还可以执行以下步骤：

在所述目标项目的打包过程中集成预设的文件上传插件。

在本实施例中，文件上传插件为用于执行收集上传项目打包完成后生成的信息文件，即SourceMap文件的处理逻辑的插件。通过在打包部署项目时集成文件上传插件,便可实现将生成的SourceMap文件自动上传。具体可在目标项目的开发包，即devDependencies中安装该文件上传插件，并在目标项目中的Webpack的plugin配置中增加该文件上传插件的插件配置，即可完成对于文件上传插件的集成处理。

基于所述文件上传插件获取所述目标项目打包完成后生成的信息文件。

在本实施例中，在获取到目标项目打包完成后生成的信息文件后，可还可同时获取目标项目的项目名称、项目版本号，以便后续可以基于目标项目的项目名称、项目版本号作为信息索引来将Source Map对应上传至文件管理中心。

调用所述文件管理中心的上传接口将所述信息文件上传至所述文件管理中心内。

在本实施例中，在目标项目打包时通过文件上传插件上传信息文件，具体可指上传包含目标项目的项目名称及项目版本号的信息文件。具体的，使用者在项目打包流程中集成文件上传插件，便可将目标项目打包完成后生成的信息文件自动上传，在项目编译过程中调用文件管理中心的上传接口自动拉取信息文件。文件上传插件能够在不影响项目编译流程的前提下，在Webpack输出asset到output目录之后，获取打包生成的Source Map文件并执行收集上传逻辑。通过使用简单的配置来通过Webpack的Plugin进行Source Map文件的上传，并且上传过程出现异常不影响项目整体编译流程，代码侵入性低。进一步地，可以通过参数配置可以选择在Webpack编译完成执行后对生成的Source Map文件进行删除，即在项目的信息文件上传完成后可以删除构建过程中产生的信息文件。

本申请通过在目标项目的打包过程中集成预设的文件上传插件，并基于该文件上传插件来将目标项目打包完成后生成的信息文件上传至文件管理中心内，使得后续在获取到与目标页面的页面代码文件对应的项目信息后，能够快速的从文件管理中心获取与该项目信息对应的目标信息文件，进而能够基于报错信息与目标信息文件，来快速地确定出报错信息在相应的源文件中的错误定位信息，避免了需要人工查找并上传信息文件的处理过程，有效地提高了错误定位信息的生成效率。

在一些可选的实现方式中，所述项目信息包括第一项目名称与项目版本号，步骤204包括以下步骤：

基于所述第一项目名称与所述项目版本号对所述文件管理中心进行文件查询处理，判断所述文件管理中心内是否存储有与所述第一项目名称及所述项目版本号均匹配的第一信息文件。

在本实施例中，在收集到目标页面在运行过程中产生的报错信息后，可以根据产生报错的目标项目的项目名称、项目版本号从文件管理中心查找与目标项目对应的信息文件。

若存储有所述第一信息文件，将所述第一信息文件作为所述目标信息文件。

在本实施例中，如果存储有所述第一信息文件，则直接将该第一信息文件确定为目标项目在打包完成后生成的Source Map文件，也即所述目标信息文件。

获取所述目标信息文件。

在本实施例中，在确定出目标信息文件在文件管理中心内的存储位置后，可基于该存储位置来进行对于目标信息文件的下载处理，以实现对于目标信息文件的获取。

本申请通过使用文件管理中心来自动获取目标项目的目标信息文件，从而无需人工进行对于信息文件的手动查找，提高了信息文件的获取效率。另外，在获取到与目标页面的页面代码文件对应的项目信息后，能够快速地动文件管理中心获取与项目信息对应的目标信息文件，进而基于报错信息与目标信息文件来自动确定出报错信息在对应的源文件中的错误定位信息，有效地提高了错误定位信息的生成效率。

在一些可选的实现方式中，所述项目信息包括第二项目名称，步骤204包括以下步骤：

基于所述第二项目名称对所述文件管理中心进行文件查询处理，从所述文件管理中心中查询出与所述第二项目名称匹配的所有第二信息文件。

在本实施例中，可能出现在项目打包时通过文件上传插件上传了错误版本及项目名称的信息文件，则此时会无法自动在文件管理中心匹配到与项目相对应的信息文件。或者，在一些微前端架构项目中，微前端独立上线，有独立的版本控制，而采集报错的只需集成在基座项目，微前端打包上线的流程中无法获取基座项目的版本，从而会造成信息文件在文件管理中心无法自动关联匹配的情况。进一步地，为了解决信息文件上传时无法获取项目版本号的问题，可以在文件上传插件中支持传入微前端版本的函数，在基座项目中根据微前端的标识等计算获取微前端的版本号，当采集到报错信息投递时，将微前端的版本号一同投递，从而后续可以根据微前端的版本号来成功实现在文件管理中心对于项目的信息文件的自动关联。

展示所述文件管理中心内存储的所有所述第二信息文件。

在本实施例中，可以在当前的显示界面对文件管理中心内存储的所有第二信息文件进行展示。另外，还可在显示界面中生成文件选择提醒信息并展示，以通过该文件选择提醒信息提醒相关用户从所有第二信息文件中选择出与目标项目相对应的信息文件。对于文件选择提醒信息的内容不做限定，可根据实际需求预先设置即可。

接收第一目标用户从所有所述第二信息文件中选择的第三信息文件。

在本实施例中，提供了可以通过文件管理中心进行选择map进行关联的功能，对于不能每次都能上传每个版本的Source Map文件的项目，能够进行列表和搜索选择需要匹配的map文件。

将所述第三信息文件作为所述目标信息文件，并获取所述目标信息文件。

在本实施例中，在确定出目标信息文件在文件管理中心内的存储位置后，可基于该存储位置来进行对于目标信息文件的下载处理，以实现对于目标信息文件的获取。

本申请当出现项目信息只包括项目名称时以使文件管理中心无法自动匹配到相应的信息文件的情况时，会智能地从文件管理中心中查询出与项目名称匹配的所有第二信息文件并展示，使得相关用户可以根据实际的使用需求来从所有第二信息文件中选取出与目标项目对应的正确的目标信息文件，提高了目标信息文件的确定智能性，提高了用户使用体验。

在一些可选的实现方式中，步骤205包括以下步骤：

对所述报错信息进行解析处理得到对应的错误堆栈信息。

在本实施例中，在收集到错误事件对应的报错信息后，可通过使用Error.prototype.stack属性对报错信息进行解析处理，以得到与报错信息对应的错误堆栈信息。

调用预设的信息库。

在本实施例中，所述信息库具体为Mozilla的source-map库。

基于所述信息库对所述错误堆栈信息与所述目标信息文件进行错误定位处理，得到所述报错信息在相应的源文件中的错误定位信息。

在本实施例中，在获取到报错信息以及目标项目的Source Map文件后，可以调用信息库，即source-map库对Source Map文件与报错信息进行错误定位，解析出源代码级别上的错误信息，即与报错信息相对应的源代码信息。该源代码信息指报错信息在相应的源文件中的错误定位信息，具体可包括报错信息在源文件中的行号、文件源代码、文件真实路径以及报错出发点位置等信息。具体的，可通过source-map库将Source Map文件转换为SourceMapConsumer对象，SourceMapConsumer对象表示一个已解析的源映射的相关信息，通过为SourceMapConsumer对象提供文件位置和文件内容来在生成的源文件列表中查询有关原始文件位置的信息并输出。所述文件位置可对Source Map文件进行解析获取，具体指Source Map文件对应的源文件在预设的源文件列表中的位置信息，所述文件内容可从报错信息解析生成的错误堆栈信息中进行获取，文件内容指报错信息中需要查找的行列数。

本申请在对报错信息进行解析得到错误堆栈信息后，通过利用信息库来述错误堆栈信息与目标信息文件进行错误定位处理，从而实现自动生成报错信息在对应的源文件中的错误定位信息，提高了错误定位信息的生成效率，也保证了生成的错误定位信息的准确性。

在本实施例的一些可选的实现方式中，在步骤S201之前，上述电子设备还可以执行以下步骤：

从预设的所有文件生成配置中筛选出与生成所述目标项目的信息文件对应的多个候选文件生成配置。

在本实施例中，目标项目为使用Webpack前端打包工具进行打包的。对于Webpack前端打包工具，通过在其配置文件webpack.config.js中的devtool选项设置一个文件生成配置，即可生成与该文件生成配置相应的Source Map文件。预设的所有文件生成配置是指devtool选项对应的所有可选的文件生成配置。具体的，devtool选项有多种不同取值，且不同取值可分别生成不同类型的Source Map文件，可以根据实际需要进行配置。可预先从devtool选项的所有不同取值中进行筛选得到常用的候选文件生成配置，该候选文件生成配置例如可包括：cheap-source-map、inline-source-map、hidden-source-map、eval-source-map、cheap-module-source-map、nosources-source-map、source-map。

获取与各所述候选文件生成配置分别对应的功能描述信息。

在本实施例中，可通过查询与devtool选项的生成配置相关的功能描述资料来提取出与各所述候选文件生成配置分别对应的功能描述信息。具体的，功能描述信息可包括：cheap-source-map：外部。可以查看错误代码准确信息和源代码的错误位置，只能把错误精确到整行，忽略列。inline-source-map：内联。只生成一个内联Source Map，可以查看错误代码准确信息和源代码的错误位置hidden-source-map：外部。可以查看错误代码准确信息，但不能追踪源代码错误，只能提示到构建后代码的错误位置。eval-source-map：内联。每一个文件都生成对应的Source Map，都在eval中，可以查看错误代码准确信息和源代码的错误位置。cheap-module-source-map：外部。可以错误代码准确信息和源代码的错误位置，module会加入loader的Source Map。nosources-source-map：外部。可以查看错误代码错误原因，但不能查看错误代码准确信息，并且没有任何源代码信息。source-map：外部。可以查看错误代码准确信息和源代码的错误位置。另外，内联和外部的区别为：外部生成了文件，内联没有，但内联构建速度更快。

展示各所述候选文件生成配置，以及展示与各所述候选文件生成配置分别对应的功能描述信息。

在本实施例中，可将候选文件生成配置以及功能描述信息一一对应的展示在当前的显示界面。

接收第二目标用户从所有所述候选文件生成配置中选择的目标候选文件生成配置。

在本实施例中，可以同时展示一条配置选择信息，以提醒用户根据实际的业务使用需求从多个候选文件生成配置中选择出一个候选文件生成配置作为用于生成目标项目的信息文件的文件生成配置。另外，如果检测到用户没有进行选择，则直接使用默认的文件生成配置作为目标候选文件生成配置。举例地，所述默认的文件生成配置可为hgifdden-source-map，hidden-source-map能够生成完整独立的source map文件且不会泄露sourceMappingURL。或者，所述默认的文件生成配置可为eval-source-map，eval-source-map具有错误提示完整度高，且内联速度快的优点。

在所述目标项目的配置文件中的指定选项内填充所述目标候选文件生成配置。

在本实施例中，所述指定选项为devtool，通过在Webpack的配置文件webpack.config.js中设置devtool的取值为目标候选文件生成配置，即可在目标项目打包完成后自动生成与目标候选文件生成配置相应的Source Map文件。

本申请通过预先从所有文件生成配置中多个候选文件生成配置，然后向相关用户展示候选文件生成配置以及与各所述候选文件生成配置分别对应的功能描述信息，以便相关用户能够根据实际需求选取出目标候选文件生成配置，进而可以根据该目标候选文件生成配置来配置生成目标项目的Source Map文件，有效地提高了目标项目的Source Map文件的生成智能性，提高了用户的使用体验。

在本实施例的一些可选的实现方式中，在步骤S205之后，上述电子设备还可以执行以下步骤：

获取预设的信息输出模板。

在本实施例中，信息输出模板为将与报错信息相对应的错误定位信息进行可视化展示的模板。该信息模版可以基于实际的使用需求进行设置生成，在此不作过多阐述。

将所述错误定位信息输入至所述信息输出模板内，生成与所述错误定位信息对应的报错报告。

在本实施例中，信息输出模版内可预先设置有与错误定位信息一一对应的填充位置，通过将错误定位信息输入至信息输出模版内相对应的填充位置处，以生成与所述错误定位信息对应的报错报告。

展示所述报错报告。

在本实施例中，展示错误报告是指将错误报告展示在当前的显示界面上。

本申请在生成了错误定位信息后，会智能地将所述错误定位信息输入至所述信息输出模板内，生成与所述错误定位信息对应的报错报告并进行展示，使得相关用户能够基于该报错报告及时清楚地了解到目标页面当前出现的错误定位信息，提高了用户的使用体验。

需要强调的是，为进一步保证上述错误定位信息的私密和安全性，上述错误定位信息还可以存储于一区块链的节点中。

本申请所指区块链是分布式数据存储、点对点传输、共识机制、加密算法等计算机技术的新型应用模式。区块链(Blockchain)，本质上是一个去中心化的数据库，是一串使用密码学方法相关联产生的数据块，每一个数据块中包含了一批次网络交易的信息，用于验证其信息的有效性(防伪)和生成下一个区块。区块链可以包括区块链底层平台、平台产品服务层以及应用服务层等。

本申请实施例可以基于人工智能技术对相关的数据进行获取和处理。其中，人工智能(Artificial Intelligence，AI)是利用数字计算机或者数字计算机控制的机器模拟、延伸和扩展人的智能，感知环境、获取知识并使用知识获得最佳结果的理论、方法、技术及应用系统。

人工智能基础技术一般包括如传感器、专用人工智能芯片、云计算、分布式存储、大数据处理技术、操作/交互系统、机电一体化等技术。人工智能软件技术主要包括计算机视觉技术、机器人技术、生物识别技术、语音处理技术、自然语言处理技术以及机器学习/深度学习等几大方向。

本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程，是可以通过计算机可读指令来指令相关的硬件来完成，该计算机可读指令可存储于一计算机可读取存储介质中，该程序在执行时，可包括如上述各方法的实施例的流程。其中，前述的存储介质可为磁碟、光盘、只读存储记忆体(Read-Only Memory，ROM)等非易失性存储介质，或随机存储记忆体(Random Access Memory，RAM)等。

应该理解的是，虽然附图的流程图中的各个步骤按照箭头的指示依次显示，但是这些步骤并不是必然按照箭头指示的顺序依次执行。除非本文中有明确的说明，这些步骤的执行并没有严格的顺序限制，其可以以其他的顺序执行。而且，附图的流程图中的至少一部分步骤可以包括多个子步骤或者多个阶段，这些子步骤或者阶段并不必然是在同一时刻执行完成，而是可以在不同的时刻执行，其执行顺序也不必然是依次进行，而是可以与其他步骤或者其他步骤的子步骤或者阶段的至少一部分轮流或者交替地执行。

进一步参考图3，作为对上述图2所示方法的实现，本申请提供了一种报错信息的处理装置的一个实施例，该装置实施例与图2所示的方法实施例相对应，该装置具体可以应用于各种电子设备中。

如图3所示，本实施例所述的报错信息的处理装置300包括：监听模块301、收集模块302、第一获取模块303、第二获取模块304以及确定模块305。其中：

监听模块301用于在目标页面运行过程中，基于预设的错误收集脚本监听错误事件的触发情况；

收集模块302用于在监听到所述错误事件被触发后，收集与所述错误事件对应的报错信息；

第一获取模块303用于获取与所述目标页面的页面代码文件对应的目标项目的项目信息；

第二获取模块304用于基于预设的文件管理中心获取与所述项目信息对应的目标信息文件；

确定模块305用于基于所述报错信息与所述目标信息文件，确定所述报错信息在相应的源文件中的错误定位信息。

在本实施例中，上述模块或单元分别用于执行的操作与前述实施方式的报错信息的处理方法的步骤一一对应，在此不再赘述。

在本实施例的一些可选的实现方式中，报错信息的处理装置还包括集成模块，用于在所述目标项目的打包过程中集成预设的文件上传插件。第三获取模块，用于基于所述文件上传插件获取所述目标项目打包完成后生成的信息文件。上传模块，用于调用所述文件管理中心的上传接口将所述信息文件上传至所述文件管理中心内。

在本实施例中，上述模块或单元分别用于执行的操作与前述实施方式的报错信息的处理方法的步骤一一对应，在此不再赘述。

在本实施例的一些可选的实现方式中,所述项目信息包括第一项目名称与项目版本号，第二获取模块304包括判断子模块、确定子模块以及第一获取子模块。其中，判断子模块用于基于所述第一项目名称与所述项目版本号对所述文件管理中心进行文件查询处理，判断所述文件管理中心内是否存储有与所述第一项目名称及所述项目版本号均匹配的第一信息文件。确定子模块用于若存储有所述第一信息文件，将所述第一信息文件作为所述目标信息文件。第一获取子模块用于获取所述目标信息文件。

本实施例中，上述模块或单元分别用于执行的操作与前述实施方式的报错信息的处理方法的步骤一一对应，在此不再赘述。

在本实施例的一些可选的实现方式中，所述项目信息包括第二项目名称，第二获取模块304包括查询子模块、展示子模块、接收子模块以及第二获取子模块。其中，查询子模块用于基于所述第二项目名称对所述文件管理中心进行文件查询处理，从所述文件管理中心中查询出与所述第二项目名称匹配的所有第二信息文件。展示子模块用于展示所述文件管理中心内存储的所有所述第二信息文件。接收子模块用于接收第一目标用户从所有所述第二信息文件中选择的第三信息文件。第二获取子模块用于将所述第三信息文件作为所述目标信息文件，并获取所述目标信息文件。

在本实施例中，上述模块或单元分别用于执行的操作与前述实施方式的报错信息的处理方法的步骤一一对应，在此不再赘述。

在本实施例的一些可选的实现方式中，确定模块305包括解析子模块、调用子模块以及处理子模块。解析子模块用于对所述报错信息进行解析处理得到对应的错误堆栈信息。调用子模块用于调用预设的信息库。处理子模块用于基于所述信息库对所述错误堆栈信息与所述目标信息文件进行错误定位处理，得到所述报错信息在相应的源文件中的错误定位信息。

在本实施例中，上述模块或单元分别用于执行的操作与前述实施方式的报错信息的处理方法的步骤一一对应，在此不再赘述。

在本实施例的一些可选的实现方式中，报错信息的处理装置还包括筛选模块，用于从预设的所有文件生成配置中筛选出与生成所述目标项目的信息文件对应的多个候选文件生成配置。第四获取模块，用于获取与各所述候选文件生成配置分别对应的功能描述信息。第一展示模块，用于展示各所述候选文件生成配置，以及展示与各所述候选文件生成配置分别对应的功能描述信息。接收模块，用于接收第二目标用户从所有所述候选文件生成配置中选择的目标候选文件生成配置。填充模块，用于在所述目标项目的配置文件中的指定选项内填充所述目标候选文件生成配置。

在本实施例中，上述模块或单元分别用于执行的操作与前述实施方式的报错信息的处理方法的步骤一一对应，在此不再赘述。

在本实施例的一些可选的实现方式中，报错信息的处理装置还包括第五获取模块，用于获取预设的信息输出模板。生成模块，用于将所述错误定位信息输入至所述信息输出模板内，生成与所述错误定位信息对应的报错报告。第二展示模块，用于展示所述报错报告。

在本实施例中，上述模块或单元分别用于执行的操作与前述实施方式的报错信息的处理方法的步骤一一对应，在此不再赘述。

为解决上述技术问题，本申请实施例还提供计算机设备。具体请参阅图4，图4为本实施例计算机设备基本结构框图。

所述计算机设备4包括通过系统总线相互通信连接存储器41、处理器42、网络接口43。需要指出的是，图中仅示出了具有组件41-43的计算机设备4，但是应理解的是，并不要求实施所有示出的组件，可以替代的实施更多或者更少的组件。其中，本技术领域技术人员可以理解，这里的计算机设备是一种能够按照事先设定或存储的指令，自动进行数值计算和/或信息处理的设备，其硬件包括但不限于微处理器、专用集成电路(ApplicationSpecific Integrated Circuit，ASIC)、可编程门阵列(Field－Programmable GateArray，FPGA)、数字处理器(Digital Signal Processor，DSP)、嵌入式设备等。

所述计算机设备可以是桌上型计算机、笔记本、掌上电脑及云端服务器等计算设备。所述计算机设备可以与用户通过键盘、鼠标、遥控器、触摸板或声控设备等方式进行人机交互。

所述存储器41至少包括一种类型的可读存储介质，所述可读存储介质包括闪存、硬盘、多媒体卡、卡型存储器(例如，SD或DX存储器等)、随机访问存储器(RAM)、静态随机访问存储器(SRAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、可编程只读存储器(PROM)、磁性存储器、磁盘、光盘等。在一些实施例中，所述存储器41可以是所述计算机设备4的内部存储单元，例如该计算机设备4的硬盘或内存。在另一些实施例中，所述存储器41也可以是所述计算机设备4的外部存储设备，例如该计算机设备4上配备的插接式硬盘，智能存储卡(Smart Media Card,SMC)，安全数字(Secure Digital,SD)卡，闪存卡(FlashCard)等。当然，所述存储器41还可以既包括所述计算机设备4的内部存储单元也包括其外部存储设备。本实施例中，所述存储器41通常用于存储安装于所述计算机设备4的操作系统和各类应用软件，例如报错信息的处理方法的计算机可读指令等。此外，所述存储器41还可以用于暂时地存储已经输出或者将要输出的各类数据。

所述处理器42在一些实施例中可以是中央处理器(Central Processing Unit，CPU)、控制器、微控制器、微处理器、或其他数据处理芯片。该处理器42通常用于控制所述计算机设备4的总体操作。本实施例中，所述处理器42用于运行所述存储器41中存储的计算机可读指令或者处理数据，例如运行所述报错信息的处理方法的计算机可读指令。

所述网络接口43可包括无线网络接口或有线网络接口，该网络接口43通常用于在所述计算机设备4与其他电子设备之间建立通信连接。

与现有技术相比，本申请实施例主要有以下有益效果：

本申请实施例中，在监听到目标页面在运行过程中触发的错误事件后，会自动收集错误事件对应的报错信息，并获取与目标页面对应的目标项目的项目信息，之后基于预设的文件管理中心快速获取与项目信息对应的目标信息文件，进而基于得到的报错信息与目标信息文件，自动确定出报错信息在相应的源文件中的错误定位信息，实现了对前端项目在发生异常时的快速定位，有效地提高了错误定位处理的处理效率，提高了用户的使用体验。

本申请还提供了另一种实施方式，即提供一种计算机可读存储介质，所述计算机可读存储介质存储有计算机可读指令，所述计算机可读指令可被至少一个处理器执行，以使所述至少一个处理器执行如上述的报错信息的处理方法的步骤。

与现有技术相比，本申请实施例主要有以下有益效果：

本申请实施例中，在监听到目标页面在运行过程中触发的错误事件后，会自动收集错误事件对应的报错信息，并获取与目标页面对应的目标项目的项目信息，之后基于预设的文件管理中心快速获取与项目信息对应的目标信息文件，进而基于得到的报错信息与目标信息文件，自动确定出报错信息在相应的源文件中的错误定位信息，实现了对前端项目在发生异常时的快速定位，有效地提高了错误定位处理的处理效率，提高了用户的使用体验。

通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现，当然也可以通过硬件，但很多情况下前者是更佳的实施方式。基于这样的理解，本申请的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质(如ROM/RAM、磁碟、光盘)中，包括若干指令用以使得一台终端设备(可以是手机，计算机，服务器，空调器，或者网络设备等)执行本申请各个实施例所述的方法。

显然，以上所描述的实施例仅仅是本申请一部分实施例，而不是全部的实施例，附图中给出了本申请的较佳实施例，但并不限制本申请的专利范围。本申请可以以许多不同的形式来实现，相反地，提供这些实施例的目的是使对本申请的公开内容的理解更加透彻全面。尽管参照前述实施例对本申请进行了详细的说明，对于本领域的技术人员来而言，其依然可以对前述各具体实施方式所记载的技术方案进行修改，或者对其中部分技术特征进行等效替换。凡是利用本申请说明书及附图内容所做的等效结构，直接或间接运用在其他相关的技术领域，均同理在本申请专利保护范围之内。

Claims (10)

1.一种报错信息的处理方法，其特征在于，包括下述步骤：

在目标页面运行过程中，基于预设的错误收集脚本监听错误事件的触发情况；

在监听到所述错误事件被触发后，收集与所述错误事件对应的报错信息；

获取与所述目标页面的页面代码文件对应的目标项目的项目信息；

基于预设的文件管理中心获取与所述项目信息对应的目标信息文件；

基于所述报错信息与所述目标信息文件，确定所述报错信息在相应的源文件中的错误定位信息。

2.根据权利要求1所述的报错信息的处理方法，其特征在于，在所述基于预设的文件管理中心获取与所述项目信息对应的目标信息文件的步骤之前，还包括：

在所述目标项目的打包过程中集成预设的文件上传插件；

基于所述文件上传插件获取所述目标项目打包完成后生成的信息文件；

调用所述文件管理中心的上传接口将所述信息文件上传至所述文件管理中心内。

3.根据权利要求1所述的报错信息的处理方法，其特征在于，所述项目信息包括第一项目名称与项目版本号，所述基于预设的文件管理中心获取与所述项目信息对应的目标信息文件的步骤，具体包括：

基于所述第一项目名称与所述项目版本号对所述文件管理中心进行文件查询处理，判断所述文件管理中心内是否存储有与所述第一项目名称及所述项目版本号均匹配的第一信息文件；

若存储有所述第一信息文件，将所述第一信息文件作为所述目标信息文件；

获取所述目标信息文件。

4.根据权利要求1所述的报错信息的处理方法，其特征在于，所述项目信息包括第二项目名称，所述基于预设的文件管理中心获取与所述项目信息对应的目标信息文件的步骤，具体包括：

基于所述第二项目名称对所述文件管理中心进行文件查询处理，从所述文件管理中心中查询出与所述第二项目名称匹配的所有第二信息文件；

展示所述文件管理中心内存储的所有所述第二信息文件；

接收第一目标用户从所有所述第二信息文件中选择的第三信息文件；

将所述第三信息文件作为所述目标信息文件，并获取所述目标信息文件。

5.根据权利要求1所述的报错信息的处理方法，其特征在于，所述基于所述报错信息与所述目标信息文件，确定所述报错信息在相应的源文件中的错误定位信息的步骤，具体包括：

对所述报错信息进行解析处理得到对应的错误堆栈信息；

调用预设的信息库；

基于所述信息库对所述错误堆栈信息与所述目标信息文件进行错误定位处理，得到所述报错信息在相应的源文件中的错误定位信息。

6.根据权利要求1所述的报错信息的处理方法，其特征在于，在所述在目标页面运行过程中，基于预设的错误收集脚本监听错误事件的触发情况的步骤之前，还包括：

从预设的所有文件生成配置中筛选出与生成所述目标项目的信息文件对应的多个候选文件生成配置；

获取与各所述候选文件生成配置分别对应的功能描述信息；

展示各所述候选文件生成配置，以及展示与各所述候选文件生成配置分别对应的功能描述信息；

接收第二目标用户从所有所述候选文件生成配置中选择的目标候选文件生成配置；

在所述目标项目的配置文件中的指定选项内填充所述目标候选文件生成配置。

7.根据权利要求1所述的报错信息的处理方法，其特征在于，在所述基于所述报错信息与所述目标信息文件，确定所述报错信息在相应的源文件中的错误定位信息的步骤之后，还包括：

获取预设的信息输出模板；

将所述错误定位信息输入至所述信息输出模板内，生成与所述错误定位信息对应的报错报告；

展示所述报错报告。

8.一种报错信息的处理装置，其特征在于，包括：

监听模块，用于在目标页面运行过程中，基于预设的错误收集脚本监听错误事件的触发情况；

收集模块，用于在监听到所述错误事件被触发后，收集与所述错误事件对应的报错信息；

第一获取模块，用于获取与所述目标页面的页面代码文件对应的目标项目的项目信息；

第二获取模块，用于基于预设的文件管理中心获取与所述项目信息对应的目标信息文件；

确定模块，用于基于所述报错信息与所述目标信息文件，确定所述报错信息在相应的源文件中的错误定位信息。

9.一种计算机设备，包括存储器和处理器，所述存储器中存储有计算机可读指令，所述处理器执行所述计算机可读指令时实现如权利要求1至7中任一项所述的报错信息的处理方法的步骤。

10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质上存储有计算机可读指令，所述计算机可读指令被处理器执行时实现如权利要求1至7中任一项所述的报错信息的处理方法的步骤。

Images