CN115686904A - Webpage diagnosis method, equipment and system - Google Patents

Abstract

The application provides a webpage diagnosis method, equipment and system. In an embodiment, the method is applied to a first device and comprises the steps of obtaining a plurality of copies of a target webpage and error information when an error occurs; the multiple copies comprise a first copy before an error occurs in the target webpage and a second copy when the error occurs; the multiple copies are used for recording page content information, operation information and network requests of the target webpage; the operation information indicates the operation of the user on the target webpage, and the page content information is used for generating page content; and sending the multiple copies and the error information to the second equipment so that the second equipment restores the page content of the target webpage, the operation of the user on the target webpage and the result of the network request based on the multiple copies. Therefore, the method collects the page content, error information, user operation and the like on the webpage in a period of time before the webpage generates the error, and more comprehensively and quickly positions the error generated in the webpage.

Description

Webpage diagnosis method, equipment and system

Technical Field

The present application relates to the field of internet technologies, and in particular, to a method, device, and system for web page diagnosis.

Background

At present, with the popularization of browsers, user experience of Web (World Wide Web, also called World Wide Web) interfaces, namely Web pages, is particularly important, but abnormal situations or errors which cannot be predicted may occur in the use process of the Web pages. Therefore, how the user feeds back the problem and how the engineer diagnoses the problem on the webpage is a practical service pain point.

At present, a user can feed back screenshot and error information when a current webpage has an error or is abnormal, and an engineer realizes webpage abnormality analysis based on the screenshot and error information fed back by the user.

However, the above method only has information of the moment of error or abnormality, and may not be able to analyze the actual problem of the web page more accurately.

The information disclosed in this background section is only for enhancement of understanding of the general background of the application and should not be taken as an acknowledgement or any form of suggestion that this information forms the prior art that is already known to a person skilled in the art.

Disclosure of Invention

The embodiment of the application provides a webpage diagnosis method, equipment and a system, which can collect information such as webpage content, error information, user operation and the like on a webpage when a webpage generates an error and a period of time before the error occurs, so that an engineer can quickly locate the error generated in the webpage based on more comprehensive information.

In a first aspect, an embodiment of the present application provides a web page diagnosis method, applied to a first device, including: acquiring a plurality of copies of a target webpage and error information when an error occurs; the multiple copies comprise a first copy before an error occurs in the target webpage and a second copy when the error occurs in the target webpage; the plurality of copies are used for recording page content information and operation information of the target webpage; the operation information indicates the operation of the user on the target webpage, and the page content information is used for generating page content; and sending the multiple copies and the error information to a second device so as to enable the second device to generate an image sequence based on the multiple copies, wherein the image sequence is used for recording the page content of the target webpage at least one first moment and the operation position of the user on the target webpage at least one second moment.

According to the scheme, data such as page content, user operation and error information of the webpage at different moments are recorded in a circulating mode, so that relevant information of the webpage before an error occurs can be recorded completely, the data are rendered into the webpage again, page content of the webpage at different moments in a period before the error occurs and the error occurs is restored, user operation and error information are facilitated, and an engineer can position complex errors.

In one possible implementation, the method further includes: acquiring equipment hardware information; wherein the device hardware information indicates at least a condition of hardware in the first device that processes the target web page; acquiring browser information; wherein the browser information comprises a plug-in and/or a running environment of a browser processing the target web page; sending the device hardware information and the browser information to the second device to enable the second device to construct a virtual device of the first device based on the device hardware information, and generating an image sequence on the virtual device based on the browser information and the multiple copies.

According to the scheme, the virtual equipment of the adaptive terminal equipment is constructed, and the browser restored on the virtual equipment can accurately restore the webpage related information before the error occurs, so that error positioning of complex problems is facilitated.

In one possible implementation, the method further includes: displaying the first interface; wherein the first interface is configured to instruct uploading of the plurality of copies and the error information to the second device.

In the scheme, data uploading is realized through user operation.

In one possible implementation, the multiple copies include an initial copy of the target web page and an incremental copy of the target web page relative to the initial copy;

in one possible implementation, the multiple copies are desensitized copies.

In the scheme, the privacy of the user is ensured by desensitizing the data.

In one possible implementation, the multiple copies further include network request data, the network request data including at least one request record, the request record including a network request for the target web page and a return value of the network request, so as to cause the second device to display the request record.

According to the scheme, the network request data is recorded, so that the subsequent analysis of the network request is facilitated.

In a second aspect, an embodiment of the present application provides a web page diagnosis method, applied to a second device, including: receiving a plurality of copies of a target webpage sent by first equipment and error information when an error occurs; the multiple copies comprise at least one copy before an error occurs in the target webpage and a copy when the error occurs; the plurality of copies are used for recording page content information and operation information of the target webpage; the operation information indicates the operation of the user on the target webpage, and the page content information is used for generating page content; and generating an image sequence based on the plurality of copies, wherein the image sequence is used for recording the page content of the target webpage at least one first moment and the operation position of the user on the target webpage at least one second moment.

The beneficial effects of the scheme are not described in detail above.

In one possible implementation, the method further includes: receiving device hardware information sent by the first device; wherein the device hardware information indicates at least a condition of hardware in the first device that processes the target web page; receiving browser information sent by the first equipment; wherein the browser information comprises a plug-in and/or a running environment of a browser processing the target web page; generating, based on the plurality of duplicates, a sequence of images, comprising:

and constructing a virtual device of the first device based on the device hardware information, and generating an image sequence on the virtual device based on the browser information and the plurality of copies.

The beneficial effects of the scheme are not described in detail above.

In one possible implementation, the method further includes: providing a first interface; wherein the first interface is configured to instruct the first device to upload the plurality of copies and error information.

In one possible implementation, the multiple copies include an initial copy of the target web page and an incremental copy of the target web page relative to the initial copy.

In one possible implementation, the multiple copies are desensitized copies.

In one possible implementation, the multiple copies further include web request data, the web request data including at least one request record, the request record including a web request for the target web page and a return value of the web request.

In one possible implementation, the method further includes: determining page reference information corresponding to at least one frame in the image sequence based on the plurality of copies; wherein the page reference information comprises an operation record, a request record and/or error information; the request record comprises a network request aiming at the target webpage and a return value of the network request, and the operation record comprises an operation position and/or an operation type; and displaying the image sequence and page reference information corresponding to at least one frame in the image sequence.

According to the scheme, the image sequence and the page reference information of multiple frames in the image sequence are displayed, so that subsequent error positioning of the webpage is facilitated.

In a third aspect, based on the same concept as the method embodiment of the present application, an embodiment of the present application further provides a web page diagnosis apparatus. The web page diagnosis device includes several modules, each module is used for executing each step in the web page diagnosis method provided in the embodiment of the present application, and the division of the modules is not limited herein. It is obvious to those skilled in the art that, in practical applications, the steps in the web page diagnosis method provided by the embodiments of the present application may be distributed to different modules according to needs, that is, the internal structure of the apparatus is divided into different modules to complete all or part of the functions described above. Each module in the embodiments may be integrated in one processing unit, or each unit may exist alone physically, or two or more modules are integrated in one unit, and the integrated unit may be implemented in a form of hardware, or in a form of software functional unit. In addition, the specific names of the modules are only for convenience of distinguishing from each other and are not used for limiting the protection scope of the application. For the specific working process of the modules in the apparatus, reference may be made to the corresponding process in the foregoing method embodiment, which is not described herein again.

Illustratively, the web page diagnosis apparatus is configured to execute the web page diagnosis method provided in the first aspect of the embodiment of the present application, and the web page diagnosis apparatus provided in the embodiment of the present application includes:

the first acquisition module is used for acquiring a plurality of copies of a target webpage and error information when an error occurs; the multiple copies comprise at least one copy before an error occurs in the target webpage and a copy when the error occurs; the multiple copies are used for recording page content information and operation information of the target webpage; the operation information indicates the operation of the user on the target webpage, and the page content information is used for generating page content;

and the uploading module is used for sending the multiple copies and the error information to second equipment so as to enable the second equipment to generate an image sequence based on the multiple copies, wherein the image sequence is used for recording the respective page content of the target webpage at least one first moment and the respective operation position of the user on the target webpage at least one second moment.

In one possible implementation, the apparatus further includes:

the second acquisition module is used for acquiring the hardware information of the equipment; wherein the device hardware information indicates at least a condition of hardware in the first device that processes the target web page;

the third acquisition module is used for acquiring browser information; wherein the browser information comprises a plug-in and/or a running environment of a browser processing the target web page;

the uploading module is further configured to send the device hardware information and the browser information to the second device, so that the second device constructs a virtual device of the first device based on the device hardware information, and generates an image sequence on the virtual device based on the browser information and the multiple copies.

In one possible implementation, the apparatus further includes: a display module; wherein the content of the first and second substances,

the display module is used for displaying a first interface; wherein the first interface is configured to instruct uploading of the plurality of copies and the error information to the second device.

In one possible implementation, the multiple copies include an initial copy of the target web page and an incremental copy of the target web page relative to the initial copy;

in one possible implementation, the multiple copies are desensitized copies.

In the scheme, the privacy of the user is ensured by desensitizing the data.

Illustratively, the web page diagnosis apparatus is configured to execute the web page diagnosis method provided in the second aspect of the embodiment of the present application, and the web page diagnosis apparatus provided in the embodiment of the present application includes:

the first interface module is used for receiving a plurality of copies of a target webpage sent by first equipment and error information when an error occurs; the multiple copies comprise at least one copy before an error occurs in the target webpage and a copy when the error occurs; the multiple copies are used for recording page content information and operation information of the target webpage; the operation information indicates the operation of the user on the target webpage, and the page content information is used for generating page content;

and the restoring module is used for generating an image sequence based on the plurality of copies, and the image sequence is used for recording and restoring the page content of the target webpage at least one first moment and the operation position of the user on the target webpage at least one second moment.

In one possible implementation, the apparatus further includes:

the second receiving module is used for receiving the device hardware information sent by the first device; wherein the device hardware information indicates at least a condition of hardware in the first device that processes the target web page;

a third receiving module, configured to receive browser information sent by the first device; wherein the browser information comprises a plug-in and/or a running environment of a browser processing the target web page;

the restoring module is further configured to construct a virtual device of the first device based on the device hardware information, and generate an image sequence on the virtual device based on the browser information and the multiple copies.

In one possible implementation, the apparatus further includes: an interface providing module; wherein, the first and the second end of the pipe are connected with each other,

the interface providing module is used for providing a first interface; wherein the first interface is configured to instruct the first device to upload the plurality of copies and error information.

In one possible implementation, the multiple copies include an initial copy of the target web page and an incremental copy of the target web page relative to the initial copy.

In one possible implementation, the multiple copies are desensitized copies.

In one possible implementation, the multiple copies further include web request data, the web request data including at least one request record, the request record including a web request for the target web page and a return value of the web request.

In one possible implementation, the apparatus further includes:

the restoring module is used for determining page reference information corresponding to at least one frame in the image sequence based on the plurality of copies; wherein the page reference information comprises an operation record, a request record and/or error information; the request record comprises a network request for the target webpage and a return value of the network request, and the operation record comprises an operation position and/or an operation type;

and the display module is used for displaying the image sequence and the page reference information corresponding to at least one frame in the image sequence.

In a fourth aspect, an embodiment of the present application provides a web page diagnosis device, including: at least one memory for storing a program; at least one processor for executing the memory-stored program, the processor being adapted to perform the method provided in the first aspect or to perform the method provided in the second aspect when the memory-stored program is executed.

In a fifth aspect, an embodiment of the present application provides a web page diagnosis apparatus, where the apparatus executes computer program instructions for executing the method provided in the first aspect, or executing the method provided in the second aspect. Illustratively, the apparatus may be a chip, or a processor.

In one example, the apparatus may include a processor, which may be coupled with a memory, read instructions in the memory and execute the method provided in the first aspect in accordance with the instructions, or execute the method provided in the second aspect. The memory may be integrated in the chip or the processor, or may be independent of the chip or the processor.

In a sixth aspect, an embodiment of the present application provides a web page diagnosis system, which may include a first device and a second device, where the first device is configured to perform the method provided in the first aspect, and the first device is configured to perform the method provided in the second aspect.

In a seventh aspect, an embodiment of the present application provides a computer storage medium, in which instructions are stored, and when the instructions are executed on a computer, the instructions cause the computer to perform the method provided in the first aspect, or perform the method provided in the second aspect.

In an eighth aspect, embodiments of the present application provide a computer program product comprising instructions which, when executed on a computer, cause the computer to perform the method provided in the first aspect, or to perform the method provided in the second aspect.

Drawings

FIG. 1 is a schematic diagram of a web page diagnosis method in the related art;

fig. 2 is a schematic structural diagram of a web page diagnosis system according to an embodiment of the present application.

Fig. 3 is a first flowchart illustrating a web page diagnosis method according to an embodiment of the present application;

FIG. 4 is a schematic interface display diagram of a target webpage according to an embodiment of the present application;

FIG. 5a is a first schematic diagram illustrating the operation of the target web page provided in FIG. 4;

FIG. 5b is a second schematic diagram of the operation of the target web page provided in FIG. 4;

FIG. 5c is a third schematic illustration of the operation of the target web page provided in FIG. 4;

FIG. 5d is a fourth schematic illustration of the operation of the target web page provided in FIG. 4;

FIG. 5e is a fifth schematic illustration of the operation of the target web page provided in FIG. 4;

FIG. 5f is a sixth schematic illustration of the operation of the target web page provided in FIG. 4;

FIG. 5g is a schematic diagram of a display of a sequence of images provided by an embodiment of the present application;

fig. 6 is a schematic flowchart of a web page diagnosis method according to an embodiment of the present application;

fig. 7 is a schematic structural diagram of an electronic device according to an embodiment of the present application.

Detailed Description

In order to make the objects, technical solutions and advantages of the embodiments of the present application clearer, the technical solutions of the embodiments of the present application will be described below with reference to the accompanying drawings.

In the description of the embodiments of the present application, the words "exemplary," "for example," or "for instance" are used to mean serving as an example, instance, or illustration. Any embodiment or design described herein as "exemplary," "for example," or "for example" is not necessarily to be construed as preferred or advantageous over other embodiments or designs. Rather, use of the words "exemplary," "e.g.," or "exemplary" is intended to present relevant concepts in a concrete fashion.

In the description of the embodiments of the present application, the term "and/or" is only one kind of association relationship describing an association object, and indicates that three relationships may exist, for example, a and/or B may indicate: a exists alone, B exists alone, and A and B exist at the same time. In addition, the term "plurality" means two or more unless otherwise specified. For example, the plurality of systems refers to two or more systems, and the plurality of terminals refers to two or more terminals.

Furthermore, the terms "first", "second" and "first" are used for descriptive purposes only and are not to be construed as indicating or implying relative importance or implicit indication of indicated technical features. Thus, a feature defined as "first" or "second" may explicitly or implicitly include one or more of that feature. The terms "comprising," "including," "having," and variations thereof mean "including, but not limited to," unless expressly specified otherwise.

Currently, the B/S architecture is the preferred architecture for application software today. The B/S architecture is a software system architecture, and refers to a browser-Web Server (browser-Server), and adopts a three-layer architecture, i.e., a presentation layer (which is an interface presented to a user), a service logic layer (which is an operation on a data layer and performs logic processing on data services, as well as an operation on a specific problem and performs logic processing on data services), and a data access layer (which is an operation on a data layer and performs logic processing on data services). In the B/S architecture, the user interface is implemented entirely through a browser, with some of the transactional logic implemented on the front end, but the main transactional logic is implemented on the server side, forming a so-called triple-initiative architecture. In the B/S architecture system, a user sends requests to a plurality of servers distributed on a network through a browser, and the servers process the requests of the browser and return information required by the user to the browser. And the rest of the work such as data request, processing, result return, dynamic webpage generation, access to a database, execution of an application program and the like is completely finished by the Web server.

Therefore, the user experience of the Web interface, i.e., the Web page, is particularly important, but the Web page may have unexpected abnormalities or errors during the use process. Therefore, how the user feeds back the problem and how the engineer diagnoses the problem on the webpage is a practical service pain point.

The existing webpage diagnosis method mainly monitors errors or abnormalities in the webpage and returns the last screenshot of the webpage error and error information and other contents when the webpage error occurs. The details of commonly implementing such a scheme are as follows:

as shown in FIG. 1, when a user accesses a web page, the web page launches a monitoring system to monitor the web page. When the webpage has errors or is abnormal, namely the webpage reports the errors, the monitoring system informs the information acquisition module to acquire information such as webpage screenshots, error reports and the like when the errors are reported, and then packages and sends the information to the server for analysis, namely uploading analysis. The information acquisition module acquires information only when the webpage is wrong or abnormal, only acquires some information when the webpage is wrong or abnormal, and cannot acquire a series of previous operation information of the user.

The above scheme has the following disadvantages.

1. Only the screenshot and the error information when the current webpage has an error or is abnormal can be fed back, and more operations before the error can not be traced. Positioning errors often need a complete operation process, and only information at the moment of error reporting hardly has a good effect on positioning of complex problems. The engineer may not be able to reproduce the scene at that time because the complex error problem typically requires a continuous operational flow for the user to trigger.

2. Data such as network requests when the user reports errors cannot be obtained, more information cannot be obtained as reference, and the positioning result may be inaccurate.

3. Due to direct feedback of information such as screenshots and the like, some sensitive information of the user may be exposed, and the risk of leakage of the sensitive information of the user exists.

In order to solve the above technical problem, an embodiment of the present application provides a web page diagnosis method, which can collect data such as a web page content, error information, a user operation, and a network request that are generated in a web page and are on the web page in a period before the occurrence of an error, and then re-render information such as the web page content, the user operation, error reporting information, and the network request of the web page in a browser based on the data, so that an engineer can quickly locate and modify the error or abnormality generated in the web page based on more comprehensive information.

Fig. 2 is a diagram illustrating an exemplary architecture of a web page diagnosis system to which the web page diagnosis method provided in the embodiment of the present application is applied. It should be understood that the web page diagnosis system to which the web page diagnosis method provided in the embodiment of the present application may be applied may also be applied to other web page diagnosis systems other than the web page diagnosis system shown in fig. 2, which is not limited in the embodiment of the present application. As shown in fig. 2, the web page diagnosis system includes a terminal device 210 and an analysis device 220.

The terminal device 210 may be, but not limited to, various personal computers, notebook computers, smart phones, tablet computers, and other devices capable of browsing a web page, specifically, the terminal device 210 is installed with a browser, and a user accesses the web page through the browser. Exemplary embodiments of the terminal device 210 referred to in the embodiments of the present application include, but are not limited to, an electronic device that carries an iOS, android, windows, dammony (OS), or other operating system. The embodiment of the present application does not specifically limit the type of the electronic device.

Wherein the analysis device 220 may be a server. In some embodiments, the analysis device 220 may also be a terminal device such as a desktop computer, a notebook computer, or a smart phone.

The terminal device 210 communicates with the analysis device 220 via a network. The network may be a wired network or a wireless network. Illustratively, the wired Network may be a cable Network, a fiber Network, a Digital Data Network (DDN), etc., and the Wireless Network may be a telecommunication Network, an intranet, the internet, a Local Area Network (LAN), a Wide Area Network (WAN), a Wireless Local Area Network (WLAN), a WLAN, a Metropolitan Area Network (MAN), a Public Switched Telephone Network (PSTN), a bluetooth Network, a ZigBee Network, a Mobile phone (GSM) for Mobile Communications, a CDMA (Code Division Multiple Access) Network, a CPRS (general packet radio Access) Network, etc., or any combination thereof. It is understood that the network may use any known network communication protocol, such as ethernet, universal Serial Bus (USB), firewire (firewire), global system for mobile communications (GSM), general Packet Radio Service (GPRS), code division multiple access (code division multiple access, CDMA), wideband code division multiple access (wideband code division multiple access, WCDMA), time division code division multiple access (TD-SCDMA), long term evolution (long term evolution, LTE), new air interface (radio, NR), bluetooth (wireless fidelity), wireless fidelity (Wi-Fi), etc., to enable communication between the different client layers and the gateway.

In the process that the terminal device 210 accesses the web page of the client by using the browser, the terminal device 210 collects the data of the web page at different times, such as the content of the web page, error information, and user operation, during a period of time before the error occurs, and packages and uploads the data to the analysis device 220, and the analysis device 220 can restore the content of the web page at different times, the user operation, and other information in the browser, so that an engineer can more comprehensively and quickly locate and modify the error or abnormality occurring in the web page.

It should be noted that the web page diagnosis system shown in fig. 2 is merely an example, and is not limited to the specific example, in an actual application, the web page diagnosis system may include more devices than those shown in fig. 2, for example, the web page diagnosis system may further include a device cluster, the device cluster serves as a server, the analysis device 220 serves as a client, so that the target data and the re-rendering task are handed to the device cluster, the analysis device 220 is configured to send a request to the device cluster, the device cluster performs web page restoration in response to the request, and displays a result after re-rendering to an engineer.

Fig. 3 is a schematic flowchart of a web page analysis method according to an embodiment of the present application. The embodiment can be applied to the web page diagnosis system, and particularly, can be applied to the terminal device 210 and the analysis device 220. As shown in fig. 3, the web page analysis method provided in the embodiment of the present application at least includes the following steps:

step 301, the terminal device 210 creates a plurality of first copies of the target web page; at least one first copy is at least used for recording page content information and operation information of a target webpage; the page content information is used for generating page content of the target webpage, and the operation information indicates the operation of the user on the target webpage.

In practical applications, a user accesses a client of a target application through a browser installed in the terminal device 210, so as to run a target webpage in the target application in the browser and display the page content of the target webpage, and then, the user may operate the page content of the target webpage, so as to change the page content of the target webpage.

Specifically, the terminal device 210 accesses the target webpage based on a website (usually, a uniform resource locator (url)) of the target webpage, may obtain a webpage file, parses the webpage file to obtain a DOM (Document object model) tree, and renders the DOM tree to display the page content of the target webpage. The DOM tree records a plurality of nodes and node information of each node, and the node information may include content to be displayed and/or resources to be requested. For example, the requested resource may be a CSS (Cascading Style Sheets) file, a resource inside the terminal device 210 (for convenience of description and distinction, it may be referred to as a local resource), or a resource outside the terminal device 210 (for convenience of description and distinction, it may be referred to as an external resource). When requesting internal resources, the request generated by the terminal device 210 may be referred to as an internal request; when an external resource is requested, the request generated by the terminal device 210 may be referred to as a network request. For example, in the process of rendering the DOM tree, if an external css file is encountered, a browser running in the terminal device 220 may further send a network request to obtain the css file, and if an image resource is encountered, the browser may further send a network request to obtain the image resource.

Subsequently, if the user operates the page content of the target web page, the terminal device 210 may generate a network request or an internal request, request a resource, and change a part of the page content of the target web page. For example, the web request may be an address of a new web page to jump to, and it is assumed that the page content of the target web page includes a tab bar, a plurality of tabs are in the tab bar, and the user clicks a tab in the tab bar, such as a first page, at this time, the web request may be sent to request the content of the tab, and at this time, the web request may be considered as an address of a web page to jump to. The web request may also be content that needs to be displayed on the target web page, for example, the target web page may select to query some data, and in this case, the web request may be to request data that needs to be queried and then displayed on the web page.

Specifically, the user may operate the page content of the target web page to generate an operation event, and further, process the operation event to generate an internal request or a network request, and update the page content after requesting the resource. Wherein the operation event indicates operation-related information, such as operation type, operation location, and the like. Here, the operation event may be a click event, a move event, an input event, a long-press slide event, a slide event, etc., and correspondingly, the operation by the user may be a click, a mouse move, a mouse long-press slide, etc.

For example, the terminal device 210 accesses the target web page based on the web address url1 of the target web page, and may obtain the page shown in fig. 4. Thereafter, the user may operate on the page content shown in fig. 4.

Fig. 5a to 5f illustrate operations that may be performed on the page content shown in fig. 4.

As shown in fig. 5a, the mouse can slide on the content of the page shown in fig. 4, and a mouse moving track T is obtained.

As shown in fig. 5b, the mouse may click on the video play button in the video display area 401, and the terminal device 210 may send a network request requesting a video resource, and then may generate a video display page 406 for playing a video.

As shown in fig. 5c, the user may input product a in the product input box through the keyboard and click the search button, the terminal device 210 may send a network request to request introduction information of product a, and then, information such as pictures, videos, and text introduction related to product a may be displayed in the product introduction display area 404.

As shown in fig. 5d, the mouse may click on the title tag2, and the terminal device 210 may send an internal request to request the resource under tag2, and then may highlight tag2 and display the content corresponding to tag2 in the title content display area 405.

As shown in fig. 5e, the mouse can press the slider control 402 for a long time and move, and the terminal device 210 can implement page movement.

As shown in fig. 5f, the mouse may move to tab C2, terminal device 210 highlights tab C2, and when the mouse clicks on tab C2, terminal device 210 generates a network request (including url 2) to jump to web page 2 indicated by C2.

In the process of displaying the page content of the target webpage and operating the page content of the target webpage by the user in the terminal device 210, the related information of the target webpage can be recorded circularly, and the page content information of the target webpage, the request record of the network request, the operation information and the like can be recorded, so that a plurality of first copies can be obtained.

The page content information is used to generate page content of the target web page, which is usually a DOM tree. The DOM tree is used to record the text that needs to be displayed, the external resources that need to be requested, and the internal resources that need to be requested. The DOM tree is a virtual tree that can be considered as the state of the web page at a certain time.

The operation information may be an operation event.

The request record is used for recording the network request and a return value obtained by the network request. Here, the network request may be a request generated by the terminal device 210 requesting an external resource. The network request can include a website address of a target webpage (typically, a uniform resource locator (url)), and in addition, a request for an external resource during generation of the target webpage and/or a request for an external resource during operation of the target webpage by a user can be included.

According to one possible implementation, the first copy may be a snapshot. In some possible cases, the first copy may also be a backup, and the embodiment of the present application is not intended to display the type of the copy, and may be determined in combination with the actual situation.

According to a feasible implementation manner, the plurality of first copies comprise an initial copy of the target webpage and a plurality of incremental copies relative to the initial copy, and sequence numbers of the copies are increased progressively along with the sequence of creation time of the copies. The later the creation time, the larger the sequence number.

In one example, the initial copy includes the web address of the target web page, the full page content information of the target web page. Further, a network request may also be included. Here, the full page content information indicates all page contents of the target web page. For example, the page content shown in fig. 4 may be restored based on the full amount of page content information.

In one example, the incremental copies are used for recording operation information, page content change information of the target webpage, and further, network requests. The page content change information of the target webpage can be recorded through the virtual DOM tree, and the virtual DOM tree only records the changed part of the page content of the webpage.

Illustratively, a single incremental copy may include operational events.

Illustratively, a single incremental copy may include page content change information.

Illustratively, the single incremental copy may comprise a network request. With respect to fig. 5b, the incremental copy includes a network request for a video file.

For example, assume that an initial copy is created for the web page shown in fig. 4, and then the user performs the operations of fig. 5a to 5f in sequence.

Then for fig. 4, the initial copy includes the web address url1, the DOM tree of the web page shown in fig. 4.

For FIG. 5a, multiple incremental copies may be created, each for recording movement events, including operation type (movement) and mouse position, and subsequently, mouse position and trajectory of movement may be restored based on the movement events. With respect to fig. 5a, the page content has not changed, and at this time, the page content change information is empty.

For FIG. 5b, 4 incremental copies can be created, the 1 st incremental copy is used to record the click event, the click event includes the operation type (click), the position of the click, and then the click position and the operation of the click can be restored based on the click event. The 2 nd incremental copy is used to record page content change information of the video display area 401 (for example, a DOM tree of the video display area, where the tree is at least used to record an internal request requesting the video display page 406, a network request requesting a video file, and the like), the video display page 406 shown in fig. 5b may be restored based on the page content change information, the video file is obtained based on the network request requesting the video file, and the video file is parsed to play a video on the video display page 406. The 3 rd incremental copy is used to record a click event on the video display page 406, including the type of operation (click), the location of the click (delete button "X"), and subsequently, the click location and the operation of the click may be restored based on the click event. The 4 th incremental copy is used to record page content change information (indicating deletion of video display page 406) for video display page 406, followed by deletion of video display page 406 based on the page content change information.

For fig. 5c, 4 incremental copies may be created, the 1 st incremental copy is used to record a click event, the click event includes an operation type (click), a position of the click (position of the product input box), and subsequently, the click position and the operation of the click may be restored based on the click event. The 2 nd incremental copy is used to record page content change information of the product input box 403 (such as a DOM tree of the product input box 403 for recording the input content, and a display style of the input content or an internal request for the display style, etc.), and subsequently, the input content "product a" in the product input box 403 shown in fig. 5c may be restored based on the page content change information. The 3 rd incremental copy is used for recording a click event, the click event comprises an operation type (click) and a click position (position of a search button in a product input box), and subsequently, the click position and the click operation can be restored based on the click event. The 4 th incremental copy is used to record page content change information (such as a DOM tree for recording input content and a network request for requesting the introduction content of product a) of the product introduction display area 404, and then, based on the page content change information, the content in the product input box 403 shown in fig. 5c and the display content of the product introduction display area 404 can be restored.

For FIG. 5d, 2 incremental copies may be created, the 1 st incremental copy is used to record the click event, which includes the type of operation (click), the location of the click, and then the click location and the operation of the click may be restored based on the click event. The 2 nd incremental copy is used to record a DOM tree corresponding to page content change information (for example, title bar (tag 1, tag2, tag 3), the DOM tree being used to record at least a highlight of the request tag2 and a content request at tag 2), and the highlight of tag2 shown in fig. 5d and the content at tag2 shown in the title content display area 405 may be restored based on the page content change information.

For fig. 5e, 2 incremental copies may be created, the 1 st incremental copy is used to record a long press slide event, the long press event includes an operation type (long press slide), a position of the long press (position of the slide control), a position of the slide, and subsequently, the long press position, the operation of the long press, and the operation of the slide may be restored based on the long press slide event. The 2 nd incremental copy is used to record page content change information (a DOM tree including the slide control 402, where the tree is at least used to record page content corresponding to different positions of the slide control 402), and then, based on the page content change information, a change in the page content under the position change of the slide control 402 shown in fig. 5e may be restored.

For fig. 5f, 3 incremental copies can be created, the 1 st incremental copy is used to record the move event, the move event includes the operation type (move), the moved location (tag C2), and subsequently, the moved location can be restored based on the move event. The 2 nd incremental copy is used to record page content change information (e.g., a DOM tree of tab bars (C1, C2, C3, C4) that is used at least to record highlighting of tab C2), and highlighting of C2 shown in fig. 5f may be restored based on the page content change information. The 3 rd incremental copy is used to record the web request (url 2) under tag C2, and web page 2 may be loaded based on the web request (url 2).

It is noted that the full page content information in the initial copy and the page content change information in the incremental copy are both page content information.

In a specific implementation, for a web page for which a copy has not been created, first, an initial copy and a serial number of the web page are created, and then, incremental copies and serial numbers (which are continuously incremented) of the web page are created, so as to obtain a plurality of first copies with sequentially increasing serial numbers for the web page.

In the course of actually recording the copies, the IndexedDB (local index database) stores the copies in chronological order, and the terminal device 210 also determines whether the IndexedDB (local index database) exceeds the storage limit. If the storage limit value is exceeded, whether the website of the sequence number 0 and the website of the sequence number 1 recorded in IndexDB at the last time are the same or not is judged. If so, the initial copy of sequence number 0 is combined with the incremental copy of sequence number 1 to form a new initial copy of sequence number 0. If not, the initial copy of sequence number 0 is deleted directly. Then, the user opens the web page of the target system through the terminal device 210, and the terminal device 210 determines whether the IndexedDB store a copy of the current web page. If so, an incremental copy is created and the sequence number is incremented from the history. If not, an initial copy is created from the sequence number 0, and the sequence number is recorded.

Step 302, when the target webpage has an error, the terminal device 210 creates a second copy of the target webpage and obtains an error record.

Upon an error in the target web page, a second copy of the target web page is created. The second copy may record the address of the target web page, page content information, operational events, request records for network requests, etc. Here, the page content information may be page content change information. For details, see above, they are not described in detail. It should be noted that, in the embodiment of the present application, the second copy when an error occurs is used to record the whole process of the error occurrence, that is, the user operation, the page change information after the user operation, the return value after the network request, and the like need to be completely recorded. Specifically, the second copy is used for recording an operation event under the condition that the page is not reacted after the user operates, and after the user operates, the content displayed on the page is wrong, at this time, the second copy may record the content information of the page, and in some possible implementation manners, a second copy may be additionally created for recording a network request or a request record of the network request; here, when the return value is available based on the network request, the network request may be recorded, and when the return value is not available based on the network request, the request record of the network request needs to be recorded, thereby facilitating the subsequent restoration.

The following describes errors that may be encountered by the target web page.

Illustratively, when accessing a website, the problem of network request being unable to respond may occur, and sometimes the wrong information of 404 may occur, which may generally be caused by that the accessed page does not exist, or the website is input incorrectly, or the terminal device 220 used does not have a network. For example, for fig. 5f, web page 2 is not accessible, and the page content of web page 2 shows "404 is wrong, and the page that you access does not exist"; at this point, the second copy may record the web request for web page 2. For another example, as for fig. 5c, it is assumed that the picture, video, text, etc. of the product a cannot be displayed, and no picture, video, text, etc. is displayed in the product introduction display area 404, at this time, the second copy may record the operation event of the user on the page shown in fig. 5 c.

Illustratively, the internal logic of the target web page may be problematic. For example, for fig. 5b, assuming that the mouse clicks the video play button in the video display area 401, the target web page does not respond, and correspondingly, the second copy may record the click event of the user. For example, in fig. 5d, it is assumed that the mouse can click on the title tag2, tag2 is not highlighted, the title content display area 405 is not updated to the content corresponding to tag2, but is still the content corresponding to tag1, and correspondingly, the second copy can record the click event of the user. For another example, for fig. 5e, assuming that the mouse can long-press the sliding control 402 and move, the terminal device 210 does not implement page movement, and the like, and correspondingly, the second copy can record the long-press sliding event of the user.

It should be noted that the error log includes the error time and the error condition corresponding to the error time. For example, the location clicked by the user has no response, the generated internal request has no response, the generated network request has no response, and the like. It should be noted that, in the embodiment of the present application, the creation time of the second copy and the error record are performed in parallel, optionally, the creation time of the second copy and the error time may be equal, for example, the user does not operate the page to respond, optionally, the error time is earlier than the creation time of the second copy, for example, as shown in fig. 5f, the webpage 2 cannot be displayed, and at this time, the error occurs first, and then the page that cannot be displayed by the webpage 2 is created and recorded. In practical applications, the first copy and the second copy each include a copy creation time, so that a copy corresponding to an error time can be analyzed based on the creation time and the error time, or the second copy is directly associated with an error record.

Step 303, the terminal device 210 determines error information when the plurality of copies and the target web page have errors based on the first copy, the second copy and the error record that have been created.

In practical applications, data can be uploaded when an error occurs once, so that the error information is an error record. Here, the plurality of copies includes the second copy and a number of first copies of a preset period before the second copy.

It should be noted that, if the copies in step 301 and step 302 include request records, the multiple copies may include network request data, and the network request data includes several request records.

According to one possible implementation, the terminal device 210 displays a first interface, such as an upload button, instructing the user to upload data. Illustratively, the first interface is a button, and when the user clicks the button, the second copy and the first copy within a preset time period before the second copy, and error information of the target web page at the time of creation of the second copy may be uploaded to the analysis device 220. Here, the preset time period may be default or user-configurable, for example, a time period before the user operates the first interface to configure the second copy, and then the first copy and the second copy in the time period configured by the user are packaged.

In actual use, the multiple copies and error information are desensitized encrypted data. The terminal device 210 performs desensitization encryption on the first copy and the second copy, and ensures user privacy and data security. Specifically, the recorded copy is scanned by using general sensitive data to judge whether sensitive personal information such as a name, a telephone number, a bank card number and the like exists in the copy. If sensitive data is present, a static data desensitization technique is used. When the sensitive data is larger than two bits, all the data except the first bit and the last bit are covered by the mark, and other cases are directly replaced by the mark. And encrypting the desensitized copy by using an Advanced Encryption Standard (AES) to form a transmittable file.

Step 304, the terminal device 210 sends the multiple copies and error information to the analyzing device 220.

Step 305, the analysis device 220 obtains an image sequence and page reference information of at least one frame in the image sequence based on the plurality of copies, wherein the image sequence is used for recording page contents of at least one first moment and an operation position of a user on a target webpage at least one second moment.

In the embodiment of the application, the page content is restored based on the page content information in the multiple copies, and the operation position is restored based on the operation information, so that the image sequence is obtained. In practical applications, the image sequence may be presented as a restored video, as shown in fig. 5 g.

The following describes a specific process of the analysis device 220 for page content restoration.

In one example, multiple copies include DOM trees at different times, and parsing device 220 renders the DOM trees to restore the page content at the different times. The conversion process is specifically as follows:

each node in the DOM tree is called a vNode, wherein each vNode comprises a vid attribute and a vNode attribute, the vid attribute records a virtual id of the current node, and the vNode records DOM data of the current node. Firstly, traversing the virtual dom in a recursive mode, and extracting and restoring the dom data contained in each vNode into a new dom tree. Secondly, a recursive traversal is used for the dom tree, and each dom node is inserted into the page by methods such as ap pend () and ap pendchild () in Js.

It is noted that, in practical applications, the page content information includes the full amount of page content information and page content variation information. Specifically, a full amount of page content (as a frame) is generated based on the full amount of page content information, then the full amount of page content is locally modified based on the page content change information, and a full amount of page content (as a frame) is obtained again, so that page contents at different times are obtained.

And adding a virtual mouse to the operation position of each of the at least one second moment on the basis of the page contents of each of the plurality of first moments, thereby constructing an image sequence. It should be understood that the first time is the time of creation of the page content information in the multiple copies. The second time is a time of the user operation recorded in the operation information in the plurality of copies.

The following describes a procedure of user operation restoration.

In one example, the multiple copies include mouse movement trajectory data, i.e., movement events, and the analysis device 220 refreshes the web page mouse position at certain intervals to restore the mouse movement process. The mouse movement trajectory data is a continuous array (each array representing a mouse position), with old trajectories at the beginning of the array and new trajectories at the end of the array. The specific treatment process is as follows:

the analysis device 220 starts to fetch data from the first data of the mouse movement track data, the fetched data is { x:220, y. In practical application, a timer is set, and data in the mouse movement track data is executed circularly at specific intervals until the mouse movement track is restored; wherein the interval is typically 50 milliseconds. It is worth noting that the mouse moving track can be used for analyzing the reason why the user moves the mouse and the content in the webpage which the user may need to find, so that the layout of the webpage can be reasonably set, and the user experience is improved.

It should be noted that the mouse movement track herein can be understood as a movement track of the mouse on the page content of the target web page, and no operation is performed, for example, the mouse movement track T shown in fig. 5 a.

Here, the page reference information may include a rendering record, an operation record, and/or error information. Here, the operation record includes an operation position and an operation type, and can be obtained from operation information recorded in the plurality of copies. The rendering record is information recorded in a re-rendering process based on the page content information. It should be noted that, the operation records a frame of image at the second time in the corresponding image sequence, and the error information corresponds to the first time or a frame of image at the second time in the image sequence, for example, when the error information is generated in the page loading process, the error information corresponds to the first time, and the page content at the first time is the content after page loading; when the error message is generated at the time of the user operation, the error message corresponds to a second time of the user operation.

Further, if the multiple copies include network request data, the page reference information may further include a request record. Here, a request is made to record a frame of image corresponding to a first time in the image sequence, for example, when a network request is generated in a page loading process, the request record of the network request corresponds to the first time, and the page content at the first time is the content after page loading; when the network request is generated in the process of operating the page content by the user and the page content changes, the request record of the network request corresponds to a first moment, and the page content at the first moment is the content after the page changes.

For example, assuming that the user operates in the sequence of fig. 5a, 5b, 5c, 5d, 5e, and 5f and fig. 5f cannot load the web page 2, at this time, the analyzing device 220 may restore the images 5a to 5f based on the multiple copies, and may record the images 5a to 5f as videos in time sequence, and record request records, operation records, and/or error information of a plurality of network requests corresponding to each frame in the videos, so as to facilitate the user to view. More specifically, in fig. 5f, the page reference information corresponding to the web page 2 includes error information and a request record. The page operation information corresponding to the web page 1 in fig. 5f includes an operation record, where the operation record includes an operation position: the position of C2 and the operation type are click.

Further, the page reference information may also display a loading time of the target web page, a time in response to a user operation (e.g., a time from the user operation to the change of the page), and the like.

In summary, the analysis device 220 decrypts the received multiple copies and the error information, and performs web page restoration according to the recording time of the multiple copies. In addition, the analysis device 220 may form a video resource reservation for the restored target web page, and meanwhile reserve the page reference information corresponding to each frame in the video, so as to facilitate subsequent viewing. The video is used for reflecting the change situation of the page content of the target webpage along with time, the operation of the user, the page content of the target webpage after the operation of the user and the like, and the page reference information is combined on the basis of the video, so that the subsequent webpage error analysis and positioning are facilitated.

Step 306, the analyzing device 220 displays the image sequence and the page reference information of the current frame in the image sequence.

As shown in fig. 5g, the analysis device 220 displays a restored video formed by the image sequence, and displays the page reference information of the current frame in the process of displaying the restored video. Here, the current frame is a current picture in the image sequence.

In one example, when the page reference information includes a request record, the analysis device 220 displays the network request and the result of performing the network request in a specific area in the web page. The specific treatment process is as follows:

when the request record is taken, the analysis device 220 sorts the network request in the request record and the return value of the network request to be executed, the return values are processed into a uniform format { method: web page diagnosis, status: web page diagnosis, payload: web page diagnosis, requ est: web page diagnosis, response: web page diagnosis }, and then the processed data are inserted into a region of a web page as a text to display the result of the network request, so that the analysis by a subsequent engineer is facilitated. Wherein, method represents a method of network request, such as get; status indicates whether the network request has been successful, has revealed the exact reason for the network request failure; payload represents the percentage of the effective load in the protocol message of the network request in the message; the request represents a parameter of the network request, namely a request parameter; response indicates response information after the network request is executed.

In the embodiment of the application, data such as page content, user operation and error information of the webpage at different moments are recorded in a circulating mode, so that relevant information of the webpage before an error occurs and before the error occurs can be recorded completely, the data are rendered into the webpage again, the page content of the webpage at different moments in a period of time before the error occurs and the error is restored, and the user operation and the error information are beneficial to positioning of complex errors by engineers.

In order to enable the engineer to quickly locate the error occurring in the web page, the analysis device 220 needs to restore the error to be consistent with the actual situation of the terminal device 210 as much as possible, i.e. the analysis device 220 needs to restore the error on a device similar to the terminal device 210.

On the basis of the steps 301 to 305 shown in fig. 3, as shown in fig. 6, the method includes the following steps:

step 601, the terminal device 210 acquires device hardware information; wherein the device hardware information indicates at least a condition of hardware of the processing target web page in the terminal device 210.

Here, the device hardware information may include screen resolution, network speed, machine capability of the terminal device 210. Here, the machine performance may include several performance parameters, such as the number of CPU cores, the frequency of the CPU, the capacity of the memory, and the like.

Step 602, the terminal device 210 acquires browser information; wherein the browser information includes a plug-in and/or a runtime environment of a browser that processes the target web page.

Here, the browser information may include a plug-in and/or a runtime environment of the browser. The runtime environment may include, among other things, a version of the operating system, a version of the browser, and so on. The browser plug-in is a tool for adding new functions based on the original functions of the browser, and commonly includes a Flash plug-in, a RealPlayer plug-in, an MMS plug-in, a MIDI staff plug-in, an ActiveX plug-in, and the like, and different plug-ins may cause different influences on the operation of the browser, so that the plug-in of the browser needs to be considered.

The corresponding step 304 comprises the following steps:

step 3041, the terminal device 210 sends the multiple copies, error information, device hardware information, and browser information to the analysis device 220.

It should be noted that, in practical applications, the data sent to the analysis device 220 should be encrypted to ensure data security.

Correspondingly, step 305 includes at least the following steps:

step 3051, the analyzing device 220 constructs a virtual device of the first device based on the device hardware information, and obtains the image sequence and the page reference information of at least one frame in the image sequence on the virtual device based on the browser information and the multiple copies.

In practical application, virtual equipment of the first equipment can be constructed based on the equipment hardware information, an operating environment of a browser can be constructed on the virtual equipment based on the browser information, the adaptive browser, an operating system and a plug-in of the browser are installed, and then the results of page contents, user operations and network requests of a plurality of copy reduction target webpages at different moments are processed through the installed plug-ins of the operating system, the browser and the browser, so that the actual situation of the target webpage can be simulated more truly, and webpage diagnosis can be realized more accurately.

Correspondingly, step 306 includes at least the following steps:

step 3061, the analyzing device 220 displays the image sequence, the page reference information of the current frame in the image sequence, the device hardware information, and the browser information.

As shown in fig. 5g, the analysis device 220 displays the restored video formed by the image sequence, device hardware information, and browser information, and displays the page reference information of the current frame in the course of displaying the restored video.

In the scheme, the virtual equipment of the adaptive terminal equipment is constructed, and the actual running condition of the browser is restored on the virtual equipment, so that the related information of the webpage before the error occurs and the error is restored more accurately, and the error positioning of complex problems is facilitated.

It should be noted that, in practical applications, for a target web page in a client of a target application, a large number of terminal devices 210 may use the client of the target application, and then the analysis device 220 receives multiple copies and error information about the target web page fed back by multiple terminal devices 210, so as to obtain massive data, and facilitate subsequent error analysis and positioning of the target web page. It should be noted that a large number of terminal devices 210 may include mobile phones, computers, and the like, and therefore, the behavior of the terminal devices 210 on different screen resolutions of the target web page may be comprehensively analyzed.

In addition, the terminal device 210 may be referred to as a first device, and the analysis device 220 may be referred to as a second device.

In summary, in practical applications, the embodiment of the application enables a user to record the abnormal situation of the product webpage end in real time and feed the abnormal situation back to research and development, and an engineer performs playback restoration by using the method provided by the embodiment of the application to know the problem location of each time point in the user operation process, so that the problem can be located and repaired more quickly, and the user experience is improved.

The method and the device can be used for communication between internal test research and development, can enable the development to be more simple to locate problems, do not need to frequently borrow test environments, save a large amount of communication cost and increase efficiency.

According to the embodiment of the application, the problems of feedback of users/services/maintenance/one line and the like can be sorted to form a novel software maintenance case base, so that the writing workload of the case base is greatly reduced, cases can be rapidly output, and the user experience is improved.

The embodiment of the application can quickly form novel simulation data (namely, the video formed after the webpage is restored), and a user can visually check dynamic data.

Based on the same concept as the method embodiment of the application, the embodiment of the application also provides the electronic equipment. The electronic device may be the terminal device 210 described above, or the analysis device 220. Fig. 7 is a schematic structural diagram of an electronic device according to an embodiment of the present application.

As shown in fig. 7, the electronic device 700 includes a processor 701, a memory 702, and a network interface 703.

The Processor 701 may be a Central Processing Unit (CPU), other general purpose Processor, a Digital Signal Processor (DSP), an Application Specific Integrated Circuit (ASIC), a Field Programmable Gate Array (FPGA) or other Programmable logic device, discrete Gate or transistor logic, discrete hardware components, etc. A general purpose processor may be a microprocessor or the processor may be any conventional processor or the like.

The memory 702 may be either volatile memory or nonvolatile memory, or may include both volatile and nonvolatile memory. The non-volatile memory may be a read-only memory (ROM), a Programmable ROM (PROM), an Erasable PROM (EPROM), an Electrically Erasable PROM (EEPROM), or a flash memory. Volatile memory can be Random Access Memory (RAM), which acts as external cache memory. By way of example, but not limitation, many forms of RAM are available, such as static random access memory (static RAM, SRAM), dynamic Random Access Memory (DRAM), synchronous Dynamic Random Access Memory (SDRAM), double data rate synchronous dynamic random access memory (DDR SDRAM), enhanced synchronous SDRAM (ESDRAM), synchronous Link DRAM (SLDRAM), and direct bus RAM (DR RAM).

Illustratively, a computer program may be stored on the memory 702, and when the processor 701 executes the computer program, the functions implemented by the terminal device 210 in the foregoing embodiments of the web page diagnosis method are implemented, such as, for example, implementing steps 301 to 304 shown in fig. 3; alternatively, the steps implemented by the analysis device 220 in the above-described embodiment of the web page diagnosis method are implemented, such as, for example, implementing step 305 shown in fig. 3. Alternatively, the processor 701 implements the functions of the modules in the above device embodiments when executing the computer program. Illustratively, the computer program may be divided into one or more modules/units, which may be a series of computer program instruction segments capable of performing specific functions, and the one or more modules/units are stored in the memory 702 and executed by the processor 701 to perform the steps implemented by the terminal device 210 in the above-described embodiments of the web page diagnosis method. Or the functions implemented by the analysis device 220 in the above-described embodiments of the web page diagnosis method.

The network interface 703 is used for transmitting and receiving data, for example, for transmitting data processed by the processor 701 to another electronic device, or for receiving data transmitted by another electronic device.

Of course, for simplicity, only some of the components of the electronic device 700 relevant to the present application are shown in fig. 7, omitting components such as buses, input/output interfaces, and the like. In addition, electronic device 700 may include any other suitable components depending on the particular application. In addition, the electronic device may be a desktop computer, a notebook, a palm computer, a cloud server, or other computing devices. Those skilled in the art will appreciate that fig. 7 is merely an example of an electronic device 700 and does not constitute a limitation of electronic devices and may include more or fewer components than shown, or some components may be combined, or different components, e.g., the electronic device may also include input devices, output devices, network access devices, buses, etc. The input device may be, for example, a keyboard, a mouse, or the like. The output device may illustratively output various information to the outside, which may include, for example, a display, speakers, a printer, and a communication network and its connected remote output devices, among others.

In addition to the above methods, apparatuses, and electronic devices, embodiments of the present application may also provide a computer program product including computer program instructions, which, when executed by a processor, cause the processor to execute the steps in the web page diagnosis method of various embodiments of the present application described in the above "method" section of this specification. The computer program product may be written in any combination of one or more programming languages, including an object oriented programming language such as Java, C + +, or the like, and conventional procedural programming languages, such as the "C" programming language or similar programming languages, for performing the operations of embodiments of the present application. Wherein the computer program code may be in source code form, object code form, an executable file or some intermediate form, etc. The computer program code may execute entirely on the user's computing device, partly on the user's device, as a stand-alone software package, partly on the user's computing device and partly on a remote computing device, or entirely on the remote computing device or server.

Furthermore, the present application may also provide a computer-readable storage medium, on which computer program instructions are stored, and when the computer program instructions are executed by a processor, the processor executes the steps in the web page diagnosis method according to various embodiments of the present disclosure described in the above "method" section of this specification. The computer-readable storage medium may take any combination of one or more readable media. The readable medium may be a readable signal medium or a readable storage medium. A readable storage medium may include, for example, but is not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or a combination of any of the foregoing. More specific examples (a non-exhaustive list) of the readable storage medium include: an electrical connection having one or more wires, a portable disk, a hard disk, a Random Access Memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing. It should be noted that the computer readable medium may contain content that is subject to appropriate increase or decrease as required by legislation and patent practice in jurisdictions, for example, in some jurisdictions, computer readable media does not include electrical carrier signals and telecommunications signals as is required by legislation and patent practice.

In the above embodiments, the descriptions of the respective embodiments have respective emphasis, and reference may be made to the related descriptions of other embodiments for parts that are not described or illustrated in a certain embodiment.

It should be understood that, the sequence numbers of the steps in the foregoing embodiments do not imply an execution sequence, and the execution sequence of each process should be determined by its function and inherent logic, and should not constitute any limitation to the implementation process of the embodiments of the present application.

The foregoing describes the general principles of the present disclosure in conjunction with specific embodiments, however, it is noted that the advantages, effects, etc. mentioned in the present disclosure are merely examples and are not limiting, and should not be considered essential to the various embodiments of the present disclosure. Furthermore, the foregoing disclosure of specific details is for the purpose of illustration and description and is not intended to be limiting, since the disclosure will be described in detail with reference to specific details.

The block diagrams of devices, apparatuses, systems referred to in this disclosure are only given as illustrative examples and are not intended to require or imply that the connections, arrangements, configurations, etc. must be made in the manner shown in the block diagrams. These devices, apparatuses, devices, systems may be connected, arranged, configured in any manner, as will be appreciated by those skilled in the art. Words such as "including," "comprising," "having," and the like are open-ended words that mean "including, but not limited to," and are used interchangeably herein. The words "or" and "as used herein mean, and are used interchangeably with, the word" and/or, "unless the context clearly dictates otherwise. The word "such as" is used herein to mean, and is used interchangeably with, the phrase "such as but not limited to".

It is also noted that in the devices, apparatuses, and methods of the present disclosure, each component or step can be decomposed and/or recombined. These decompositions and/or recombinations are to be considered equivalents of the present disclosure.

The foregoing description has been presented for purposes of illustration and description. Furthermore, this description is not intended to limit embodiments of the disclosure to the form disclosed herein. While a number of example aspects and embodiments have been discussed above, those of skill in the art will recognize certain variations, modifications, alterations, additions and sub-combinations thereof.

It is to be understood that the various numerical references referred to in the embodiments of the present application are merely for descriptive convenience and are not intended to limit the scope of the embodiments of the present application.

Claims (10)

1. A webpage diagnosis method is applied to a first device and comprises the following steps:

acquiring a plurality of copies of a target webpage and error information when an error occurs; the multiple copies comprise a first copy before an error occurs in the target webpage and a second copy when the error occurs in the target webpage; the multiple copies are used for recording page content information and operation information of the target webpage; the operation information indicates the operation on the target webpage, and the page content information is used for generating page content;

and sending the multiple copies and the error information to a second device so as to enable the second device to generate an image sequence based on the multiple copies, wherein the image sequence is used for recording the page content of the target webpage at least one first moment and the operation position of the user on the target webpage at least one second moment.

2. The method of claim 1, further comprising:

acquiring equipment hardware information; wherein the device hardware information indicates at least a condition of hardware in the first device that processes the target web page;

acquiring browser information; wherein the browser information comprises a plug-in and/or a running environment of a browser processing the target web page;

sending the device hardware information and the browser information to the second device to enable the second device to construct a virtual device of the first device based on the device hardware information, and generating an image sequence on the virtual device based on the browser information and the multiple copies.

3. The method of claim 1, further comprising:

displaying the first interface; wherein the first interface is configured to instruct uploading of the plurality of copies and the error information to the second device.

4. The method of claim 1, wherein the plurality of copies includes an initial copy of the target web page and an incremental copy of the target web page relative to the initial copy; and/or

The multiple copies are desensitized copies; and/or the presence of a gas in the atmosphere,

the multiple copies further include network request data including at least one request record including the network request for the target web page and a return value of the network request to cause the second device to display the request record.

5. A webpage diagnosis method is applied to a second device and comprises the following steps:

receiving a plurality of copies of a target webpage sent by first equipment and error information when an error occurs; the plurality of copies comprise at least one copy before an error occurs in the target webpage and a copy when the error occurs; the multiple copies are used for recording page content information and operation information of the target webpage; the operation information indicates the operation of the user on the target webpage, and the page content information is used for generating page content;

and generating an image sequence based on the plurality of copies, wherein the image sequence is used for recording the page content of the target webpage at least one first moment and the operation position of the user on the target webpage at least one second moment.

6. The method of claim 5, further comprising:

receiving device hardware information sent by the first device; wherein the device hardware information indicates at least a condition of hardware in the first device that processes the target web page;

receiving browser information sent by the first equipment; wherein the browser information comprises a plug-in and/or a running environment of a browser processing the target web page;

said generating a sequence of images based on said plurality of copies comprises:

and constructing a virtual device of the first device based on the device hardware information, and generating an image sequence on the virtual device based on the browser information and the plurality of copies.

7. The method of claim 5, further comprising:

providing a first interface; wherein the first interface is configured to instruct the first device to upload the plurality of copies and error information.

8. The method of claim 5, wherein the plurality of copies includes an initial copy of the target web page and an incremental copy of the target web page relative to the initial copy; and/or the presence of a gas in the gas,

the multiple copies further comprise web request data comprising at least one request record comprising a web request for the target web page and a return value of the web request; and/or the presence of a gas in the gas,

the method further comprises the following steps:

determining page reference information corresponding to at least one frame in the image sequence based on the plurality of copies; wherein the page reference information comprises an operation record, a request record and/or error information; the request record comprises a network request for the target webpage and a return value of the network request, and the operation record comprises an operation position and/or an operation type;

and displaying the image sequence and page reference information corresponding to at least one frame in the image sequence.

9. A web page diagnostic device comprising a processor and a memory; wherein, the first and the second end of the pipe are connected with each other,

the memory is used for storing programs;

the processor is configured to execute the memory-stored program, and when the memory-stored program is executed, to perform the method of any of claims 1 to 4, or the method of any of claims 5 to 8.

10. A web page diagnostic system comprising a first device and a second device; wherein the first device is adapted to perform the method of any of claims 1 to 4; the second device is adapted to perform the method of any of claims 5 to 8.

Images