CN107967209A - 一种检测前端网页代码中错误的方法、检测设备及服务器 - Google Patents
一种检测前端网页代码中错误的方法、检测设备及服务器 Download PDFInfo
- Publication number
- CN107967209A CN107967209A CN201710930123.9A CN201710930123A CN107967209A CN 107967209 A CN107967209 A CN 107967209A CN 201710930123 A CN201710930123 A CN 201710930123A CN 107967209 A CN107967209 A CN 107967209A
- Authority
- CN
- China
- Prior art keywords
- interactive operation
- server
- record
- interaction
- web page
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Granted
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F11/00—Error detection; Error correction; Monitoring
- G06F11/36—Preventing errors by testing or debugging software
- G06F11/3668—Software testing
- G06F11/3696—Methods or tools to render software testable
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F11/00—Error detection; Error correction; Monitoring
- G06F11/36—Preventing errors by testing or debugging software
- G06F11/362—Software debugging
- G06F11/366—Software debugging using diagnostics
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Computer Hardware Design (AREA)
- Quality & Reliability (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Information Transfer Between Computers (AREA)
- Debugging And Monitoring (AREA)
Abstract
本发明实施例公开了一种检测前端网页代码中错误的方法、检测设备及服务器，包括：若确定用户设备中打开的网页完成页面加载渲染，则对用户设备展示的网页进行截图，并采集网页代码的运行环境信息后，将截图和运行环境信息一起上报给服务器。可见，采用本发明实施例提供的方法，由于截图可以更直观的展示网页在页面加载渲染中出现的异常，服务器根据该截图和网页代码的运行环境信息来共同分析网页代码，可使得开发人员了解问题发生的场景，从而准确定位网页代码中存在的错误，提高前端开发的测试效率。
Description
技术领域
本发明涉及计算机互联网技术领域，尤其涉及一种检测前端网页代码中错误的方法、检测设备及服务器。
背景技术
前端开发的代码运行环境比较复杂，不同的操作系统、不同的设备、不同的浏览器、不同的网络环境，对最终的运行效果都有影响。而仅靠测试、代码检查、以及用户反馈等手段很难全面的发现问题。
现有技术中，常用的错误报告解决方法包括try…catch捕获、window.onerror等方式。try…catch捕获是指将待检测的代码包含在try模块中，然后在catch模块中进行错误日志的收集，虽然使用try…catch可以获知错误的类型和位置等出错信息，但是try…catch会改变代码的运行环境，开发人员并不提倡使用这种代码编写方式。window.oneerror是指通过监听全局的onerror 事件来进行错误日志的收集，但是由于收集的错误日志中只显示代码在运行过程中发生了错误，但是没有具体的报错信息，根据这个错误日志相关技术人员无法定位错误的具体位置，更无从分析错误产生的原因。此外，即使通过其他方式获取到了包括发生时间、具体位置和错误类型等信息的错误日志，在前端开发领域中，由于相关技术人员无法得知错误发生的具体场景，仅根据该错误日志中的信息仍然很难找出如页面加载渲染、交互操作等前端开发代码中错误的产生原因，因此，给前端开发代码的开发和测试工作带来了很大困难。
综上所述，目前亟需要一种检测前端网页代码中错误的方法，用以提高检测前端开发代码中错误的效率。
发明内容
本发明提供一种检测前端网页代码中错误的方法，用以提高检测前端开发代码中错误的效率。
本发明实施例提供的一种检测前端网页代码中错误的方法，包括：
若确定用户设备中打开的网页完成页面加载渲染，则对所述用户设备展示的网页进行截图，并采集网页代码的运行环境信息；
将所述截图和所述运行环境信息上报给服务器，以使所述服务器根据所述截图和所述运行环境信息分析所述网页代码中用于实现页面加载渲染的代码中存在的错误。
可选地，在将所述截图和所述运行环境信息上报给服务器之前，还包括：
在接收到用户允许将所述截图和所述运行环境信息上报的确认消息后，将所述截图和所述运行环境信息上报给服务器。
可选地，在所述用户设备中打开的网页完成页面加载渲染之后，还包括：
处理用户发起的各个交互操作，针对所述各个交互操作中的任一交互操作，生成所述交互操作的交互记录并发送给所述服务器，以使所述服务器根据所述交互操作的交互记录分析所述页面代码中用于实现所述交互操作的部分存在的错误；其中，所述交互操作的交互记录包括交互开始记录，所述交互开始记录是在所述交互操作的处理逻辑开始时生成的，所述交互开始记录中包括所述网页代码的运行环境信息和所述交互操作的预期效果，在所述交互操作的处理逻辑正常结束的情况下，所述交互记录中还包括交互结束记录。
可选地，针对所述各个交互操作中的任一交互操作，生成所述交互操作的交互记录并发送给所述服务器，包括：
在所述交互操作的处理逻辑开始时，生成所述交互操作的交互开始记录，并发送给服务器；
在所述交互操作的处理逻辑正常结束时，生成所述交互操作的交互结束记录，并发送给服务器。
可选地，所述运行环境信息至少包括如下的一项或多项：
所述用户设备的操作系统、所述用户设备访问的网页链接、所述网页的加载耗时、所述用户设备访问所述网页使用的浏览设备。
本发明实施例提供的另一种检测前端网页代码中错误的方法，包括：
服务器接收用户设备发送的各个交互操作的交互记录；其中，任一交互操作的交互记录中包括交互开始记录，所述交互开始记录是在所述任一交互操作的处理逻辑开始时生成的，所述交互开始记录中包括所述任一交互操作的运行环境信息和预期效果；在所述任一交互操作的处理逻辑正常结束的情况下，所述任一交互操作的交互记录中还包括交互结束记录；
所述服务器对所述各个交互操作的交互记录进行遍历，筛选出所述各个交互操作中交互记录仅包括交互开始记录，但不包括交互结束记录的标志交互操作，并根据所述标志交互操作的交互记录分析所述网页代码中用于实现所述标志交互操作的预期效果的代码中存在的错误。
可选地，所述服务器根据所述标志交互操作的交互记录分析所述网页代码中用于实现所述标志交互操作的预期效果的代码中存在的错误之前，还包括：
所述服务器确定所述标志交互操作中具有同一预期效果的交互操作的数量大于设定阈值。
基于同样的发明构思，本发明实施例提供的一种检测设备，包括：
处理模块，用于若确定用户设备中打开的网页完成页面加载渲染，则对所述用户设备展示的网页进行截图，并采集网页代码的运行环境信息；
收发模块，用于将所述截图和所述运行环境信息上报给服务器，以使所述服务器根据所述截图和所述运行环境信息分析所述网页代码中用于实现页面加载渲染的代码中存在的错误。
可选地，所述处理模块还用于：在接收到用户允许将所述截图和所述运行环境信息上报的确认消息后，将所述截图和所述运行环境信息上报给服务器。
可选地，所述处理模块还用于：
处理用户发起的各个交互操作，针对所述各个交互操作中的任一交互操作，生成所述交互操作的交互记录并发送给所述服务器，以使所述服务器根据所述交互操作的交互记录分析所述页面代码中用于实现所述交互操作的部分存在的错误；其中，所述交互操作的交互记录包括交互开始记录，所述交互开始记录是在所述交互操作的处理逻辑开始时生成的，所述交互开始记录中包括所述网页代码的运行环境信息和所述交互操作的预期效果，在所述交互操作的处理逻辑正常结束的情况下，所述交互记录中还包括交互结束记录。
可选地，所述处理模块具体用于：
在所述交互操作的处理逻辑开始时，生成所述交互操作的交互开始记录，并发送给服务器；
在所述交互操作的处理逻辑正常结束时，生成所述交互操作的交互结束记录，并发送给服务器。
可选地，所述运行环境信息至少包括如下的一项或多项：
所述用户设备的操作系统、所述用户设备访问的网页链接、所述网页的加载耗时、所述用户设备访问所述网页使用的浏览设备。
基于同样的发明构思，本发明实施例还提供一种服务器，包括：
收发模块，用于接收用户设备发送的各个交互操作的交互记录；其中，任一交互操作的交互记录中包括交互开始记录，所述交互开始记录是在所述任一交互操作的处理逻辑开始时生成的，所述交互开始记录中包括所述任一交互操作的运行环境信息和预期效果；在所述任一交互操作的处理逻辑正常结束的情况下，所述任一交互操作的交互记录中还包括交互结束记录；
处理模块，用于对所述各个交互操作的交互记录进行遍历，筛选出所述各个交互操作中交互记录仅包括交互开始记录，但不包括交互结束记录的标志交互操作，并根据所述标志交互操作的交互记录分析所述网页代码中用于实现所述标志交互操作的预期效果的代码中存在的错误。
可选地，所述处理模块还用于：
确定所述标志交互操作中具有同一预期效果的交互操作的数量大于设定阈值。
本发明另一实施例提供了一种检测设备，其包括存储器和处理器，其中，所述存储器用于存储程序指令，所述处理器用于调用所述存储器中存储的程序指令，按照获得的程序执行上述任一种方法。
本发明另一实施例提供了一种计算机存储介质，所述计算机可读存储介质存储有计算机可执行指令，所述计算机可执行指令用于使所述计算机执行上述任一种方法。
本发明实施例中，若确定用户设备中打开的网页完成页面加载渲染，则对用户设备展示的网页进行截图，并采集网页代码的运行环境信息后，将截图和运行环境信息一起上报给服务器。可见，采用本发明实施例提供的方法，由于截图可以更直观的展示网页在页面加载渲染中出现的异常，服务器根据该截图和网页代码的运行环境信息来共同分析网页代码，可使得开发人员了解问题发生的场景，从而准确定位网页代码中存在的错误，提高前端开发的测试效率。
附图说明
为了更清楚地说明本发明实施例中的技术方案，下面将对实施例描述中所需要使用的附图作简要介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域的普通技术人员来讲，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。
图1为本发明实施例提供的一种检测前端网页中错误的方法所对应的流程示意图；
图2为本发明实施例提供的一种检测设备的结构示意图；
图3为本发明实施例提供的一种服务器的结构示意图。
具体实施方式
为了使本发明的目的、技术方案和优点更加清楚，下面将结合附图对本发明作进一步地详细描述，显然，所描述的实施例，仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其它实施例，都属于本发明保护的范围。
本发明实施例中提供的一种检测前端网页代码中错误的方法，适用于前端。所谓前端与后端的服务器相对应，是指网站的前台部分，用于向用户展示、加载网页，接收和处理用户与网页之间的交互等。用户可以使用如台式计算机、笔记本电脑、平板电脑、智能手机等各种类型的用户设备访问前端，具体的，前端的开发代码可运行在用户设备的浏览器或用户设备的应用程序中内置的浏览器中。
下面结合说明书附图对本发明实施例做进一步详细描述。
图1示出了本发明实施例中提供的一种检测前端网页代码中错误的方法所对应的流程示意图，如图1所示，所述方法包括：
步骤S101：若确定用户设备中打开的网页完成页面加载渲染，则对所述用户设备展示的网页进行截图，并采集网页代码的运行环境信息；
步骤S102：将所述截图和所述运行环境信息上报给服务器，以使所述服务器根据所述截图和所述运行环境信息分析所述网页代码中用于实现页面加载渲染的代码中存在的错误。
可见，采用本发明实施例提供的方法，由于截图可以更直观的展示网页在页面加载渲染中出现的异常，服务器根据该截图和网页代码的运行环境信息来共同分析网页代码，可使得开发人员更容易分析网页代码中存在的错误，从而提高前端开发的测试效率。
具体来说，在步骤S101中，可以在用户设备在打开网页的过程中，监听 load事件，若确定load事件被触发，则确定所述用户设备完成页面加载渲染。在用户设备完成页面加载渲染后，对用户设备上展示的网页进行截图。
本发明实施例中，可以通过采用前端截图技术进行截图，同时根据待测试的前端网页所属的业务系统的不同，本领域技术人员还可进一步根据地域、用户设备所适用的操作系统、用户设备的型号信息等进行采样截图。需要说明的是，进行采样截图的网页具体是指不涉及用户隐私的网页页面。
在对用户设备上展示的网页进行截图之后，前端还可采集网页代码的运行环境信息。其中，运行环境信息包括：用户设备的操作系统、用户设备访问的网页链接、网页的加载耗时、用户设备访问网页使用的浏览设备(如浏览器或 webview)等。
在步骤S102中，将截图和采集到的运行环境信息上报给服务器，以使服务器根据截图和运行环境信息分析网页代码中用于实现页面加载渲染的代码中存在的错误。
需要说明的是，本发明实施例中根据采样精度设置的不同，服务器根据接收到的截图数量可能有较大的区别。若服务器接收到的截图的数量较多，可以采用图像检测、图像识别等技术来区分接收到的截图中存在页面加载渲染异常的截图，进而再由开发人员进行测试、排错等后续工作。若服务器接收到的截图的数量较少，也可直接由开发人员人工辨别其中存在页面加载渲染异常的截图，再进行测试、排错等工作。
本发明实施例中提供的方法，尤其适合企业上线新业务的场景下，在这种场景下，新开发的网页虽然经过了内测，但是仍有可能出现很多在开发过程中意想不到的错误，因此，在企业上线新业务后的前期阶段，可以在前端直接对用户页面渲染完成后的网页进行截图，然后发送给服务器。
在新业务上线后，开发人员会对前端开发代码进行不断地测试、排错和调整等工作，因而前端开发代码中存在的错误将会逐渐变少，在新业务上线的后期阶段，可由用户在判断页面加载渲染出错后，通过页面上设置的具有错误报告上传功能的按钮，主动上传出现错误的截图，以便测试人员改正前端开发代码中的错误。
具体的，当用户点击页面上设置的具有错误报告上传功能的按钮后，该按钮会展示出提示框，提示用户是否确定将出现页面加载渲染异常的网页截图和用户设备的运行环境信息上传，若用户点击确认，则前端会收到确认消息，并将截图和采集的运行环境信息上报给服务器。
本发明实施中提供的检测方法，不仅可以检测前端代码中页面加载渲染过程中的错误，还可检测前端与用户的交互过程中的错误。
具体的，当前端完成页面加载渲染后，用户会对页面进行一些如点击链接、向上或向下滑动页面、放大或缩小页面中的图片等各种类型的交互操作。因而，前端在接收到用户发起的交互操作后，处理各个交互操作。
针对其中的任一交互操作，前端除了对该交互操作按照该交互操作的处理逻辑进行响应之外，还会在该交互操作的处理逻辑开始时，生成该交互操作的交互开始记录，并且在该交互操作处理逻辑正常结束的时，生成该交互操作的交互结束记录。其中，交互开始记录中包括该交互操作的交互编号、预期效果，以及用户设备的操作系统、访问网页使用的浏览设备、访问的网页链接、网页的加载耗时等运行环境信息。交互结束记录中包括该交互操作的交互编号、该交互操作已完成的标识，以及该交互操作的完成时间。
本发明实施例中，交互编号用于唯一地标识某一个交互操作，任意两个交互操作都具有互不相同的交互编号。预期效果是指这一交互操作后所要实现的功能或交互效果。举例来说，若页面中设置有两个按钮：分别是按钮A和按钮 B，其中，按钮A的作用是链接到的另一个页面，按钮B的作用是展示一个提示框。那么，点击一次按钮A或点击一次按钮B都是一个交互操作，但是按钮A和按钮B由于设计的功能不同，所以具有不同的预期效果，其中，按钮A 的预期效果是链接到的另一个页面，按钮B的预期效果是展示一个提示框。需要说明的是，虽然点击两次按钮A都会实现同一个预期效果，但是点击两次按钮A属于不同的交互操作，因而具有不同的交互编号。
可以看出，前端一旦开始响应某一交互操作，就会为该交互操作生成交互开始记录。但是前端在响应交互操作的过程中可能会出现错误，使得该交互操作的处理逻辑不能正常结束，无法达到该交互操作的预期效果。由于前端只会在交互操作的处理逻辑正常结束的时候，才生成该交互操作的交互结束记录，那么若该交互操作出现了错误，前端就无法生成该交互操作的交互记录。
也就是说，在正常的情况下，一个交互操作的交互记录中会包括交互开始记录和交互结束记录，而在交互操作出现错误的情况下，交互操作的交互记录中仅存在交互开始记录，不存在交互结束记录。
本发明实施例中，前端会将各个交互操作的交互记录发送给服务器，以便服务器根据接收到的交互记录分析前端的页面代码中存在的错误。作为一种优选的实现方式，本发明实施例中，前端将在生成某一交互操作的交互开始记录后，立即将该交互开始记录发送给服务器，在生成某一交互操作的交互结束记录后，立即将该交互结束记录发送给服务器。
如此，服务器在接收到前端发送的各个交互操作的交互记录后，对各个交互操作的交互记录进行遍历，从中筛选出仅有交互开始记录，但没有交互结束记录的交互操作的交互记录进行问题分析，定位问题。本发明实施例中，将这种交互记录中仅包括交互开始记录，但不包括交互结束记录的交互操作称作标记交互操作，服务器实际上是根据这些标记交互操作的交互开始记录，进行分析，对前端开发代码进行测试和排错。
具体的，服务器对交互记录进行分析可具有两种可能的实现方式：
实现方式一：服务器若确定某一交互操作为标记交互操作，即该交互操作在响应时出现了错误，那么可直接确定网页中用于实现该交互操作的预期效果的代码存在着错误。
实现方式二：服务器若确定筛选出的标记交互操作中，具有某一预期效果的交互操作的数量大于设定阈值时，才确定实现该预期效果的代码中存在着错误。也就是说，在这种情况下，不认为某一交互操作不存在交互结束记录就一定是实现该交互操作的预期效果的代码中存在着错误，而是只有在实现该预期效果的交互操作中不存在交互结束记录的交互操作的数量较多时，才认为网页中实现该预期效果的代码中存在着错误。
本发明实施例中，本领域技术人员可根据实际需要对设定阈值进行具体的设置，本发明对此不做具体限制。
此外，服务器可通过设置定时函数的方式按照设定的周期对接收到的交互记录进行遍历。根据实际情况的不同，本领域技术人员可以将遍历的周期设置为一天一次，也可以设置为1小时一次，或者10分钟一次等等，一般情况下，前端处理的交互操作的数量越多，服务器中的遍历周期设置的越短，本发明对此不做具体限制。
若一个交互操作的交互记录中既存在交互开始记录也存在交互结束记录，则说明前端在响应该交互操作时没有出现问题，那么，为了减轻服务器存储海量交互记录时的负担，本发明实施例中，服务器还可以在遍历交互记录的过程中，若确定某一交互操作存在交互结束记录，则直接将该交互操作的交互记录删除，或者服务器也可以在遍历结束，从存储的交互记录中筛选出所有的标记交互操作的交互记录后，将其他交互操作的交互记录一起删除，本发明对此不做限制。
可见，由于标记交互操作的交互开始记录中包括了该标记交互操作的预期效果，以及用户设备的操作系统、访问网页使用的浏览设备、访问的网页链接、网页的加载耗时等运行环境信息，因此服务器根据标记交互操作的交互开始记录，可以直观地了解该交互操作出现问题时的场景，以便准确地定位该交互操作的处理逻辑中的错误。
基于同样的发明构思，本发明实施例还提供一种检测设备，图2为本发明实施例中提供的一种检测设备的结构示意图，如图2所示，该检测设备200包括：
处理模块201，用于若确定用户设备中打开的网页完成页面加载渲染，则对所述用户设备展示的网页进行截图，并采集网页代码的运行环境信息；
收发模块202，用于将所述截图和所述运行环境信息上报给服务器，以使所述服务器根据所述截图和所述运行环境信息分析所述网页代码中用于实现页面加载渲染的代码中存在的错误。
可选地，所述处理模块201还用于：在接收到用户允许将所述截图和所述运行环境信息上报的确认消息后，将所述截图和所述运行环境信息上报给服务器。
可选地，所述处理模块201还用于：
处理用户发起的各个交互操作，针对所述各个交互操作中的任一交互操作，生成所述交互操作的交互记录并发送给所述服务器，以使所述服务器根据所述交互操作的交互记录分析所述页面代码中用于实现所述交互操作的部分存在的错误；其中，所述交互操作的交互记录包括交互开始记录，所述交互开始记录是在所述交互操作的处理逻辑开始时生成的，所述交互开始记录中包括所述网页代码的运行环境信息和所述交互操作的预期效果，在所述交互操作的处理逻辑正常结束的情况下，所述交互记录中还包括交互结束记录。
可选地，所述处理模块201具体用于：
在所述交互操作的处理逻辑开始时，生成所述交互操作的交互开始记录，并发送给服务器；
在所述交互操作的处理逻辑正常结束时，生成所述交互操作的交互结束记录，并发送给服务器。
可选地，所述运行环境信息至少包括如下的一项或多项：
所述用户设备的操作系统、所述用户设备访问的网页链接、所述网页的加载耗时、所述用户设备访问所述网页使用的浏览设备。
基于同样的发明构思，本发明实施例还提供一种服务器，图3为本发明实施例中提供的一种服务器的结构示意图，如图3所示，该服务器300包括：
收发模块301，用于接收用户设备发送的各个交互操作的交互记录；其中，任一交互操作的交互记录中包括交互开始记录，所述交互开始记录是在所述任一交互操作的处理逻辑开始时生成的，所述交互开始记录中包括所述任一交互操作的运行环境信息和预期效果；在所述任一交互操作的处理逻辑正常结束的情况下，所述任一交互操作的交互记录中还包括交互结束记录；
处理模块302，用于对所述各个交互操作的交互记录进行遍历，筛选出所述各个交互操作中交互记录仅包括交互开始记录，但不包括交互结束记录的标志交互操作，并根据所述标志交互操作的交互记录分析所述网页代码中用于实现所述标志交互操作的预期效果的代码中存在的错误。
可选地，所述处理模块302还用于：
确定所述标志交互操作中具有同一预期效果的交互操作的数量大于设定阈值。
基于同样的发明构思，本发明实施例还提供另一种检测设备，该检测设备具体可以为桌面计算机、便携式计算机、智能手机、平板电脑、个人数字助理 (Personal DigitalAssistant，PDA)等。该检测设备可以包括中央处理器(Center Processing Unit，CPU)、存储器、输入/输出设备等，输入设备可以包括键盘、鼠标、触摸屏等，输出设备可以包括显示设备，如液晶显示器(Liquid Crystal Display，LCD)、阴极射线管(Cathode Ray Tube，CRT)等。
存储器可以包括只读存储器(ROM)和随机存取存储器(RAM)，并向处理器提供存储器中存储的程序指令和数据。在本发明实施例中，存储器可以用于存储上述检测前端网页代码中错误的方法的程序。
处理器通过调用存储器存储的程序指令，处理器用于按照获得的程序指令执行上述检测前端网页代码中错误的方法。
基于同样的发明构思，本发明实施例提供了一种计算机存储介质，用于储存为上述检测设备所用的计算机程序指令，其包含用于执行上述检测前端网页代码中错误的方法的程序。
所述计算机存储介质可以是计算机能够存取的任何可用介质或数据存储设备，包括但不限于磁性存储器(例如软盘、硬盘、磁带、磁光盘(MO)等)、光学存储器(例如CD、DVD、BD、HVD等)、以及半导体存储器(例如ROM、EPROM、EEPROM、非易失性存储器(NAND FLASH)、固态硬盘(SSD)) 等。
由上述内容可以看出：
本发明实施例中，若确定用户设备中打开的网页完成页面加载渲染，则对用户设备展示的网页进行截图，并采集网页代码的运行环境信息后，将截图和运行环境信息一起上报给服务器。可见，采用本发明实施例提供的方法，由于截图可以更直观的展示网页在页面加载渲染中出现的异常，服务器根据该截图和网页代码的运行环境信息来共同分析网页代码，可使得开发人员了解问题发生的场景，从而准确定位网页代码中存在的错误，提高前端开发的测试效率。
本领域内的技术人员应明白，本发明的实施例可提供为方法、系统、或计算机程序产品。因此，本发明可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本发明可采用在一个或两个以上其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
本发明是参照根据本发明实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和 /或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/ 或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或两个以上流程和/或方框图一个方框或两个以上方框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或两个以上流程和/或方框图一个方框或两个以上方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或两个以上流程和/或方框图一个方框或两个以上方框中指定的功能的步骤。
尽管已描述了本发明的优选实施例，但本领域内的技术人员一旦得知了基本创造性概念，则可对这些实施例作出另外的变更和修改。所以，所附权利要求意欲解释为包括优选实施例以及落入本发明范围的所有变更和修改。
显然，本领域的技术人员可以对本发明进行各种改动和变型而不脱离本发明的精神和范围。这样，倘若本发明的这些修改和变型属于本发明权利要求及其等同技术的范围之内，则本发明也意图包含这些改动和变型在内。
Claims (18)
1.一种检测前端网页代码中错误的方法，其特征在于，所述方法包括：
若确定用户设备中打开的网页完成页面加载渲染，则对所述用户设备展示的网页进行截图，并采集网页代码的运行环境信息；
将所述截图和所述运行环境信息上报给服务器，以使所述服务器根据所述截图和所述运行环境信息分析所述网页代码中用于实现页面加载渲染的代码中存在的错误。
2.根据权利要求1所述的方法，其特征在于，在将所述截图和所述运行环境信息上报给服务器之前，还包括：
在接收到用户允许将所述截图和所述运行环境信息上报的确认消息后，将所述截图和所述运行环境信息上报给服务器。
3.根据权利要求1所述的方法，其特征在于，在所述用户设备中打开的网页完成页面加载渲染之后，还包括：
处理用户发起的各个交互操作，针对所述各个交互操作中的任一交互操作，生成所述交互操作的交互记录并发送给所述服务器，以使所述服务器根据所述交互操作的交互记录分析所述页面代码中用于实现所述交互操作的部分存在的错误；其中，所述交互操作的交互记录包括交互开始记录，所述交互开始记录是在所述交互操作的处理逻辑开始时生成的，所述交互开始记录中包括所述网页代码的运行环境信息和所述交互操作的预期效果，在所述交互操作的处理逻辑正常结束的情况下，所述交互记录中还包括交互结束记录。
4.根据权利要求3所述的方法，其特征在于，针对所述各个交互操作中的任一交互操作，生成所述交互操作的交互记录并发送给所述服务器，包括：
在所述交互操作的处理逻辑开始时，生成所述交互操作的交互开始记录，并发送给服务器；
在所述交互操作的处理逻辑正常结束时，生成所述交互操作的交互结束记录，并发送给服务器。
5.根据权利要求1至4中任一项所述的方法，其特征在于，所述运行环境信息至少包括如下的一项或多项：
所述用户设备的操作系统、所述用户设备访问的网页链接、所述网页的加载耗时、所述用户设备访问所述网页使用的浏览设备。
6.一种检测前端网页代码中错误的方法，其特征在于，所述方法包括：
服务器接收用户设备发送的各个交互操作的交互记录；其中，任一交互操作的交互记录中包括交互开始记录，所述交互开始记录是在所述任一交互操作的处理逻辑开始时生成的，所述交互开始记录中包括所述任一交互操作的运行环境信息和预期效果；在所述任一交互操作的处理逻辑正常结束的情况下，所述任一交互操作的交互记录中还包括交互结束记录；
所述服务器对所述各个交互操作的交互记录进行遍历，筛选出所述各个交互操作中交互记录仅包括交互开始记录，但不包括交互结束记录的标志交互操作，并根据所述标志交互操作的交互记录分析所述网页代码中用于实现所述标志交互操作的交互效果的代码中存在的错误。
7.根据权利要求6所述的方法，其特征在于，所述服务器根据所述标志交互操作的交互记录分析所述网页代码中用于实现所述标志交互操作的交互效果的代码中存在的错误之前，还包括：
所述服务器确定所述标志交互操作中具有同一预期效果的交互操作的数量大于设定阈值。
8.一种检测设备，其特征在于，所述设备包括：
处理模块，用于若确定用户设备中打开的网页完成页面加载渲染，则对所述用户设备展示的网页进行截图，并采集网页代码的运行环境信息；
收发模块，用于将所述截图和所述运行环境信息上报给服务器，以使所述服务器根据所述截图和所述运行环境信息分析所述网页代码中用于实现页面加载渲染的代码中存在的错误。
9.根据权利要求8所述的设备，其特征在于，所述处理模块还用于：在接收到用户允许将所述截图和所述运行环境信息上报的确认消息后，将所述截图和所述运行环境信息上报给服务器。
10.根据权利要求8所述的设备，其特征在于，所述处理模块还用于：
处理用户发起的各个交互操作，针对所述各个交互操作中的任一交互操作，生成所述交互操作的交互记录并发送给所述服务器，以使所述服务器根据所述交互操作的交互记录分析所述页面代码中用于实现所述交互操作的部分存在的错误；其中，所述交互操作的交互记录包括交互开始记录，所述交互开始记录是在所述交互操作的处理逻辑开始时生成的，所述交互开始记录中包括所述网页代码的运行环境信息和所述交互操作的预期效果，在所述交互操作的处理逻辑正常结束的情况下，所述交互记录中还包括交互结束记录。
11.根据权利要求10所述的设备，其特征在于，所述处理模块具体用于：
在所述交互操作的处理逻辑开始时，生成所述交互操作的交互开始记录，并发送给服务器；
在所述交互操作的处理逻辑正常结束时，生成所述交互操作的交互结束记录，并发送给服务器。
12.根据权利要求8至11中任一项所述的设备，其特征在于，所述运行环境信息至少包括如下的一项或多项：
所述用户设备的操作系统、所述用户设备访问的网页链接、所述网页的加载耗时、所述用户设备访问所述网页使用的浏览设备。
13.一种服务器，其特征在于，所述服务器包括：
收发模块，用于接收用户设备发送的各个交互操作的交互记录；其中，任一交互操作的交互记录中包括交互开始记录，所述交互开始记录是在所述任一交互操作的处理逻辑开始时生成的，所述交互开始记录中包括所述任一交互操作的运行环境信息和预期效果；在所述任一交互操作的处理逻辑正常结束的情况下，所述任一交互操作的交互记录中还包括交互结束记录；
处理模块，用于对所述各个交互操作的交互记录进行遍历，筛选出所述各个交互操作中交互记录仅包括交互开始记录，但不包括交互结束记录的标志交互操作，并根据所述标志交互操作的交互记录分析所述网页代码中用于实现所述标志交互操作的交互效果的代码中存在的错误。
14.根据权利要求13所述的服务器，其特征在于，所述处理模块还用于：
确定所述标志交互操作中具有同一交互效果的交互操作的数量大于设定阈值。
15.一种检测设备，其特征在于，包括：
存储器，用于存储程序指令；
处理器，用于调用所述存储器中存储的程序指令，按照获得的程序执行如权利要求1至5中任一项所述的方法。
16.一种计算机存储介质，其特征在于，所述计算机可读存储介质存储有计算机可执行指令，所述计算机可执行指令用于使所述计算机执行如权利要求1至5中任一项所述的方法。
17.一种检测设备，其特征在于，包括：
存储器，用于存储程序指令；
处理器，用于调用所述存储器中存储的程序指令，按照获得的程序执行如权利要求6至7中任一项所述的方法。
18.一种计算机存储介质，其特征在于，所述计算机可读存储介质存储有计算机可执行指令，所述计算机可执行指令用于使所述计算机执行如权利要求6至7中任一项所述的方法。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201710930123.9A CN107967209B (zh) | 2017-10-09 | 2017-10-09 | 一种检测前端网页代码中错误的方法、检测设备及服务器 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201710930123.9A CN107967209B (zh) | 2017-10-09 | 2017-10-09 | 一种检测前端网页代码中错误的方法、检测设备及服务器 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN107967209A true CN107967209A (zh) | 2018-04-27 |
| CN107967209B CN107967209B (zh) | 2021-03-16 |
Family
ID=61997592
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201710930123.9A Active CN107967209B (zh) | 2017-10-09 | 2017-10-09 | 一种检测前端网页代码中错误的方法、检测设备及服务器 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN107967209B (zh) |
Cited By (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN109542853A (zh) * | 2018-11-28 | 2019-03-29 | 深圳市瑞云科技有限公司 | 一种解决本地渲染出错的方法 |
| CN110059468A (zh) * | 2019-04-02 | 2019-07-26 | 阿里巴巴集团控股有限公司 | 一种小程序风险识别方法和装置 |
| CN110955438A (zh) * | 2019-12-03 | 2020-04-03 | 北京博睿宏远数据科技股份有限公司 | 一种小程序的性能监控方法、装置、设备及存储介质 |
| CN111026637A (zh) * | 2019-10-22 | 2020-04-17 | 苏宁云计算有限公司 | 一种定位问题代码的方法及装置 |
| CN111338932A (zh) * | 2020-02-06 | 2020-06-26 | 支付宝(杭州)信息技术有限公司 | 图片渲染方法、装置和电子设备 |
| CN111488540A (zh) * | 2019-01-29 | 2020-08-04 | 百度在线网络技术（北京）有限公司 | 信息屏蔽监测方法、装置、设备及计算机可读介质 |
| CN112671615A (zh) * | 2020-12-29 | 2021-04-16 | 中国平安财产保险股份有限公司 | 前端用户操作行为数据的收集方法、系统及存储介质 |
| CN112837049A (zh) * | 2021-03-25 | 2021-05-25 | 中国工商银行股份有限公司 | 基于u盾的网银使用问题上报方法及装置 |
| CN113190432A (zh) * | 2021-03-16 | 2021-07-30 | Oppo广东移动通信有限公司 | 代码测试方法、装置、终端及存储介质 |
Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103312851A (zh) * | 2013-05-31 | 2013-09-18 | 南京大学 | 一种智能手机应用交互界面程序可用性测试方法 |
| US20140189435A1 (en) * | 2012-12-31 | 2014-07-03 | Johnson Manuel-Devadoss | System and method to extend the capabilities of a web browser of a web application issue root cause determination techniques |
| CN104796278A (zh) * | 2014-01-21 | 2015-07-22 | 携程计算机技术（上海）有限公司 | 终端设备、Web前端错误的上报系统及方法 |
| CN105468587A (zh) * | 2014-05-30 | 2016-04-06 | 北京奇虎科技有限公司 | 一种网页异常监测方法和装置 |
| CN105979092A (zh) * | 2016-05-13 | 2016-09-28 | 腾讯科技（深圳）有限公司 | 一种异常监控方法及装置 |
| CN106815137A (zh) * | 2015-12-01 | 2017-06-09 | 北京奇虎科技有限公司 | 用户界面测试方法与装置 |
| CN106843912A (zh) * | 2017-03-22 | 2017-06-13 | 武汉斗鱼网络科技有限公司 | 页面信息获取方法及装置 |
| CN107122281A (zh) * | 2017-03-17 | 2017-09-01 | 百度在线网络技术（北京）有限公司 | 移动应用加载监控方法和系统 |
-
2017
- 2017-10-09 CN CN201710930123.9A patent/CN107967209B/zh active Active
Patent Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20140189435A1 (en) * | 2012-12-31 | 2014-07-03 | Johnson Manuel-Devadoss | System and method to extend the capabilities of a web browser of a web application issue root cause determination techniques |
| CN103312851A (zh) * | 2013-05-31 | 2013-09-18 | 南京大学 | 一种智能手机应用交互界面程序可用性测试方法 |
| CN104796278A (zh) * | 2014-01-21 | 2015-07-22 | 携程计算机技术（上海）有限公司 | 终端设备、Web前端错误的上报系统及方法 |
| CN105468587A (zh) * | 2014-05-30 | 2016-04-06 | 北京奇虎科技有限公司 | 一种网页异常监测方法和装置 |
| CN106815137A (zh) * | 2015-12-01 | 2017-06-09 | 北京奇虎科技有限公司 | 用户界面测试方法与装置 |
| CN105979092A (zh) * | 2016-05-13 | 2016-09-28 | 腾讯科技（深圳）有限公司 | 一种异常监控方法及装置 |
| CN107122281A (zh) * | 2017-03-17 | 2017-09-01 | 百度在线网络技术（北京）有限公司 | 移动应用加载监控方法和系统 |
| CN106843912A (zh) * | 2017-03-22 | 2017-06-13 | 武汉斗鱼网络科技有限公司 | 页面信息获取方法及装置 |
Cited By (13)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN109542853B (zh) * | 2018-11-28 | 2021-11-02 | 深圳市瑞云科技有限公司 | 一种解决本地渲染出错的方法 |
| CN109542853A (zh) * | 2018-11-28 | 2019-03-29 | 深圳市瑞云科技有限公司 | 一种解决本地渲染出错的方法 |
| CN111488540B (zh) * | 2019-01-29 | 2024-04-02 | 百度在线网络技术（北京）有限公司 | 信息屏蔽监测方法、装置、设备及计算机可读介质 |
| CN111488540A (zh) * | 2019-01-29 | 2020-08-04 | 百度在线网络技术（北京）有限公司 | 信息屏蔽监测方法、装置、设备及计算机可读介质 |
| CN110059468A (zh) * | 2019-04-02 | 2019-07-26 | 阿里巴巴集团控股有限公司 | 一种小程序风险识别方法和装置 |
| CN110059468B (zh) * | 2019-04-02 | 2023-09-26 | 创新先进技术有限公司 | 一种小程序风险识别方法和装置 |
| CN111026637A (zh) * | 2019-10-22 | 2020-04-17 | 苏宁云计算有限公司 | 一种定位问题代码的方法及装置 |
| CN110955438A (zh) * | 2019-12-03 | 2020-04-03 | 北京博睿宏远数据科技股份有限公司 | 一种小程序的性能监控方法、装置、设备及存储介质 |
| CN111338932A (zh) * | 2020-02-06 | 2020-06-26 | 支付宝(杭州)信息技术有限公司 | 图片渲染方法、装置和电子设备 |
| CN112671615A (zh) * | 2020-12-29 | 2021-04-16 | 中国平安财产保险股份有限公司 | 前端用户操作行为数据的收集方法、系统及存储介质 |
| CN112671615B (zh) * | 2020-12-29 | 2023-07-07 | 中国平安财产保险股份有限公司 | 前端用户操作行为数据的收集方法、系统及存储介质 |
| CN113190432A (zh) * | 2021-03-16 | 2021-07-30 | Oppo广东移动通信有限公司 | 代码测试方法、装置、终端及存储介质 |
| CN112837049A (zh) * | 2021-03-25 | 2021-05-25 | 中国工商银行股份有限公司 | 基于u盾的网银使用问题上报方法及装置 |
Also Published As
| Publication number | Publication date |
|---|---|
| CN107967209B (zh) | 2021-03-16 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN107967209A (zh) | 一种检测前端网页代码中错误的方法、检测设备及服务器 | |
| US7827486B2 (en) | Evaluation of visual content usage | |
| US9268671B2 (en) | Embedded test management for mobile applications | |
| US20110227925A1 (en) | Displaying a visualization of event instances and common event sequences | |
| US9519692B2 (en) | Visualizing related events within a timeline | |
| EP2778929B1 (en) | Test script generation system | |
| EP3206170A1 (en) | System and methods for creating on-demand robotic process automation | |
| Paternò et al. | Customizable automatic detection of bad usability smells in mobile accessed web applications | |
| US10756959B1 (en) | Integration of application performance monitoring with logs and infrastructure | |
| CN105224462B (zh) | 控件元素的识别方法和装置 | |
| CN108108297A (zh) | 自动化测试的方法和装置 | |
| CN107666987A (zh) | 机器人过程自动化 | |
| US20110107153A1 (en) | System and method for monitoring exploratory testing by a plurality of testers | |
| US10037315B2 (en) | Using form fields as dimensions to define consumer segments for which form interactivity metrics can be analyzed | |
| CN109408754B (zh) | 网页操作数据的处理方法、装置、电子设备及存储介质 | |
| US20110038542A1 (en) | Computer application analysis | |
| CN112817817B (zh) | 埋点信息查询方法、装置、计算机设备和存储介质 | |
| US20200050534A1 (en) | System error detection | |
| US20160026691A1 (en) | Bridge event analytics tools and techniques | |
| CN109614340A (zh) | 应用程序的开发调试方法、装置、电子设备及存储介质 | |
| CN106708528A (zh) | 脚本生成方法及装置 | |
| CN114003473A (zh) | 一种页面操作行为的回溯方法、装置及电子设备 | |
| CN118193389A (zh) | 一种测试案例生成方法、装置、设备、存储介质及产品 | |
| CN107220230A (zh) | 一种信息采集方法和装置，以及一种智能终端 | |
| US20140304686A1 (en) | Responding to a problem during software testing |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |