CN112835776A - Page event reproduction method, page event acquisition method, page event reproduction device and electronic equipment - Google Patents
Page event reproduction method, page event acquisition method, page event reproduction device and electronic equipment Download PDFInfo
- Publication number
- CN112835776A CN112835776A CN202110198706.3A CN202110198706A CN112835776A CN 112835776 A CN112835776 A CN 112835776A CN 202110198706 A CN202110198706 A CN 202110198706A CN 112835776 A CN112835776 A CN 112835776A
- Authority
- CN
- China
- Prior art keywords
- event information
- key frame
- event
- target page
- 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.)
- Pending
Links
- 238000000034 method Methods 0.000 title claims abstract description 80
- 238000012544 monitoring process Methods 0.000 claims description 17
- 238000009877 rendering Methods 0.000 claims description 7
- 230000008569 process Effects 0.000 abstract description 11
- 238000010586 diagram Methods 0.000 description 10
- 230000009471 action Effects 0.000 description 6
- 230000006870 function Effects 0.000 description 4
- 230000006399 behavior Effects 0.000 description 3
- 230000003993 interaction Effects 0.000 description 3
- 238000011160 research Methods 0.000 description 3
- 238000012545 processing Methods 0.000 description 2
- 238000006467 substitution reaction Methods 0.000 description 2
- 230000009286 beneficial effect Effects 0.000 description 1
- 238000004590 computer program Methods 0.000 description 1
- 230000007812 deficiency Effects 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 230000008439 repair process Effects 0.000 description 1
- 238000013522 software testing Methods 0.000 description 1
- 238000012360 testing method Methods 0.000 description 1
- 230000001960 triggered effect Effects 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F11/00—Error detection; Error correction; Monitoring
- G06F11/30—Monitoring
- G06F11/34—Recording or statistical evaluation of computer activity, e.g. of down time, of input/output operation ; Recording or statistical evaluation of user activity, e.g. usability assessment
- G06F11/3438—Recording or statistical evaluation of computer activity, e.g. of down time, of input/output operation ; Recording or statistical evaluation of user activity, e.g. usability assessment monitoring of user actions
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
- G06F3/0483—Interaction with page-structured environments, e.g. book metaphor
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
Landscapes
- Engineering & Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- Computer Hardware Design (AREA)
- Quality & Reliability (AREA)
- Debugging And Monitoring (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
The application provides a page event reproduction method, a collection method, a device and an electronic device, wherein the page event reproduction method comprises the following steps: acquiring a key frame of a target page, wherein the key frame comprises hypertext markup language information related to display in the target page; determining interface elements of the target page according to the key frames; acquiring event information corresponding to the key frame; drawing a user operation track and/or displaying event information in the interface element according to the event information; and drawing the event reproduction video of the target page according to the interface elements. And displaying the operation track of the user or displaying the event information on the event reproduction video according to the event information generated on the target page. Therefore, the process of page recurrence can show richer and more real contents related to the event information, so that developers can more accurately determine the problems of the page.
Description
Technical Field
The application relates to the technical field of software testing, in particular to a page event reproduction method, a page event collection method, a page event reproduction device and electronic equipment.
Background
In the page testing process, the events (such as user operation events or page fault events) generated on a certain page are reproduced, so that a developer can be helped to determine the problems existing in the page and improve or repair the problems. In some solutions for page event reproduction, data acquisition point locations (buried points) are manually set in advance in an execution file of a page, user behavior data are collected when a specific event is generated, and then the operation process of a user is reproduced by combining screenshots of the page. However, these methods often have low richness of data that can be acquired or presented, and cannot accurately reproduce the behaviors of the user and the triggered events.
Disclosure of Invention
In order to overcome the above-mentioned deficiencies in the prior art, an object of the present application is to provide a page event reproduction method, comprising:
acquiring a key frame of a target page, wherein the key frame comprises hypertext markup language information related to display in the target page;
determining interface elements of the target page according to the key frames;
acquiring event information corresponding to the key frame;
drawing a user operation track in the interface element according to the event information and/or displaying the event information;
and drawing an event recurrence video of the target page according to the interface element.
In one possible implementation, the method further includes:
acquiring a key frame of the target page, wherein the key frame comprises a timestamp when the key frame is acquired;
acquiring event information generated on the target page, wherein the event information comprises a timestamp when the event information is monitored;
and establishing the corresponding relation between the key frames and the event information according to the time stamps of the key frames and the event information.
In a possible implementation manner, the step of establishing a correspondence between the key frame and the event information according to the timestamp includes:
for each piece of event information, determining a key frame with a timestamp closest to the event information as a key frame corresponding to the event information.
In one possible implementation, the key frame includes a document object model and a cascading style sheet of the target page.
In a possible implementation manner, the step of drawing a user operation track in the interface element according to the event information and/or displaying the event information includes:
drawing corresponding operation identification in the interface element according to the operation type and the operation position of the user operation event in the event information; and/or
And adding an information display area in the interface element, and displaying the event information in the information display area.
In a possible implementation manner, the step of drawing a corresponding operation identifier in the interface element according to the operation type and the operation position of the user operation in the event information includes:
and drawing an operation identifier corresponding to a user operation track in the interface element according to the operation types and the operation positions in the plurality of continuous event information.
In a possible implementation manner, the key frame further includes system operation data when the key frame is collected; the method further comprises the following steps:
and adding an information display area in the interface element, and displaying the system operation data in the information display area.
Another object of the present application is to provide a page event collecting method, including:
collecting a key frame of the target page, and adding a time stamp when the key frame is collected to the key frame; the key frame comprises hypertext markup language information related to display in the target page;
monitoring and recording event information generated on the target page, and adding a timestamp for monitoring the event information to the event information.
In a possible implementation manner, the step of collecting the key frames of the target page according to a set period includes:
collecting the key frames of the target page according to a set period through a first Service Worker;
the step of monitoring and recording the event information generated on the target page comprises the following steps:
and monitoring and recording the event information generated on the target page through a second Service Worker.
In one possible implementation, the method further includes:
and establishing the corresponding relation between the key frame and the event information according to the timestamp.
Another object of the present application is to provide a page event reproduction apparatus, including:
the system comprises a key frame acquisition module, a key frame acquisition module and a display module, wherein the key frame acquisition module is used for acquiring a key frame of a target page, and the key frame comprises hypertext markup language information related to display in the target page;
the pre-rendering module is used for determining interface elements of the target page according to the key frames;
the event acquisition module is used for acquiring event information corresponding to the key frames;
the redrawing module is used for drawing a user operation track in the interface element according to the event information and/or displaying the event information;
and the output module is used for drawing the event recurrence video of the target page according to the interface element.
Another object of the present application is to provide a page event collecting method, including:
the first acquisition module is used for acquiring the key frames of the target page and adding timestamps when the key frames are acquired to the key frames; the key frame comprises hypertext markup language information related to display in the target page;
and the second acquisition module is used for monitoring and recording the event information generated on the target page, and adding a timestamp for monitoring the event information to the event information.
It is another object of the present application to provide an electronic device comprising a processor and a machine-readable storage medium storing machine-executable instructions that when executed by the processor implement a page event rendering method.
Another object of the present application is to provide a machine-readable storage medium storing machine-executable instructions, which when executed by one or more processors, implement the page event collecting method or the page event reproducing method provided by the present application.
Compared with the prior art, the method has the following beneficial effects:
according to the page event reproduction method, the acquisition device and the electronic equipment, the event reproduction video of the target page is obtained by acquiring the hypertext markup language information related to display in the target page, and the operation track of a user or the event information is displayed on the event reproduction video according to the event information generated on the target page. Therefore, the process of page recurrence can show richer and more real contents related to the event information, so that developers can more accurately determine the problems of the page.
Drawings
In order to more clearly illustrate the technical solutions of the embodiments of the present application, the drawings that are required to be used in the embodiments will be briefly described below, it should be understood that the following drawings only illustrate some embodiments of the present application and therefore should not be considered as limiting the scope, and for those skilled in the art, other related drawings can be obtained from the drawings without inventive effort.
Fig. 1 is one of schematic diagrams of a page event collection and reproduction scenario provided in an embodiment of the present application;
fig. 2 is a second schematic diagram of a page event collection and reproduction scenario provided in the embodiment of the present application;
fig. 3 is a schematic flowchart illustrating steps of a page event collection method according to an embodiment of the present application;
fig. 4 is a schematic flowchart illustrating steps of a page event recurrence method according to an embodiment of the present application;
fig. 5 is a second schematic flowchart illustrating steps of a page event recurrence method according to an embodiment of the present application;
fig. 6 is a third schematic flowchart illustrating a step of a page event recurrence method according to an embodiment of the present application;
fig. 7 is a schematic diagram of an electronic device provided in an embodiment of the present application;
fig. 8 is a schematic functional module diagram of a page event collecting device according to an embodiment of the present application;
fig. 9 is a functional module schematic diagram of a page event recurrence device according to an embodiment of the present application.
Icon: 100-an electronic device; 120-a machine-readable storage medium; 130-a processor; 140-page event reproduction means; 141-key frame acquisition module; 142-a pre-rendering module; 143-event acquisition module; 144-redraw module; 145-output module; 150-page event collection means; 151-first acquisition module; 152-second acquisition module.
Detailed Description
In order to make the objects, technical solutions and advantages of the embodiments of the present application clearer, the technical solutions in the embodiments of the present application will be clearly and completely described below with reference to the drawings in the embodiments of the present application, and it is obvious that the described embodiments are some embodiments of the present application, but not all embodiments. The components of the embodiments of the present application, generally described and illustrated in the figures herein, can be arranged and designed in a wide variety of different configurations.
Thus, the following detailed description of the embodiments of the present application, presented in the accompanying drawings, is not intended to limit the scope of the claimed application, but is merely representative of selected embodiments of the application. All other embodiments, which can be derived by a person skilled in the art from the embodiments given herein without making any creative effort, shall fall within the protection scope of the present application.
It should be noted that: like reference numbers and letters refer to like items in the following figures, and thus, once an item is defined in one figure, it need not be further defined and explained in subsequent figures.
In the description of the present application, it is noted that the terms "first", "second", "third", and the like are used merely for distinguishing between descriptions and are not intended to indicate or imply relative importance.
In the description of the present application, it is further noted that, unless expressly stated or limited otherwise, the terms "disposed," "mounted," "connected," and "connected" are to be construed broadly, e.g., as meaning either a fixed connection, a removable connection, or an integral connection; can be mechanically or electrically connected; they may be connected directly or indirectly through intervening media, or they may be interconnected between two elements. The specific meaning of the above terms in the present application can be understood in a specific case by those of ordinary skill in the art.
The present embodiment provides a page event collecting method and a page event recurring method, where the page event collecting method may be used to collect a key frame related to displaying a target page when the target page is loaded and event information generated on the target page, where the event information may include user operation behavior data or events such as data interaction, alarm, and crash generated by triggering on the target page. The page event reproduction method can be used for visually reproducing the events on the target page according to the key frames and the event information.
In a possible implementation manner, the same electronic device may execute the page event collecting method and the page event reproducing method. For example, referring to fig. 1, the electronic device 100 may collect and store the key frames and the event information of the target page, and then reproduce the event generated on the target page according to the collected information.
In another possible implementation manner, the page event collecting method and the page event recurring method may be performed by different devices. For example, referring to fig. 2, the page event collection method may be performed by the electronic device 100a, and the page event reproduction method may be performed by the electronic device 100 b. The electronic device 100a may be a terminal of a user, the electronic device 100b may be a terminal of a developer, and information collected by the electronic device 100a may be transmitted to the electronic device 100b through a network, so that the developer may reproduce a page problem occurring on the electronic device 100a of the user on the electronic device 100 b.
The page event collection method and the page event reproduction method respectively include various steps to be elaborated below.
Referring to fig. 3, fig. 3 is a schematic flowchart illustrating a step flow of the page event collecting method according to the present embodiment, where the method may include the following steps.
Step S110, collecting the key frame of the target page, and adding a time stamp when the key frame is collected to the key frame.
The key frame may include hypertext Markup Language (HTML) information associated with the display in the target page. For example, the key frame may include a Document Object Model (DOM) and a Cascading Style Sheets (CSS) of the target page.
Optionally, in this embodiment, when the key frame is collected, system operation data (e.g., information such as memory occupation, CPU occupation, GPU occupation, and network occupation) of a terminal (e.g., a collection terminal) that loads the target page may also be collected and recorded, and the information is added to the key frame.
Step S120, monitoring and recording event information generated on the target page, and adding a timestamp for monitoring the event information to the event information.
In this embodiment, the event information may include a generation location and an event parameter of an event such as an operation (for example, an operation type, an operation location, or other operation parameters) generated by performing an operation on the target page, data interaction, page crash, page alarm, and the like.
In some possible implementation manners, for the target page, a first Service Worker may be started to execute the action of periodically collecting the key frames in step S110, and a second Service Worker may be started to execute the action of monitoring and recording the event information in step S120. Optionally, the capturing of the key frame may be performed once immediately when an event is detected to be generated on the target page while the key frame is periodically captured at regular time.
In some possible implementation manners, the corresponding relationship between the key frame and the event information may be established according to the timestamp in a page event acquisition process; and establishing the corresponding relation between the key frame and the event information according to the timestamp in the process of the subsequent page event recurrence.
According to the page event acquisition method provided by the embodiment, manual point burying is not needed, the difficulty of data acquisition is reduced by continuously acquiring the key frames and monitoring event information, data acquisition is not needed to be performed when a page fault occurs, and the acquisition of relevant data before and after the page fault occurs is benefited, so that better data support can be provided for problem analysis of a target page by research personnel.
Referring to fig. 4, fig. 4 is a schematic flowchart illustrating steps of a page event reproduction method according to the present embodiment, where the method includes the following steps.
Step S210, a key frame of the target page is obtained.
In this embodiment, the key frame includes HTML information related to display in the target page. For example, the key frame may include the DOM and CSS of the target page.
Step S220, determining interface elements of the target page according to the key frames.
In this embodiment, interface elements required when the target page needs to be drawn may be determined according to the key frames. For example, pre-rendering is performed according to the DOM and CSS of the target page, and a corresponding canvas element is obtained.
Step S230, acquiring event information corresponding to the key frame.
In this embodiment, the event information may include a generation location and an event parameter of an event such as an operation (for example, an operation type, an operation location, or other operation parameters) generated by performing an operation on the target page, data interaction, page crash, and page alarm.
Step S240, drawing a user operation track in the interface element according to the event information and/or displaying the event information.
And step S250, drawing an event recurrence video of the target page according to the interface element.
Compared with the method of acquiring data through a buried point and combining screenshot display in the prior art, the scheme provided by the embodiment redraws the target page according to the hypertext markup language information related to display, and displays the event information in the redrawing process, so that richer data information related to the event generated on the target page can be displayed.
Optionally, if the event information includes user operation time (e.g., clicking and dragging operations), in step S240, a corresponding operation identifier may be drawn in the interface element according to an operation type and an operation position of the user operation event.
If the event information does not include the user operation time, an information display area can be added to the interface element, and then the event information is displayed in the information display area.
In some possible implementations, the key frames and the event information in steps S210 and S230 may come from the collecting actions of steps S110 and S120 shown in fig. 3. In this case, the acts of collecting the key frames and collecting the event information may not occur simultaneously. Therefore, in this embodiment, before step S210, each obtained key frame and each obtained event information may also be matched.
For example, referring to fig. 5, the following steps may be further included before step S210.
Step S310, obtaining a key frame of the target page, wherein the key frame comprises a time stamp when the key frame is collected.
Step S320, obtaining event information generated on the target page, where the event information includes a timestamp when the event information is monitored.
Step S330, establishing a corresponding relationship between the key frames and the event information according to the time stamps of the key frames and the event information.
Alternatively, in step S330, for each of the event information, a key frame temporally closest to the event information may be determined as a key frame corresponding to the event information according to the timestamp. The timestamp of the key frame may then be replaced with the timestamp of the event information.
After determining the correspondence between the key frames and the event information, a plurality of key frames may be sequentially stored in a stack. The data is then read from the stack in turn. And performing pre-rendering on the read key frames according to the key frames to obtain corresponding canvas elements. Then, it is checked whether the currently read data is the last data in the stack, and if not, a sequence attribute is added to the canvas element. And drawing a user operation track on the canvas element and/or displaying the event information according to the sequence attribute aiming at the read event information. And obtaining the canvas elements after redrawing and storing the canvas elements into a cache. And after all the data in the stack are read out and drawing is finished, generating an event recurrence video of the target page according to all the redrawing data in the cache.
In some possible implementations, since the number of the acquired key frames may be greater than the number of the event information (for example, no event is generated on the target page for a long time), for a key frame that does not match the event information, an event reproduction video may be directly drawn according to the interface element determined by the key frame.
For example, referring to fig. 6, before step S230, step S410 may be further included.
Step S410, detecting whether there is event information corresponding to the key frame. If yes, go to step S230; if not, go to step S250.
In order to clearly show the context of multiple operations of the user, in some possible implementations, an operation identifier corresponding to the operation trajectory of the user is drawn in the interface element according to the operation type and the operation position in the multiple continuous event information. For example, a plurality of operation positions may be determined according to a plurality of consecutive user operation events, and a pointing line or an arrow may be drawn between the plurality of operation positions according to a generation order of the plurality of the user operation events to represent an operation order or an operation trajectory of the user.
In some possible implementation manners, when the key frame is collected, system operation data (e.g., information such as memory occupation, CPU occupation, GPU occupation, and network occupation) of the terminal that loads the target page may also be collected at the same time.
After determining the interface element of the target page according to the key frame, an information display area can be added to the interface element, and the system operation data is displayed in the information display area. Therefore, research personnel can clearly acquire more operation environment information when reproducing the target page, and the problem of determining the target page by the research personnel is facilitated.
The present embodiment also provides an electronic device 100, and the electronic device 100 may be configured to execute the page event collecting method shown in fig. 4 or the page event reproducing method shown in fig. 5. In this embodiment, the electronic device 100 may be, but is not limited to, a server, a Personal Computer (PC), and the like.
Referring to fig. 7, fig. 7 is a schematic diagram of a hardware structure of the electronic device 100. The electronic device 100 may include a processor 130 and a machine-readable storage medium 120. The processor 130 and the machine-readable storage medium 120 may communicate via a system bus. Also, the machine-readable storage medium 120 stores machine-executable instructions, and the processor 130 may perform the page event collection or page time reproduction method described above by reading and executing the machine-executable instructions of the machine-readable storage medium 120 corresponding to the page event collection or page time reproduction logic.
The machine-readable storage medium 120 may be, but is not limited to, a Random Access Memory (RAM), a Read Only Memory (ROM), a Programmable Read-Only Memory (PROM), an Erasable Read-Only Memory (EPROM), an electrically Erasable Read-Only Memory (EEPROM), and the like. The machine-readable storage medium 120 is used for storing a program, and the processor 130 executes the program after receiving an execution instruction.
The processor 130 may be an integrated circuit chip having signal processing capabilities. The Processor 130 may be a general-purpose Processor 130, and includes a Central Processing Unit (CPU) 130, a Network Processor (NP) 130, and the like; but may also be a digital signal processor 130(DSP), an Application Specific Integrated Circuit (ASIC), a Field Programmable Gate Array (FPGA) or other programmable logic device, discrete gate or transistor logic device, discrete hardware components. The various methods, steps, and logic blocks disclosed in the embodiments of the present application may be implemented or performed. The general purpose processor 130 may be a microprocessor 130 or the processor 130 may be any conventional processor 130 or the like.
Referring to fig. 8, the present embodiment further provides a page event reproduction apparatus 140, where the page event reproduction apparatus 140 includes at least one functional module that can be stored in a machine-readable storage medium 120 in a software form. Functionally, the page event reproduction device 140 may include a key frame acquisition module 141, a pre-rendering module 142, an event acquisition module 143, a redrawing module 144, and an output module 145.
The key frame acquiring module 141 is configured to acquire a key frame of a target page, where the key frame includes hypertext markup language information related to display in the target page;
in this embodiment, the key frame acquiring module 141 may be configured to execute step S210 shown in fig. 4, and the detailed description about the key frame acquiring module 141 may refer to the description about step S210.
The prerender module 142 is configured to determine interface elements of the target page according to the key frames;
in this embodiment, the prerender module 142 may be configured to execute step S220 shown in fig. 4, and reference may be made to the description of step S220 for a detailed description of the prerender module 142.
The event obtaining module 143 is configured to obtain event information corresponding to the key frame;
in this embodiment, the event acquiring module 143 may be configured to execute step S230 shown in fig. 4, and reference may be made to the description of step S230 for a detailed description of the event acquiring module 143.
The redrawing module 144 is configured to draw a user operation track in the interface element according to the event information and/or display the event information;
in this embodiment, the redrawing module 144 may be configured to execute the step S240 shown in fig. 4, and the detailed description about the redrawing module 144 may refer to the description about the step S240.
The output module 145 is configured to draw an event recurrence video of the target page according to the interface element.
In this embodiment, the output module 145 may be configured to execute the step S250 shown in fig. 4, and reference may be made to the description of the step S250 for a detailed description of the output module 145.
Referring to fig. 9, the present embodiment further provides a page event collecting device 150, where the page event collecting device 150 includes at least one functional module that can be stored in a machine-readable storage medium 120 in a software form. Functionally, the page event collecting device 150 may include the first collecting module 151 and the second collecting module 152.
The first collecting module 151 is configured to collect a key frame of the target page, and add a timestamp for collecting the key frame to the key frame; the key frame includes hypertext markup language information related to display in the target page.
In this embodiment, the first capturing module 151 may be configured to execute step S110 shown in fig. 3, and for a detailed description of the first capturing module 151, reference may be made to the description of step S110.
The second collecting module 152 is configured to monitor and record event information generated on the target page, and add a timestamp for monitoring the event information to the event information.
In this embodiment, the second acquisition module 152 may be configured to perform the step S120 shown in fig. 3, and the detailed description about the second acquisition module 152 may refer to the description about the step S120.
In summary, according to the page event reproduction method, the acquisition device and the electronic device provided by the application, the event reproduction video of the target page is obtained by acquiring the hypertext markup language information related to display in the target page, and the operation track of the user or the event information is displayed on the event reproduction video according to the event information generated on the target page. Therefore, the process of page recurrence can show richer and more real contents related to the event information, so that developers can more accurately determine the problems of the page.
In the embodiments provided in the present application, it should be understood that the disclosed apparatus and method may be implemented in other ways. The apparatus embodiments described above are merely illustrative, and for example, the flowchart and block diagrams in the figures illustrate the architecture, functionality, and operation of possible implementations of apparatus, methods and computer program products according to various embodiments of the present application. In this regard, each block in the flowchart or block diagrams may represent a module, segment, or portion of code, which comprises one or more executable instructions for implementing the specified logical function(s). It should also be noted that, in some alternative implementations, the functions noted in the block may occur out of the order noted in the figures. For example, two blocks shown in succession may, in fact, be executed substantially concurrently, or the blocks may sometimes be executed in the reverse order, depending upon the functionality involved. It will also be noted that each block of the block diagrams and/or flowchart illustration, and combinations of blocks in the block diagrams and/or flowchart illustration, can be implemented by special purpose hardware-based systems which perform the specified functions or acts, or combinations of special purpose hardware and computer instructions.
In addition, functional modules in the embodiments of the present application may be integrated together to form an independent part, or each module may exist separately, or two or more modules may be integrated to form an independent part.
The functions, if implemented in the form of software functional modules and sold or used as a stand-alone product, may be stored in a computer readable storage medium. Based on such understanding, the technical solution of the present application or portions thereof that substantially contribute to the prior art may be embodied in the form of a software product stored in a storage medium and including instructions for causing a computer device (which may be a personal computer, a server, or a network device) to execute all or part of the steps of the method according to the embodiments of the present application. And the aforementioned storage medium includes: a U-disk, a removable hard disk, a Read-Only Memory (ROM), a Random Access Memory (RAM), a magnetic disk or an optical disk, and other various media capable of storing program codes.
It is noted that, herein, relational terms such as first and second, and the like may be used solely to distinguish one entity or action from another entity or action without necessarily requiring or implying any actual such relationship or order between such entities or actions. Also, the terms "comprises," "comprising," or any other variation thereof, are intended to cover a non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements does not include only those elements but may include other elements not expressly listed or inherent to such process, method, article, or apparatus. Without further limitation, an element defined by the phrase "comprising an … …" does not exclude the presence of other identical elements in a process, method, article, or apparatus that comprises the element.
The above description is only for various embodiments of the present application, but the scope of the present application is not limited thereto, and any person skilled in the art can easily conceive of changes or substitutions within the technical scope of the present application, and all such changes or substitutions are included in the scope of the present application. Therefore, the protection scope of the present application shall be subject to the protection scope of the claims.
Claims (14)
1. A method for page event reproduction, the method comprising:
acquiring a key frame of a target page, wherein the key frame comprises hypertext markup language information related to display in the target page;
determining interface elements of the target page according to the key frames;
acquiring event information corresponding to the key frame;
drawing a user operation track in the interface element according to the event information and/or displaying the event information;
and drawing an event recurrence video of the target page according to the interface element.
2. The method of claim 1, further comprising:
acquiring a key frame of the target page, wherein the key frame comprises a timestamp when the key frame is acquired;
acquiring event information generated on the target page, wherein the event information comprises a timestamp when the event information is monitored;
and establishing the corresponding relation between the key frames and the event information according to the time stamps of the key frames and the event information.
3. The method according to claim 2, wherein the step of establishing the correspondence between the key frame and the event information according to the timestamp comprises:
for each piece of event information, determining a key frame with a timestamp closest to the event information as a key frame corresponding to the event information.
4. The method of claim 1, wherein the key frame comprises a document object model and a cascading style sheet of the target page.
5. The method according to claim 1, wherein the step of drawing a user operation track in the interface element and/or displaying the event information according to the event information comprises:
drawing corresponding operation identification in the interface element according to the operation type and the operation position of the user operation event in the event information; and/or
And adding an information display area in the interface element, and displaying the event information in the information display area.
6. The method according to claim 5, wherein the step of drawing the corresponding operation identifier in the interface element according to the operation type and the operation position of the user operation event in the event information comprises:
and drawing an operation identifier corresponding to a user operation track in the interface element according to the operation types and the operation positions in the plurality of continuous event information.
7. The method of claim 1, wherein the key frame further comprises system operational data at the time the key frame was collected; the method further comprises the following steps:
and adding an information display area in the interface element, and displaying the system operation data in the information display area.
8. A page event collection method is characterized by comprising the following steps:
collecting a key frame of a target page, and adding a time stamp when the key frame is collected to the key frame; the key frame comprises hypertext markup language information related to display in the target page;
monitoring and recording event information generated on the target page, and adding a timestamp for monitoring the event information to the event information.
9. The method of claim 8,
the step of collecting the key frame of the target page comprises the following steps:
collecting the key frames of the target page according to a set period through a first Service Worker;
the step of monitoring and recording the event information generated on the target page comprises the following steps:
and monitoring and recording the event information generated on the target page through a second Service Worker.
10. The method of claim 9, further comprising:
and establishing the corresponding relation between the key frame and the event information according to the timestamp.
11. A page event reproduction apparatus, characterized in that the apparatus comprises:
the system comprises a key frame acquisition module, a key frame acquisition module and a display module, wherein the key frame acquisition module is used for acquiring a key frame of a target page, and the key frame comprises hypertext markup language information related to display in the target page;
the pre-rendering module is used for determining interface elements of the target page according to the key frames;
the event acquisition module is used for acquiring event information corresponding to the key frames;
the redrawing module is used for drawing a user operation track in the interface element according to the event information and/or displaying the event information;
and the output module is used for drawing the event recurrence video of the target page according to the interface element.
12. A page event collection method is characterized by comprising the following steps:
the first acquisition module is used for acquiring a key frame of a target page and adding a time stamp when the key frame is acquired to the key frame; the key frame comprises hypertext markup language information related to display in the target page;
and the second acquisition module is used for monitoring and recording the event information generated on the target page, and adding a timestamp for monitoring the event information to the event information.
13. An electronic device comprising a processor and a machine-readable storage medium having stored thereon machine-executable instructions that, when executed by the processor, implement the method of any of claims 1-10.
14. A machine-readable storage medium having stored thereon machine-executable instructions which, when executed by one or more processors, perform the method of any one of claims 1-10.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202110198706.3A CN112835776A (en) | 2021-02-22 | 2021-02-22 | Page event reproduction method, page event acquisition method, page event reproduction device and electronic equipment |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202110198706.3A CN112835776A (en) | 2021-02-22 | 2021-02-22 | Page event reproduction method, page event acquisition method, page event reproduction device and electronic equipment |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN112835776A true CN112835776A (en) | 2021-05-25 |
Family
ID=75934265
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202110198706.3A Pending CN112835776A (en) | 2021-02-22 | 2021-02-22 | Page event reproduction method, page event acquisition method, page event reproduction device and electronic equipment |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN112835776A (en) |
Cited By (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114036426A (en) * | 2021-11-25 | 2022-02-11 | 深圳视界信息技术有限公司 | Webpage data acquisition method, device, equipment and medium |
| CN114690994A (en) * | 2022-04-21 | 2022-07-01 | 腾讯科技（深圳）有限公司 | Behavior data acquisition method and device, electronic equipment and storage medium |
| CN115328347A (en) * | 2022-08-09 | 2022-11-11 | 青岛海信移动通信技术股份有限公司 | Interface display method and device, terminal equipment and storage medium |
| CN116070046A (en) * | 2023-02-17 | 2023-05-05 | 贝壳找房(北京)科技有限公司 | Project test information display method and device, electronic equipment and storage medium |
Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20150082198A1 (en) * | 2013-09-13 | 2015-03-19 | Box, Inc. | System and method of a multi-functional managing user interface for accessing a cloud-based platform via mobile devices |
| CN109710354A (en) * | 2018-12-13 | 2019-05-03 | 平安普惠企业管理有限公司 | Page monitor method, page restoring method, device, equipment and medium |
| CN112000563A (en) * | 2020-08-26 | 2020-11-27 | 支付宝(杭州)信息技术有限公司 | User behavior recording method, device and equipment |
| CN112131085A (en) * | 2020-08-01 | 2020-12-25 | 青岛希望鸟科技有限公司 | Method, system and device for recording and playing back Internet business process |
| CN112148573A (en) * | 2020-09-21 | 2020-12-29 | 青岛窗外科技有限公司 | Method and device for recording and playing back webpage operation process |
| CN112148571A (en) * | 2020-07-08 | 2020-12-29 | 青岛窗外科技有限公司 | Method and device for recording and playing back webpage operation process |
-
2021
- 2021-02-22 CN CN202110198706.3A patent/CN112835776A/en active Pending
Patent Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20150082198A1 (en) * | 2013-09-13 | 2015-03-19 | Box, Inc. | System and method of a multi-functional managing user interface for accessing a cloud-based platform via mobile devices |
| CN109710354A (en) * | 2018-12-13 | 2019-05-03 | 平安普惠企业管理有限公司 | Page monitor method, page restoring method, device, equipment and medium |
| CN112148571A (en) * | 2020-07-08 | 2020-12-29 | 青岛窗外科技有限公司 | Method and device for recording and playing back webpage operation process |
| CN112131085A (en) * | 2020-08-01 | 2020-12-25 | 青岛希望鸟科技有限公司 | Method, system and device for recording and playing back Internet business process |
| CN112000563A (en) * | 2020-08-26 | 2020-11-27 | 支付宝(杭州)信息技术有限公司 | User behavior recording method, device and equipment |
| CN112148573A (en) * | 2020-09-21 | 2020-12-29 | 青岛窗外科技有限公司 | Method and device for recording and playing back webpage operation process |
Cited By (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114036426A (en) * | 2021-11-25 | 2022-02-11 | 深圳视界信息技术有限公司 | Webpage data acquisition method, device, equipment and medium |
| CN114690994A (en) * | 2022-04-21 | 2022-07-01 | 腾讯科技（深圳）有限公司 | Behavior data acquisition method and device, electronic equipment and storage medium |
| CN115328347A (en) * | 2022-08-09 | 2022-11-11 | 青岛海信移动通信技术股份有限公司 | Interface display method and device, terminal equipment and storage medium |
| CN115328347B (en) * | 2022-08-09 | 2024-06-04 | 青岛海信移动通信技术有限公司 | Interface display method, device, terminal equipment and storage medium |
| CN116070046A (en) * | 2023-02-17 | 2023-05-05 | 贝壳找房(北京)科技有限公司 | Project test information display method and device, electronic equipment and storage medium |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN112835776A (en) | Page event reproduction method, page event acquisition method, page event reproduction device and electronic equipment | |
| CN107391379B (en) | Automatic interface testing method and device | |
| CN110069463B (en) | User behavior processing method, device electronic equipment and storage medium | |
| CN106656536B (en) | Method and equipment for processing service calling information | |
| CN107526631B (en) | Task monitoring method, device, equipment and medium | |
| CN108322350B (en) | Service monitoring method and device and electronic equipment | |
| CN111752793A (en) | System abnormity monitoring method and device, computer equipment and storage medium | |
| US20130263156A1 (en) | Operation log collection method and device | |
| CN112181815A (en) | Python-based exception capture method and device and computer readable storage medium | |
| CN104598128A (en) | Method and system for recommending solutions on basis of operation behaviors of users | |
| US8140919B2 (en) | Display of data used for system performance analysis | |
| CN108073499B (en) | Application program testing method and device | |
| CN113987393A (en) | Web page operation recorder, system, device and method | |
| CN111506470B (en) | Browser error detection and alarm method, device, equipment and storage medium | |
| CN112988776B (en) | Method, device and equipment for updating text parsing rule and readable storage medium | |
| CN112100036B (en) | Page performance monitoring method and system based on PaaS front-end engine | |
| CN112307384B (en) | Page snapshot display method and device, electronic equipment and storage medium | |
| CN103593429B (en) | Commodity template failure detection method and device | |
| CN113342608A (en) | Method and device for monitoring streaming computing engine task | |
| CN110381152B (en) | Statistical method and statistical device for automatic playing amount of pushed resources and electronic equipment | |
| CN112306870A (en) | Data processing method and device based on live APP | |
| CN112416735A (en) | Application program detection method and device, terminal equipment and storage medium | |
| CN111413952A (en) | Robot fault detection method and device, electronic equipment and readable storage medium | |
| CN115168171A (en) | Webpage exception handling method and device, electronic equipment and medium | |
| CN111368104A (en) | Information processing method, device and equipment |
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 | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20210525 |
|
| RJ01 | Rejection of invention patent application after publication |