Visualized burying point processing method, device, equipment, storage medium and program product

Abstract

This invention discloses a visual event tracking processing method, apparatus, device, storage medium, and program product. The method includes: injecting styles into the event tracking elements corresponding to the event tracking configuration of the page to be tracked, obtaining a screenshot of the page with the event tracking configuration, and comparing the similarity between the page screenshot and the injected frame screenshot; when some page screenshots corresponding to the event tracking configuration fail the similarity comparison with the injected frame screenshot, performing difference analysis on the page and its previous version's historical pages, locating the area block screenshot where the event tracking elements have changed, and comparing the similarity between the area block screenshot and the injected frame screenshot to obtain at least one pair of event tracking elements, the pair including: one event tracking element in the area block and one event tracking element in the injected frame screenshot; performing similarity judgment on the pair of event tracking elements, and performing visual event tracking processing on the page based on the similarity judgment result. This invention can effectively reduce the time and labor costs of event tracking and improve event tracking efficiency.

Description

Technical Field

[0001] This invention relates to the field of computer technology, and in particular to a method, apparatus, device, storage medium, and program product for visual data embedding. Background Technology

[0002] Visual event tracking technology relies on a graphical interface, allowing users to visually select page elements and automatically generate event tracking points without code intervention, enabling the collection and tracking of user behavior data. Currently, visual event tracking typically uses XPath (XMLPath Language) to uniquely identify the elements to be tracked, accurately locating them based on the document hierarchy.

[0003] However, existing visual event tracking solutions have significant drawbacks: with product iterations, page structures change frequently. For example, page elements / instantaneous elements may be deleted, added, have their positions changed, or their appearance may change. Using existing visual event tracking solutions leads to a large number of event tracking points becoming invalid. Therefore, with each product iteration, developers / operations personnel need to re-select event tracking points and perform regression testing. This repetitive tracking operation consumes a significant amount of time and manpower, resulting in low event tracking efficiency. Summary of the Invention

[0004] To address the problems existing in the prior art, embodiments of the present invention provide a visual tracking method, apparatus, device, storage medium, and program product, which can effectively reduce the time and labor costs of tracking and improve tracking efficiency.

[0005] In a first aspect, embodiments of the present invention provide a method for visualizing data tracking, including: Style injection is performed on the tracking elements corresponding to the tracking configuration of the page to be tracked, a screenshot of the page with the tracking configuration is obtained, and the similarity of the page screenshot and the injected frame screenshot associated with the tracking configuration is compared. If some page screenshots corresponding to the aforementioned tracking point configurations fail the similarity comparison with the injected frame screenshots, a difference analysis is performed on the page and its previous version's historical pages to locate the area block screenshots where the tracking point elements on the page have changed. The similarity of the embedded elements in the region block screenshot and the embedded elements in the injection frame screenshot is compared to obtain at least one embedded element pair; wherein, the embedded element pair includes: one embedded element in the region block screenshot and one embedded element in the injection frame screenshot. The similarity of the tracked elements is determined, and the page is then processed with visual tracking based on the similarity determination results.

[0006] As an improvement to the above solution, the method further includes: Load the page to be tracked, and use the current screenshot of the page as the initial page screenshot to initialize the trajectory stack; Monitor user actions related to the event tracking configuration on the page, and compare the page screenshot in the trajectory stack information generated after each action with the page screenshot at the top of the trajectory stack. If there is a difference between the page screenshot in the trajectory stack information and the page screenshot at the top of the trajectory stack, push the page screenshot in the trajectory stack information into the trajectory stack until the tracking point configuration is completed, and obtain the trajectory stack of multiple tracking point configurations for the page. Among them, the page screenshot of the trajectory information at the bottom of the trajectory stack in the previous tracking point configuration is compared with the initial page screenshot of the corresponding page. Figure 1 To.

[0007] As an improvement to the above solution, style injection is performed on the tracking elements corresponding to the tracking configuration of the page to be tracked, obtaining a screenshot of the page with the tracking configuration, and comparing the similarity between the page screenshot and the injected frame screenshot associated with the tracking configuration, including: When the application is updated, the tracking stack corresponding to the tracking configuration of the page to be tracked in the application is retrieved, and the style injection of the tracking element is automatically triggered starting from the page screenshot at the bottom of the tracking stack to obtain the page screenshot after the style injection corresponding to the tracking configuration. The similarity between the page screenshot after style injection and the injection frame screenshot associated with the event tracking configuration is calculated to obtain the first similarity between the page screenshot after style injection and the injection frame screenshot associated with the corresponding event tracking configuration. When the first similarity between the page screenshot after style injection and the injected frame screenshot is greater than the preset first similarity threshold, the corresponding event tracking configuration is compared based on similarity. When the first similarity between the page screenshot after style injection and the injected frame screenshot is not greater than the first similarity threshold, the corresponding event tracking configuration fails the similarity comparison.

[0008] As an improvement to the above solution, a difference analysis is performed on the page and its previous version's historical pages to locate screenshots of areas where the embedded elements on the page have changed, including: Perform syntactic analysis on the document object model of the page and construct the first DOM abstract syntax tree; Perform syntactic analysis on the document object model of the historical pages to construct a second DOM abstract syntax tree; Perform a difference analysis on the first DOM abstract syntax tree and the second DOM abstract syntax tree to locate the area blocks in the page where the embedded elements change, and generate the corresponding area block screenshots.

[0009] As an improvement to the above scheme, the embedding elements in the region block screenshot are compared with the embedding elements in the injected frame screenshot to obtain at least one pair of embedding elements, including: Based on the region block screenshot and the injection frame screenshot, a first input feature is constructed; Based on the embedded elements in the screenshot of the region block and the interactive feedback information generated after the corresponding embedded elements are automatically triggered, a second input feature is constructed. The first input feature and the second input feature are fed into a pre-trained similarity detection model to predict similarity, thereby obtaining the second similarity between each embedded element in the region block screenshot and each embedded element in the injected frame screenshot. Based on the second similarity between each embedded element in the region block screenshot and each embedded element in the injection frame screenshot, embedded element pairs are constructed; wherein, the embedded element pair includes: an embedded element in the region block screenshot and an embedded element in the injection frame screenshot with the highest second similarity.

[0010] As an improvement to the above solution, a similarity judgment is performed on the pairs of event tracking elements, and visual event tracking processing is performed on the page based on the similarity judgment result, including: The second similarity between two embedded elements in the embedded element pair is compared with a preset second similarity threshold. When the second similarity between two tracking elements in the tracking element pair is greater than a preset second similarity threshold, a prompt message is triggered; the prompt message is used to instruct the user to confirm whether the two tracking elements in the tracking element pair are the same tracking element. When the second similarity between two tracking elements in the tracking element pair is not greater than the second similarity threshold, or when the user confirms that the two tracking elements in the tracking element pair are not the same tracking element, the page is visually selected for tracking points. When the user confirms that the two event tracking elements in the event tracking element pair are the same event tracking element, update the event tracking configuration of the current version.

[0011] Secondly, embodiments of the present invention provide a visual data tracking device, comprising: The first similarity comparison module is used to inject styles into the tracking elements corresponding to the tracking configuration of the page to be tracked, obtain a screenshot of the page of the tracking configuration, and compare the similarity between the page screenshot and the injected frame screenshot associated with the tracking configuration. The difference analysis module is used to perform difference analysis on the page and its previous version's historical pages when some page screenshots corresponding to the tracking point configurations fail the similarity comparison with the injected frame screenshots, and to locate the area block screenshots in the page where the tracking point elements have changed. The second similarity comparison module is used to compare the similarity of the embedded elements in the region block screenshot with the embedded elements in the injection frame screenshot to obtain at least one embedded element pair; wherein, the embedded element pair includes: an embedded element in the region block screenshot and an embedded element in the injection frame screenshot. The visual tracking point selection module is used to determine the similarity of the tracking point pairs and to perform visual tracking point processing on the page based on the similarity determination results.

[0012] Thirdly, embodiments of the present invention provide a visual tracking point processing device, comprising: a processor, a memory, and a computer program stored in the memory and configured to be executed by the processor, wherein the processor executes the computer program to implement the visual tracking point processing method as described in any one of the first aspects.

[0013] Fourthly, embodiments of the present invention provide a computer-readable storage medium storing a computer program, wherein the computer program, when running, controls the device where the computer-readable storage medium is located to perform the visualization tracking method as described in any one of the first aspects.

[0014] Fifthly, embodiments of the present invention provide a computer program product, including a computer program or instructions, which, when executed by a processor, implement the visualization tracking method as described in any one of the first aspects.

[0015] Compared to existing technologies, the present invention provides a visual tracking processing method, apparatus, device, storage medium, and program product. This involves injecting styles into the tracking elements corresponding to the tracking configuration of the page to be tracked, obtaining a screenshot of the page with the tracking configuration, and comparing the similarity of the page screenshot with an injected frame screenshot associated with the tracking configuration. Then, when some page screenshots corresponding to the tracking configuration fail the similarity comparison with the injected frame screenshot, a difference analysis is performed on the page and its previous version's historical pages to locate the area block screenshots where the tracking elements have changed. Next, the tracking elements in the area block screenshots are compared with the tracking elements in the injected frame screenshots to obtain at least one pair of tracking elements. Each pair of tracking elements includes one tracking element from the area block screenshot and one tracking element from the injected frame screenshot. Finally, a similarity judgment is made on the pair of tracking elements, and visual tracking processing is performed on the page based on the similarity judgment result. This invention accurately locates the tracking configuration elements by comparing the similarity between the injection frame screenshot of the tracking configuration and the page screenshot after style injection after automatic triggering of the tracking configuration, and by comparing the similarity between the tracking elements in the area block where the tracking elements have changed and the tracking elements corresponding to the tracking configuration. This efficiently filters out the configurations that need to be re-tracked and those that do not, greatly reducing the workload of development / operation / testing personnel, reducing the time and manpower costs of tracking, and improving tracking efficiency. Attached Figure Description

[0016] To more clearly illustrate the technical solution of the present invention, the accompanying drawings used in the embodiments will be briefly introduced below. Obviously, the drawings described below are only some embodiments of the present invention. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0017] Figure 1 This is a flowchart of a visual embedding point processing method provided in an embodiment of the present invention; Figure 2 This is a schematic diagram of the system architecture for visual data tracking provided in an embodiment of the present invention; Figure 3 This is an overall flowchart of visualized data tracking for product iteration scenarios provided in this embodiment of the invention; Figure 4 This is a flowchart of the visual embedding point selection provided in the embodiments of the present invention; Figure 5 This is a flowchart of the data query for embedded points provided in an embodiment of the present invention; Figure 6 This is a flowchart of a visual selection process automatically triggered based on embedded point configuration, provided in an embodiment of the present invention. Figure 7 This is a flowchart of the trajectory stack post-processing provided in an embodiment of the present invention; Figure 8 This is a schematic diagram of a region block similarity detection model based on collaborative representation provided in an embodiment of the present invention; Figure 9 This is a structural block diagram of a visualization tracking device provided in an embodiment of the present invention; Figure 10 This is a structural block diagram of a visualization embedding device provided in an embodiment of the present invention. Detailed Implementation

[0018] The technical solutions of the embodiments of the present invention will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of the present invention, and not all embodiments. Based on the embodiments of the present invention, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of the present invention.

[0019] It is understood that the various numerical designations used in the embodiments of this invention are merely for descriptive convenience and are not intended to limit the scope of this application. The order of the process numbers does not imply the order of execution; the execution order of each process should be determined by its function and internal logic.

[0020] In embodiments of the invention, relational terms such as "first" and "second" are used merely to distinguish one entity or operation from another, without necessarily requiring or implying any such actual relationship or order between these entities or operations. The terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or apparatus. Without further limitation, an element defined by the phrase "comprising" does not exclude the presence of additional identical elements in the process, method, article, or apparatus that includes said element. The term "a plurality or several" refers to two or more.

[0021] See Figure 1 , Figure 1 This is a flowchart of a visual tracking point processing method provided by an embodiment of the present invention. The visual tracking point processing method specifically includes: S11: Inject styles into the tracking elements corresponding to the tracking configuration of the page to be tracked, obtain a screenshot of the page with the tracking configuration, and compare the similarity between the page screenshot and the injected frame screenshot associated with the tracking configuration. S12: When some page screenshots corresponding to the aforementioned tracking point configurations and the injected frame screenshots fail the similarity comparison, perform a difference analysis on the page and its previous version's historical pages to locate the area block screenshots where the tracking point elements in the page have changed. S13: Compare the similarity of the embedded elements in the region block screenshot with the embedded elements in the injection frame screenshot to obtain at least one embedded element pair; wherein, the embedded element pair includes: one embedded element in the region block screenshot and one embedded element in the injection frame screenshot. S14: Perform similarity judgment on the pairs of embedded elements, and perform visual embedded point processing on the page based on the similarity judgment result.

[0022] The visual tracking method described in this invention can be applied to devices such as servers and computers. These devices are equipped with a system for updating and maintaining visual tracking points on web pages. This system mainly includes: an application management module, a visual tracking module, a tracking data management module, and a tracking testing module. Figure 2 As shown.

[0023] The application management module is used to create applications that require visual event tracking. When an application needs event tracking, it needs to be created in the application management module. The application management module stores all applications that need event tracking, as well as the application's version information, such as the version number.

[0024] The Visual Tracking Module is used to visually select and track elements in the application that require tracking, such as interactive elements on a page (buttons, input boxes, pop-ups, cards, tabs, links, etc.) that require user interaction and behavioral data collection. The tracking configuration for each application and related data are stored in the Tracking Data Management Module.

[0025] The event tracking data module is used to save relevant data of the event tracking configuration, such as the trajectory stack information corresponding to the event tracking configuration, the recording information corresponding to the event tracking configuration, and the initial page screenshot of the event tracking page.

[0026] The trajectory stack information includes the user's operation type on the page, element position information / page scrolling information, and a screenshot of the page after the user's operation; the recording information includes the injection frame screenshot, or Inject frame for short, which is a frame of page information with the style of the embedded point configuration injected into the recording information corresponding to the embedded point configuration.

[0027] The event tracking testing module is used to test event tracking configurations. Each application must pass event tracking testing in this module before deployment. For example, in the event tracking data module, after the application's event tracking process is complete, the event tracking configurations that need to be re-configured during iterations and any newly added event tracking configurations are output to the testing module. Testers then test these event tracking configurations to ensure that all output event tracking configurations pass the tests.

[0028] It should be noted that event tracking testing is an existing technology and will not be described in detail here. After the application iteration is successful, the event tracking element is uniquely identified based on its location information, Inject frame, and functional information, such as the element's function type. This identifier is used to bind the event tracking element and its event tracking configuration. When the user selects an event tracking element, the unique identifier represents the event tracking configuration of that element and is reported, thus realizing the reporting of visual event tracking configuration.

[0029] For example, when an application iterates, changes to its DOM structure can cause previous event tracking configurations to become invalid, resulting in a large amount of repetitive event tracking configuration and regression testing work. This invention proposes a visual event tracking processing method for product iteration scenarios. When an application version changes, all event tracking configurations for the pages to be tracked in the current version of the application are retrieved. Styles are injected into the event tracking elements associated with each event tracking configuration to obtain screenshots of the pages after the injected styles for each event tracking configuration. Each event tracking configuration is automatically triggered, and its page screenshot is compared with its associated Inject frame for similarity. If some page screenshots fail the similarity comparison with the corresponding injected frame screenshots, such as when the first similarity between the page screenshot and the corresponding injected frame screenshot is lower than a set first similarity threshold, then... The system performs a difference analysis on the current version of the page and its historical pages from the previous version, locating screenshots of areas where the tracking elements have changed in the current version of the page. Then, it compares the similarity of each tracking element in the located area screenshot with the tracking elements in the corresponding Inject frame, identifying the tracking element with the highest similarity in the Inject frame screenshot. This element is then paired with the corresponding tracking element in the area screenshot to form a tracking element pair. The similarity between the two tracking elements in each pair is then assessed, and based on the similarity assessment results, a visual tracking selection is enabled for the current version of the page. For example, if the similarity assessment result is that the second similarity between the two tracking elements is greater than a preset second similarity threshold, or if the two tracking elements are not the same element, then a visual tracking selection is enabled for the current version of the page.

[0030] This invention, through similarity comparison between the injection frame screenshot of the event tracking configuration and the page screenshot after style injection following automatic event tracking configuration, and similarity comparison between the event tracking elements in the area block where the event tracking elements change and the event tracking elements corresponding to the event tracking configuration, can accurately locate event tracking configuration elements, efficiently filter out configurations that need to be re-tracked and those that do not, greatly reduce the workload of development / operation / testing personnel, reduce the time and manpower costs of event tracking, and improve event tracking efficiency.

[0031] In one optional embodiment, a difference analysis is performed on the page and its previous version's historical pages to locate screenshots of areas where the embedded elements on the page have changed, including: Perform syntactic analysis on the document object model of the page and construct the first DOM abstract syntax tree; Perform syntactic analysis on the document object model of the historical pages to construct a second DOM abstract syntax tree; Perform a difference analysis on the first DOM abstract syntax tree and the second DOM abstract syntax tree to locate the area blocks in the page where the embedded elements change, and generate the corresponding area block screenshots.

[0032] This invention retrieves the current version of the application page after the update and the previous version of the page, and performs syntactic analysis on the DOM structure of the current version and the previous version of the page respectively to construct the first DOM Abstract Syntax Tree (AST) of the current version of the page and the second DOM Abstract Syntax Tree of the previous version of the page. By performing a difference analysis based on the Diff algorithm on the AST of the DOM structure of the two pages, the regions of the current version of the page that send tracking elements have changed compared to the previous version of the page can be identified. This can solve the problem that changes in the page DOM structure during product version iteration cause previous tracking configurations to become invalid and the problem of inaccurate identification of invalid tracking configurations, thereby improving the accuracy of identifying invalid tracking configurations.

[0033] In one optional embodiment, the similarity of the tracked element pairs is determined, and the page is subjected to visual tracked processing based on the similarity determination result, including: The second similarity between two embedded elements in the embedded element pair is compared with a preset second similarity threshold. When the second similarity between two tracking elements in the tracking element pair is greater than a preset second similarity threshold, a prompt message is triggered; the prompt message is used to instruct the user to confirm whether the two tracking elements in the tracking element pair are the same tracking element. When the second similarity between two tracking elements in the tracking element pair is not greater than the second similarity threshold, or when the user confirms that the two tracking elements in the tracking element pair are not the same tracking element, the page is visually selected for tracking points. When the user confirms that the two event tracking elements in the event tracking element pair are the same event tracking element, update the event tracking configuration of the current version.

[0034] For example, the overall process of visual event tracking in a product iteration scenario is as follows: like Figure 3 As shown, first open the page in the application that has been tracked in the application management module. Based on the application's version information and the tracked page information, such as the page address recorded after the page is tracked and the corresponding application, determine whether the page needs to be tracked because of a version update or because it is the first time the page needs to be tracked. For example, if all previous versions of the application do not have this page, that is, the tracked page information does not have the web address of this page, then it is the first time the page needs to be tracked. If the page exists in previous versions of the application and the tracked page information has the web address of this page, then it is because the page needs to be tracked because of a version update.

[0035] If this is the first time this page requires event tracking, simply enable visual event tracking selection. If it's a version update requiring event tracking, then perform the following steps: Retrieve all event tracking configurations for the page and iterate through them. Through the automatic triggering of event tracking configurations, trigger all event tracking elements corresponding to the event tracking configurations, inject the style of the already tracked event tracking configurations into them, and obtain a screenshot of the page after injecting the style of the already tracked event tracking configurations. Then, iterate through all the event tracking configurations on the page and compare the similarity of the frame page screenshots corresponding to each event tracking configuration with the Inject frames in the recording information of the response event tracking configuration. If all the page screenshots and Inject frames corresponding to the event tracking configurations pass the similarity comparison, it means that the changes to the page have not affected the DOM structure of the events tracked, so the event tracking configurations will be updated directly to the new version. If all the page screenshots and Inject frames corresponding to the event tracking configurations fail the similarity comparison, it means that the DOM structure of the elements with event tracking may have been reconstructed, and all elements with event tracking have been affected. In this case, clear the event tracking configuration of the previous version of the page and enable visual event tracking selection to re-track the events. In other cases, such as when some tracking point configurations' corresponding page screenshots and Inject frames fail the similarity comparison, or when some tracking point configurations' corresponding page screenshots and Inject frames pass the similarity comparison, it indicates that only some tracking elements on the page are affected by DOM structure changes. In this case, based on the range of influence of the DOM structure changes, such as if the range of influence exceeds 5 area blocks, the following operations can be performed: The Diff algorithm is used to compare the AST corresponding to the DOM structure of the previous version page with the AST corresponding to the DOM structure of the current version page to obtain the area blocks where the embedded elements have changed in the current version page, and generate area block screenshots for each area block. Then, iterate through the above-mentioned tracking point configurations that failed the similarity comparison, and compare the similarity of each tracking point configuration's Inject frame with each region block screenshot. For each tracking point configuration that failed the similarity comparison, calculate the second similarity between each tracking point element in the Inject frame of that tracking point configuration and each tracking point element in the corresponding region block screenshot, and determine the maximum second similarity among the second similarities between each tracking point element in the Inject frame of that tracking point configuration and each tracking point element in the corresponding region block screenshot; the tracking point element in the Inject frame corresponding to the maximum second similarity and the tracking point element in the region block screenshot are regarded as a pair of tracking point elements, thus completing the matching of the tracking point elements in the region block screenshot with the tracking point elements corresponding to the tracking point configuration. Iterate through all pairs of event tracking elements corresponding to the event tracking configuration of all region block screenshots. If the second similarity between the event tracking elements in all region block screenshots and the event tracking elements corresponding to the event tracking configuration is greater than the preset second similarity threshold, send a prompt message to ask the user to confirm whether the two event tracking elements are the same element. If the user confirms that they are not the same element, enable visual event tracking selection and re-track the event tracking. Otherwise, update the new version of the event tracking configuration. If the second similarity between the tracking elements in all area block screenshots and the tracking elements corresponding to the tracking configuration is less than or equal to the second similarity threshold, then the tracking configuration is recorded. After traversing all tracking configurations, these tracking configurations are displayed to the user, and visual tracking selection is enabled.

[0036] This invention, through similarity comparison between the injection frame screenshot of the event tracking configuration and the page screenshot after style injection following automatic triggering of event tracking configuration, AST difference comparison based on DOM structure, and similarity comparison between the event tracking elements in the area block where the event tracking elements have changed and the event tracking elements corresponding to the event tracking configuration, can accurately locate event tracking configuration elements, efficiently filter out configurations that need to be re-tracked and those that do not. This solves the problem of previous event tracking configurations becoming invalid due to changes in the page DOM structure during product version iterations, as well as the inaccurate identification of invalid event tracking configurations. It greatly reduces the workload of development / operations / testing personnel, shortens product iteration time, and reduces the time and manpower costs of event tracking, thereby improving event tracking efficiency.

[0037] Furthermore, considering that traditional methods display visualized event tracking configurations as a list after visually selecting event points, issues arise during later maintenance and viewing, including unclear meanings, display errors, inaccurate conditional display areas, and inaccurate event reporting. This invention proposes a visualized event tracking configuration maintenance and query mechanism, such as... Figure 4 and Figure 5 As shown, the details are as follows: First, the iframe loads the page to be tracked, and by default, visual tracking selection is enabled. When the user enables the visual tracking selection button, the page to be tracked begins recording and listening for user actions, such as clicks and swipes. Specifically, a page recording tool, such as rrweb, can be used to record the page. If a time limit is set, and no user action is detected within 3 seconds, the recording information of this page within the current 3 seconds will be discarded. If a time limit is set, such as 3 seconds to detect user operation, then further check whether the page has completed the event tracking configuration; if not, continue to listen for user operation and record the page; otherwise, inject the preset event tracking style into the event tracking element, and end the page recording after injecting the event tracking style, and obtain the Inject frame after the event tracking style of the page, which is used as the recording information of the event tracking configuration, i.e., the selected recording information. It should be noted that after injecting the event tracking configuration style, i.e. when recording ends, the injected style should be cleared to avoid affecting other event tracking configurations.

[0038] The recorded information, along with the corresponding event tracking configuration and the functional information corresponding to the event tracking configuration, is reported and saved together.

[0039] When querying the event tracking configuration later, the recording information of the event tracking configuration and the Inject frame of the event tracking style can be provided to the user according to the query conditions submitted by the user. This can solve the problem that the traditional event tracking can only be visualized and queried during the event tracking process, and improve the convenience of event tracking configuration query.

[0040] In addition, the present invention can provide users with a method for automatically triggering queries based on event tracking configuration. For specific steps, please refer to the steps for automatically triggering event tracking configuration.

[0041] Furthermore, the method also includes: Load the page to be tracked, and use the current screenshot of the page as the initial page screenshot to initialize the trajectory stack; Monitor user actions related to the event tracking configuration on the page, and compare the page screenshot in the trajectory stack information generated after each action with the page screenshot at the top of the trajectory stack. If there is a difference between the page screenshot in the trajectory stack information and the page screenshot at the top of the trajectory stack, push the page screenshot in the trajectory stack information into the trajectory stack until the tracking point configuration is completed, and obtain the trajectory stack of multiple tracking point configurations for the page. Among them, the page screenshot of the trajectory information at the bottom of the trajectory stack in the previous tracking point configuration is compared with the initial page screenshot of the corresponding page. Figure 1 To.

[0042] When an application iterates, the system retrieves the event tracking configurations for the current version of the application's pages. After retrieving all event tracking configurations, it triggers the corresponding event tracking elements, injects their already-tracked styles, and compares the similarity of the injected frame screenshot with the Inject frame in the event tracking configuration. Manually triggering this process would be time-consuming and resource-intensive for users. Furthermore, automatic triggering based on the position of elements in the event tracking configuration might result in elements in the conditional display area not being triggered successfully, or even triggering incorrectly, leading to inaccurate display of event tracking configurations in the conditional display area. To address these issues, this invention introduces a visual event tracking selection mechanism and an automatic event tracking configuration triggering mechanism.

[0043] like Figure 6 As shown, the visual tracking point selection mechanism is implemented as follows: When the iframe loads the page to be tracked, record the current page screenshot of the page to be tracked as the initial page screenshot of the page to be tracked, and initialize a trajectory stack. Then, user actions are monitored. After each user action, the trajectory information of the page after the action is obtained. The trajectory information includes the user's action type, the position information of the elements on the page operated on / page scrolling information, and a screenshot of the page after the user's action. The screenshot of the page in the trajectory information is compared with the screenshot of the page at the top of the trajectory stack. For example, the similarity between the two screenshots is calculated. If the similarity between the two screenshots is lower than a preset third similarity threshold, such as 80%, it means that the page has changed significantly. The trajectory information is then pushed onto the trajectory stack, and user actions are monitored again. If the similarity between the two screenshots is higher than the preset third similarity threshold, it means that the page has not changed significantly, and user actions are monitored again.

[0044] If the user completes a tracking configuration after the current operation, then the tracking configuration and its trajectory stack are reported. Each tracking stack corresponding to a tracking configuration requires post-processing, such as... Figure 7 As shown, the specific process is as follows: First, determine whether the page screenshot in the trajectory information at the bottom of the trajectory stack corresponding to the current tracking point configuration is consistent with the initial page screenshot of the current tracking point configuration; If they match, no action is taken, and the trajectory stack is directly used as the final trajectory stack of the current tracking point configuration to complete the update of the tracking point configuration trajectory stack; if they do not match, the trajectory stack corresponding to the current tracking point configuration is concatenated on top of the trajectory stack of the previous tracking point configuration, and the concatenated trajectory stack is used as the temporary trajectory stack of the current tracking point configuration. If the screenshot of the trajectory information at the bottom of the concatenated temporary trajectory stack differs from the initial screenshot of the currently configured tracking point... Figure 1 If the result is the same, then the temporary trajectory stack will be used as the final trajectory stack for the current tracking point configuration, and the tracking point configuration trajectory stack will be updated. If the screenshot of the trajectory information at the bottom of the spliced ​​temporary trajectory stack is still inconsistent with the initial screenshot of the current tracking point configuration, continue the above steps until the screenshot of the trajectory information at the bottom of the spliced ​​temporary trajectory stack is consistent with the initial screenshot of the current tracking point configuration. Figure 1 Until then.

[0045] It should be noted that the embodiments of the present invention do not specifically limit the method for judging the consistency of page screenshots. For example, an image similarity algorithm can be used to judge whether the page screenshots are consistent. The embodiments of the present invention do not specifically limit this method.

[0046] This invention, through post-processing of the trajectory stack corresponding to the embedded points, progressively splices the preceding trajectory stacks and verifies the consistency between the bottom page screenshot and the initial page screenshot, automatically filling in the missing page starting trajectory. This can accurately restore the complete page operation chain, ensuring the integrity of the embedded point trajectory stack data and the accuracy of page tracing.

[0047] In one optional embodiment, style injection is performed on the tracking elements corresponding to the tracking configuration of the page to be tracked, a screenshot of the page with the tracking configuration is obtained, and a similarity comparison is performed between the page screenshot and the injected frame screenshot associated with the tracking configuration, including: When the application is updated, the tracking stack corresponding to the tracking configuration of the page to be tracked in the application is retrieved, and the style injection of the tracking element is automatically triggered starting from the page screenshot at the bottom of the tracking stack to obtain the page screenshot after the style injection corresponding to the tracking configuration. The similarity between the page screenshot after style injection and the injection frame screenshot associated with the event tracking configuration is calculated to obtain the first similarity between the page screenshot after style injection and the injection frame screenshot associated with the corresponding event tracking configuration. When the first similarity between the page screenshot after style injection and the injected frame screenshot is greater than the preset first similarity threshold, the corresponding event tracking configuration is compared based on similarity. When the first similarity between the page screenshot after style injection and the injected frame screenshot is not greater than the first similarity threshold, the corresponding event tracking configuration fails the similarity comparison.

[0048] Based on the above-mentioned visual event tracking selection mechanism, automatic triggering of event tracking configuration information is superimposed. When the application undergoes a version change, the event tracking configuration is automatically triggered, as detailed below: First, retrieve the event tracking configuration and the trajectory stack corresponding to the event tracking configuration; Based on the trajectory information in the corresponding trajectory stack configured for each tracking point, automatic triggering starts from the bottom of the stack; after automatic triggering, the already tracked style is injected into the triggered tracking point element; The embedded point style can be customized, and this embodiment of the invention does not limit it; for example, the currently set embedded point style is the same as the embedded point style set and injected during the visual embedded point selection process.

[0049] After each event tracking configuration is automatically triggered, the page frame after the event tracking style is injected. That is, the screenshot of the page after style injection is compared with the Inject frame in the recording information corresponding to the event tracking configuration. The similarity between the two screenshots is determined to determine whether the two screenshots are similar. For example, if the first similarity between the two screenshots is greater than the preset first similarity threshold, it means that the two screenshots are similar and the event tracking configuration passes the similarity comparison; otherwise, the event tracking configuration fails the similarity comparison.

[0050] The first similarity between the page screenshot after style injection and the Inject frame can be predicted by a pre-trained page screenshot similarity detection model, such as a page screenshot similarity detection model trained based on artificial intelligence / machine learning models, or calculated based on similarity algorithms, such as Euclidean distance, etc., which are not limited in the embodiments of the present invention.

[0051] After comparison, the next event tracking configuration for the page is reloaded and automatically triggered. All event tracking configurations on the page are traversed to obtain the similarity comparison results of all event tracking configurations on the page.

[0052] Taking a click-type event tracking configuration for automatic triggering as an example, when the event tracking element is the confirmation button set in the application, the contents of its trajectory stack are as follows: trace = [{ / / Page user operation trajectory stack, one user operation corresponds to one object in the trajectory stack, that is, trajectory information, one trace can record multiple objects; operationType: click, / / This trajectory information records a mouse click behavior; elementXpath:id("app") / div[2] / div[1] / div[1] / div[2] / div[1] / div[2] / div[1] / div[2] / div[1] / div[2] / div[1] / div[2] / div[3] / / The complete XPath path of the DOM element that triggered this click operation; div[1], div[2], div[3], etc. represent DOM element identifiers; elementScreenshot:image1 / / Screenshot resource captured from the target element area when the operation is triggered, i.e., a page screenshot. image1 is the page screenshot identifier; }).

[0053] The event tracking configuration is as follows: config = { / / Event tracking configuration; "eventName": "Event 1", / / Event name; "eventTypeKey": "click", / / The operation type bound to the event tracker; "elementPath":"id(\"app\") / div[2] / div[1] / div[1] / div[2] / div[1] / div[3] / div[1] / div[1] / div[1] / section[1] / div[3] / button[2]", / / When configuring the backend tracking points, select the target confirmation button and record the element's XPath location path; "eventCode": "58_click_34cd41c4ff", / / Globally unique code for the event tracking point, consisting of page identifier 58 + operation type click + random hash string 34cd41c4ff, used to distinguish event tracking points in log reports; "pageUrl": "http: / / localhost:82 / ", / / The page address to which the event tracking configuration belongs; ... }

[0054] The rules for automatic triggering are as follows: Step 1: getElementByXpath(trace[0].elementXpath).click(); Here, getElementByXpath represents a custom utility function that searches for and returns the corresponding page element in the DOM tree of the current page based on the passed string; trace[0] represents retrieving the first operation record in the trace stack, i.e., the trace information; elementXpath represents obtaining the XPath path corresponding to the first operation record; click represents calling the native DOM click method to simulate the page element found by human click; Step 1 means first reading the XPath path that the user actually operated in the trace stack, finding the page element through the XPath path, automatically simulating clicking the page element, and restoring the user's previous operation.

[0055] Step 2: spotNode = getElemntByXpath(config.elementPath); Wherein, spotNode represents the event tracking node; config.elementPath represents reading the XPath path of the target event tracking button that is pre-saved in the event tracking configuration; getElementByXpath represents obtaining the page element based on the XPath path; Step 2 represents reading the XPath path of the event tracking configuration in the backend, finding the page element that needs to be automatically triggered based on the XPath path, and storing it in spotNode for later use.

[0056] Step 3: Perform embedded style processing on spotNode; that is, perform embedded style processing on the elements stored in spotNode. For details, please refer to the embedded style injection process in the above-mentioned visual embedded style selection, which will not be repeated here.

[0057] In step 1, the application settings drawer is popped up on the page by triggering the trajectory information in the trajectory stack, such as the application settings button. In step 2, the element corresponding to the visual tracking point configuration is obtained. In step 3, the style is processed.

[0058] It should be noted that operationType represents the type of user operation; elementXpath represents the element location information of the page that the user operates on, such as the XPath path; elementScreenshot represents the screenshot of the page after the user operation; eventName represents the name of the event; eventTypeKey represents the type of the event; elementPath represents the XPath of the event; eventCode represents the identifier of the event; and pageUrl represents the URL address of the page where the event is located.

[0059] This invention records the trajectory stack of the event tracking configuration during the visual selection process, and automatically triggers the event tracking configuration based on the trajectory stack to automate the event tracking configuration similarity comparison process. On the one hand, it can reduce manual intervention, greatly reduce the workload of development / operation / testing personnel, and lower labor costs; on the other hand, it can accurately locate event tracking configuration elements and efficiently filter out configurations that need to be re-tracked and those that do not need to be tracked.

[0060] In one optional embodiment, the similarity comparison between the embedded elements in the region block screenshot and the embedded elements in the injected frame screenshot is performed to obtain at least one pair of embedded elements, including: Based on the region block screenshot and the injection frame screenshot, a first input feature is constructed; Based on the embedded elements in the screenshot of the region block and the interactive feedback information generated after the corresponding embedded elements are automatically triggered, a second input feature is constructed. The first input feature and the second input feature are fed into a pre-trained similarity detection model to predict similarity, thereby obtaining the second similarity between each embedded element in the region block screenshot and each embedded element in the injected frame screenshot. Based on the second similarity between each embedded element in the region block screenshot and each embedded element in the injection frame screenshot, embedded element pairs are constructed; wherein, the embedded element pair includes: an embedded element in the region block screenshot and an embedded element in the injection frame screenshot with the highest second similarity.

[0061] During the process of traversing all the tracking point configurations on the page, the comparison between the screenshot of the page after automatic triggering and injection of the tracked styles and the Inject frame corresponding to the tracked information of the tracking point configuration is not all successful or all unsuccessful. This indicates that some tracked elements corresponding to the tracked configurations on the page have changed in the current version. This change may be that they have been deleted or that their position or style has been changed. In order to confirm the type of change of the tracked elements corresponding to the tracked configurations in the current version, this embodiment of the invention pulls the DOM structure of the previous version of the page and generates an AST; at the same time, based on the DOM structure of the current version of the page, an AST is generated, and the Diff algorithm is used to compare the ASTs of the two versions of the page to locate the area block where the tracked elements corresponding to the tracked configurations have changed.

[0062] Then, iterate through the corresponding event elements of the event configuration, compare the similarity between the event elements corresponding to the event configuration and all event elements in the changed area block, and obtain the second similarity between any event element corresponding to the event configuration and all event elements in the changed area block. If the second similarity of the element corresponding to the element with the highest second similarity is greater than the preset second similarity threshold, it means that within the changed area, the tracking element corresponding to this tracking configuration has only undergone position / style modifications in the current version. In this case, the two tracking elements corresponding to the element with the highest second similarity are submitted to the user for confirmation. If the user confirms that the tracking element within the changed area is the same as the tracking element corresponding to the tracking configuration, the tracking configuration is updated, such as updating the position / style modifications of the corresponding tracking element in the tracking configuration. If the user denies that the tracking element within the changed area is the same as the tracking element corresponding to the tracking configuration, then visual tracking selection is enabled. If the second similarity of the element corresponding to the element with the highest second similarity is less than the second similarity threshold, it means that the tracking element corresponding to the tracking configuration has been deleted in the current version within the changed area block, and then the visual tracking selection is directly enabled.

[0063] Because there are many similar elements on a page, such as two buttons with the same text and style but different meanings and functions, this invention introduces a similarity detection model based on collaborative representation blocks to improve the accuracy of determining whether the tracking elements in a changing area block are the same as the tracking elements corresponding to the tracking configuration. This model is used to calculate the similarity between the tracking elements corresponding to the tracking configuration and all tracking elements in the changing area block. The similarity detection model based on collaborative representation blocks is as follows: Figure 8 As shown.

[0064] The similarity detection model has two inputs: a collaborative representation input based on image data, namely the first input feature mentioned above, which includes screenshots of regions where the tracking elements have changed and Inject frames; and a collaborative representation input of tracking element functional data, namely the second input feature mentioned above, which includes tracking elements within screenshots of regions where the tracking elements have changed and interactive feedback information after the tracking elements corresponding to the tracking configuration are automatically triggered, such as interface requests and page jumps.

[0065] The collaborative representation of image data is input through the feature enhancement layer and then fed into the image collaborative representation extraction module. The image collaborative representation extraction module performs feature extraction and outputs the collaborative representation of image information. The feature enhancement layer is used to perform data enhancement operations such as rotation, cropping, scaling, and noise perturbation on the region block screenshots and Inject frames. The collaborative representation of the functional data of the embedded elements is input and its features are extracted by the collaborative representation extraction module of the embedded elements, and the collaborative representation of the embedded elements is output. Image information collaborative representation and embedded element collaborative representation are fused into multimodal features through a feature fusion network. The fused features are then input into the prediction layer for similarity discrimination. The output is the similarity result between the embedded elements in the changed region block and the embedded elements corresponding to the embedded configuration, thus determining whether the embedded elements in the changed region block are similar to the embedded elements corresponding to the embedded configuration.

[0066] For example, the collaborative representation input of image data is ,in, The Inject frame represents the configuration information for the data entry points. This represents a screenshot of a region / block. The data obtained after the feature enhancement layer is Among them, for The style injection area is clipped to obtain ;right The three channels are processed separately, and then feature enhancement is performed based on the element injection position to obtain... The specific steps are as follows: The RGB three channels are respectively , , ,in , , They represent The value of the pixel in the i-th row and j-th column in the RGB space, i=0,1,2,...,h,j=0,1,2,...,w, where h and w represent the total number of rows and columns of pixels in the region block screenshot, respectively; Then, feature enhancement is performed on each channel according to the element injection location. The position of the injected element on the region block screenshot is as follows: ;in , These represent the pixel positions of the left and right vertices of the element, respectively. , Let represent the position of the upper vertex pixel and the position of the lower vertex pixel of the element, respectively. The augmented data is as follows: (1); (2); in, express Data from any one of the channels; express The maximum value in, This represents the feature enhancement coefficient of the pixel in the i-th row and j-th column. , Indicates the boundary values ​​of the feature enhancement coefficient; when The corresponding pixel is not present. Internal time =1, when The corresponding pixel is At that time, The initial value is set to 2, and determined through model training. Specifically, it is expressed as follows: (3); (4); in, This represents the similarity result output by the model in the previous iteration. , The larger the value of , the more similar the two elements are. This indicates the user's feedback based on the similarity results output by the previous model. When the user feedback confirms that the two elements are the same element, When the user feedback indicates that the two elements are not the same element, F represents the nonlinear fusion function that couples the similarity result output by the model with the user feedback result; Indicates the growth coefficient. This represents the bias coefficient. Minimum value set by the user, to avoid The result is 0; The fusion coefficients represent the nonlinear fusion function F. This indicates the weight of the user's feedback result based on the previous similarity result; Indicates the previous iteration growth coefficient , the bias coefficient , and the fusion coefficient are all determined during the training process of the network model, has an initial value of 1, has an initial value of 0, has an initial value of 0.5.

[0067] It should be noted that to prevent problems such as gradient explosion and infinity during the training process, K needs to be set to a proper range, which can be set by the user according to the scenario. For example, when >K, =K, when <K, = K.

[0068] After performing feature enhancement on each channel, the enhanced data is input into the image collaborative representation extraction module. It should be noted that the user can independently select an appropriate network structure of the image collaborative representation extraction module according to the actual scenario, for example, a neural network for image feature extraction such as ResNet, which is not specifically limited in the embodiments of the present invention.

[0069] After feature extraction by the image collaborative representation extraction module, the collaborative representation of image information is output , where d represents the feature dimension.

[0070] Similarly, the collaborative representation of buried point element function data is input into the buried point element function collaborative representation extraction module for feature extraction, and the collaborative representation of the buried point element is output ; it should be noted that the user can independently select an appropriate network structure of the buried point element function collaborative representation extraction module according to the actual scenario, for example, a neural network for structured text feature extraction such as CNN and bidirectional long short-term memory network, which is not specifically limited in the embodiments of the present invention.

[0071] The above two collaborative representations are fused to obtain a fused feature , which is used as the input of the fusion network; wherein, .

[0072] It should be noted that the user can independently select appropriate network structures of the fusion network and the prediction layer according to the actual scenario, for example, a neural network such as Transformer based on multi-head attention fusion, and the prediction layer can adopt a fully connected layer for similarity prediction, which is not specifically limited in the embodiments of the present invention.

[0073] Through the fused feature The input is fed into a fusion network for feature fusion and similarity prediction, which yields the second similarity between the embedded elements within the changed region block and the corresponding embedded elements in the embedded configuration. This second similarity is then compared to a preset second similarity threshold to preliminarily determine whether the embedded elements within the changed region block are similar to the corresponding embedded elements in the embedded configuration, i.e., whether they are the same element.

[0074] In this embodiment of the invention, the similarity threshold can be set according to the real-time scenario or determined adaptively according to the random search algorithm, and is not limited in this embodiment of the invention.

[0075] It should be noted that if the similarity results output by the model initially determine that two elements are the same event tracking element, then a step is taken to allow the user to confirm whether the two elements are the same event tracking element.

[0076] Furthermore, to improve the accuracy of identifying failed visualization tracking point configurations, during the similarity comparison between the page screenshot after injecting the tracking point style and the Inject frame corresponding to the tracking point configuration's recorded information, a model with the same structure as the aforementioned similarity detection model can be used for similarity calculation. For example, the region block screenshots in the collaborative representation input of image data and the collaborative representation input of tracking point element function data in the similarity detection model can be replaced with the page screenshot after injecting the tracking point style for model training. This will yield a model for detecting the first similarity between the page screenshot after injecting the tracking point style and the Inject frame corresponding to the tracking point configuration's recorded information. It should be noted that the model training process is existing technology and will not be described in detail here.

[0077] This invention introduces a similarity detection model based on collaborative representation to detect the similarity between embedded elements in a variable area block on a page and the embedded elements corresponding to the embedded configuration. This can solve the problem of inaccurate element similarity detection caused by elements with similar styles but different functional meanings on the page, thereby effectively improving the accuracy of embedded element similarity detection.

[0078] See Figure 9 , Figure 9 This is a structural block diagram of a visualization tracking point processing device provided in an embodiment of the present invention. The visualization tracking point processing device includes: The first similarity comparison module 11 is used to inject styles into the tracking elements corresponding to the tracking configuration of the page to be tracked, obtain a screenshot of the page of the tracking configuration, and compare the similarity between the page screenshot and the injected frame screenshot associated with the tracking configuration. The difference analysis module 12 is used to perform difference analysis on the page and its previous version's historical pages when the page screenshots corresponding to some of the tracking point configurations and the injection frame screenshots fail the similarity comparison, and to locate the area block screenshots in the page where the tracking point elements have changed. The second similarity comparison module 13 is used to compare the similarity of the embedded elements in the region block screenshot with the embedded elements in the injection frame screenshot to obtain at least one embedded element pair; wherein, the embedded element pair includes: an embedded element in the region block screenshot and an embedded element in the injection frame screenshot. The visualization tracking point selection module 14 is used to determine the similarity of the tracking point element pairs and to perform visualization tracking point processing on the page based on the similarity determination results.

[0079] Furthermore, the device also includes: The trajectory stack initialization module is used to load the page to be marked with data points, and use the current screenshot of the page as the initial page screenshot to initialize the trajectory stack; The page screenshot comparison module is used to monitor the user's operation on the tracking configuration of the page, and compare the page screenshot in the trajectory stack information of the page generated after each operation with the page screenshot at the top of the trajectory stack. The trajectory information pushing module is used to push the page screenshot in the trajectory stack information into the trajectory stack when there is a difference between the page screenshot in the trajectory stack information and the page screenshot at the top of the trajectory stack, until the tracking point configuration is completed, and obtain the trajectory stack of multiple tracking point configurations of the page. Among them, the page screenshot of the trajectory information at the bottom of the trajectory stack in the previous tracking point configuration is compared with the initial page screenshot of the corresponding page. Figure 1 To.

[0080] In one optional embodiment, the first similarity comparison module 11 includes: The page screenshot generation unit is used to retrieve the trajectory stack corresponding to the tracking configuration of the page to be tracked in the application when the application is updated, and automatically trigger the style injection of the tracking element starting from the page screenshot at the bottom of the trajectory stack to obtain the page screenshot after the style injection corresponding to the tracking configuration. The similarity calculation unit is used to calculate the similarity between the page screenshot after style injection and the injection frame screenshot associated with the tracking point configuration, and obtain the first similarity between the page screenshot after style injection and the injection frame screenshot associated with the corresponding tracking point configuration. The first similarity determination unit is used to compare the corresponding tracking points when the first similarity between the page screenshot after style injection and the injected frame screenshot is greater than the preset first similarity threshold. The second similarity determination unit is used to determine that the corresponding event tracking configuration fails the similarity comparison when the first similarity between the page screenshot after style injection and the injected frame screenshot is not greater than the first similarity threshold.

[0081] In one optional embodiment, the difference analysis module 12 includes: The first abstract syntax tree construction unit is used to perform syntax analysis on the document object model of the page and construct the first DOM abstract syntax tree; The second abstract syntax tree construction unit is used to perform syntax analysis on the document object model of the historical page and construct the second DOM abstract syntax tree; The abstract syntax tree difference analysis unit is used to perform difference analysis on the first DOM abstract syntax tree and the second DOM abstract syntax tree, locate the area blocks in the page where the embedded elements have changed, and generate the corresponding area block screenshots.

[0082] In an optional embodiment, the second similarity comparison module 13 includes: The first input feature construction unit is used to construct a first input feature based on the region block screenshot and the injection frame screenshot; The second input feature construction unit is used to construct the second input feature based on the embedded elements in the region block screenshot and the interactive feedback information generated after the corresponding embedded elements are automatically triggered; The similarity prediction unit is used to feed the first input feature and the second input feature into a pre-trained similarity detection model to predict the similarity and obtain the second similarity between each embedded element in the region block screenshot and each embedded element in the injected frame screenshot. The tracking element pair construction unit is used to construct tracking element pairs based on the second similarity between each tracking element in the region block screenshot and each tracking element in the injection frame screenshot; wherein, the tracking element pair includes: one tracking element in the region block screenshot and one tracking element in the injection frame screenshot with the highest second similarity.

[0083] In one optional embodiment, the visual tracking point selection module 14 includes: The similarity threshold comparison unit is used to compare the second similarity between two embedded elements in the embedded element pair with a preset second similarity threshold. The prompting unit is used to trigger a prompt message when the second similarity between two embedded elements in the embedded element pair is greater than a preset second similarity threshold; the prompt message is used to instruct the user to confirm whether the two embedded elements in the embedded element pair are the same embedded element. The visual tracking point selection activation unit is used to perform visual tracking point selection on the page when the second similarity between two tracking points in the tracking point element pair is not greater than the second similarity threshold, or when the user confirms that the two tracking points in the tracking point element pair are not the same tracking point element. When the user confirms that the two event tracking elements in the event tracking element pair are the same event tracking element, update the event tracking configuration of the current version.

[0084] It should be noted that the working process of each module in the visualization tracking device described in the embodiments of the present invention can refer to the working process of the visualization tracking method described in the above embodiments, and the technical effect achieved is the same as that of the visualization tracking method described in the above embodiments, so it will not be repeated here.

[0085] See Figure 10 , Figure 10 This is a structural block diagram of the visual tracking point processing device provided in an embodiment of the present invention. The visual tracking point processing device includes a processor 21, a memory 22, and a computer program stored in the memory 22 and executable on the processor 21. When the processor 21 executes the computer program, it implements the steps in the above-described embodiments of the visual tracking point processing methods, such as steps S11 to S14.

[0086] For example, the computer program may be divided into one or more modules or units, which are stored in the memory 22 and executed by the processor 21 to complete the present invention. The one or more modules or units may be a series of computer program instruction segments capable of performing specific functions, which describe the execution process of the computer program in the visualization data tracking device.

[0087] The visualization tracking device may include, but is not limited to, a processor 21 and a memory 22. Those skilled in the art will understand that the schematic diagram is merely an example of the visualization tracking device and does not constitute a limitation on the device. It may include more or fewer components than illustrated, or combine certain components, or use different components. For example, the visualization tracking device may also include input / output devices, network access devices, buses, etc.

[0088] The processor 21 can be a Central Processing Unit (CPU), or other general-purpose processors, digital signal processors (DSPs), application-specific integrated circuits (ASICs), field-programmable gate arrays (FPGAs), or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. The general-purpose processor can be a microprocessor or any conventional processor. The processor 21 is the control center of the visualization tracking device, connecting all parts of the device via various interfaces and lines.

[0089] The memory 22 can be used to store the computer programs and / or modules. The processor 21 implements various functions of the visualization tracking device by running or executing the computer programs and / or modules stored in the memory 22 and calling the data stored in the memory 22. The memory 22 may mainly include a program storage area and a data storage area. The program storage area may store the operating system, at least one application program required for a function (such as sound playback function, image playback function, etc.), etc.; the data storage area may store data created according to the use of the mobile phone (such as audio data, phonebook, etc.). In addition, the memory 22 may include high-speed random access memory, and may also include non-volatile memory, such as hard disk, memory, plug-in hard disk, smart media card (SMC), secure digital (SD) card, flash card, at least one disk storage device, flash memory device, or other volatile solid-state storage device.

[0090] Wherein, if the modules or units integrated into the visualization tracking device are implemented as software functional units and sold or used as independent products, they can be stored in a computer-readable storage medium. Based on this understanding, all or part of the processes in the methods of the above embodiments of the present invention can also be implemented by a computer program instructing related hardware. The computer program can be stored in a computer-readable storage medium, and when the computer program is executed by the processor 21, it can implement the steps of the various method embodiments described above. Wherein, the computer program includes computer program code, which can be in the form of source code, object code, executable file, or some intermediate form, etc. The computer-readable medium can include: any entity or device capable of carrying the computer program code, recording medium, USB flash drive, portable hard drive, magnetic disk, optical disk, computer memory, read-only memory (ROM), random access memory (RAM), electrical carrier signal, telecommunication signal, and software distribution medium, etc.

[0091] It should be noted that the device embodiments described above are merely illustrative. The units described as separate components may or may not be physically separate, and the components shown as units may or may not be physical units; that is, they may be located in one place or distributed across multiple network units. Some or all of the modules can be selected to achieve the purpose of this embodiment according to actual needs. Furthermore, in the accompanying drawings of the device embodiments provided by this invention, the connection relationships between modules indicate that they have communication connections, which can be specifically implemented as one or more communication buses or signal lines. Those skilled in the art can understand and implement this without any creative effort.

[0092] The above description represents the preferred embodiments of the present invention. It should be noted that, for those skilled in the art, various improvements and modifications can be made without departing from the principles of the present invention, and these improvements and modifications are also considered to be within the scope of protection of the present invention.

Claims

1. A method for visualizing data tracking points, characterized in that, include: Style injection is performed on the tracking elements corresponding to the tracking configuration of the page to be tracked, a screenshot of the page with the tracking configuration is obtained, and the similarity of the page screenshot and the injected frame screenshot associated with the tracking configuration is compared. If some page screenshots corresponding to the aforementioned tracking point configurations fail the similarity comparison with the injected frame screenshots, a difference analysis is performed on the page and its previous version's historical pages to locate the area block screenshots where the tracking point elements on the page have changed. The similarity of the embedded elements in the region block screenshot and the embedded elements in the injection frame screenshot is compared to obtain at least one embedded element pair; wherein, the embedded element pair includes: one embedded element in the region block screenshot and one embedded element in the injection frame screenshot. The similarity of the tracked elements is determined, and the page is then processed with visual tracking based on the similarity determination results.

2. The visualization-based data tracking method as described in claim 1, characterized in that, The method further includes: Load the page to be tracked, and use the current screenshot of the page as the initial page screenshot to initialize the trajectory stack; Monitor user actions related to the event tracking configuration on the page, and compare the page screenshot in the trajectory stack information generated after each action with the page screenshot at the top of the trajectory stack. If there is a difference between the page screenshot in the trajectory stack information and the page screenshot at the top of the trajectory stack, push the page screenshot in the trajectory stack information into the trajectory stack until the tracking point configuration is completed, and obtain the trajectory stack of multiple tracking point configurations for the page. Among them, the screenshot of the trajectory information at the bottom of the trajectory stack in the previous tracking point configuration is consistent with the initial screenshot of the corresponding page.

3. The visualization-based data embedding method as described in claim 2, characterized in that, Style injection is performed on the tracking elements corresponding to the tracking configuration of the page to be tracked, a screenshot of the page with the tracking configuration is obtained, and a similarity comparison is performed between the page screenshot and the injected frame screenshot associated with the tracking configuration, including: When the application is updated, the tracking stack corresponding to the tracking configuration of the page to be tracked in the application is retrieved, and the style injection of the tracking element is automatically triggered starting from the page screenshot at the bottom of the tracking stack to obtain the page screenshot after the style injection corresponding to the tracking configuration. The similarity between the page screenshot after style injection and the injection frame screenshot associated with the event tracking configuration is calculated to obtain the first similarity between the page screenshot after style injection and the injection frame screenshot associated with the corresponding event tracking configuration. When the first similarity between the page screenshot after style injection and the injected frame screenshot is greater than the preset first similarity threshold, the corresponding event tracking configuration is compared based on similarity. When the first similarity between the page screenshot after style injection and the injected frame screenshot is not greater than the first similarity threshold, the corresponding event tracking configuration fails the similarity comparison.

4. The visualization-based data embedding method as described in claim 1, characterized in that, Perform a difference analysis on the page and its previous version's historical pages, and locate screenshots of the areas on the page where the embedded elements have changed, including: Perform syntactic analysis on the document object model of the page and construct the first DOM abstract syntax tree; Perform syntactic analysis on the document object model of the historical pages to construct a second DOM abstract syntax tree; Perform a difference analysis on the first DOM abstract syntax tree and the second DOM abstract syntax tree to locate the area blocks in the page where the embedded elements change, and generate the corresponding area block screenshots.

5. The visualization-based data tracking method as described in claim 1, characterized in that, The similarity of the embedded elements in the region block screenshot and the embedded elements in the injected frame screenshot is compared to obtain at least one pair of embedded elements, including: Based on the region block screenshot and the injection frame screenshot, a first input feature is constructed; Based on the embedded elements in the screenshot of the region block and the interactive feedback information generated after the corresponding embedded elements are automatically triggered, a second input feature is constructed. The first input feature and the second input feature are fed into a pre-trained similarity detection model to predict similarity, thereby obtaining the second similarity between each embedded element in the region block screenshot and each embedded element in the injected frame screenshot. Based on the second similarity between each embedded element in the region block screenshot and each embedded element in the injection frame screenshot, embedded element pairs are constructed; wherein, the embedded element pair includes: an embedded element in the region block screenshot and an embedded element in the injection frame screenshot with the highest second similarity.

6. The visualization-based data tracking method as described in claim 1, characterized in that, The similarity of the tracked element pairs is determined, and the page is then subjected to visual tracking processing based on the similarity determination results, including: The second similarity between two embedded elements in the embedded element pair is compared with a preset second similarity threshold. When the second similarity between two tracking elements in the tracking element pair is greater than a preset second similarity threshold, a prompt message is triggered; the prompt message is used to instruct the user to confirm whether the two tracking elements in the tracking element pair are the same tracking element. When the second similarity between two tracking elements in the tracking element pair is not greater than the second similarity threshold, or when the user confirms that the two tracking elements in the tracking element pair are not the same tracking element, the page is visually selected for tracking points. When the user confirms that the two event tracking elements in the event tracking element pair are the same event tracking element, update the event tracking configuration of the current version.

7. A visual data embedding processing device, characterized in that, include: The first similarity comparison module is used to inject styles into the tracking elements corresponding to the tracking configuration of the page to be tracked, obtain a screenshot of the page of the tracking configuration, and compare the similarity between the page screenshot and the injected frame screenshot associated with the tracking configuration. The difference analysis module is used to perform difference analysis on the page and its previous version's historical pages when some page screenshots corresponding to the tracking point configurations fail the similarity comparison with the injected frame screenshots, and to locate the area block screenshots in the page where the tracking point elements have changed. The second similarity comparison module is used to compare the similarity of the embedded elements in the region block screenshot with the embedded elements in the injection frame screenshot to obtain at least one embedded element pair; wherein, the embedded element pair includes: an embedded element in the region block screenshot and an embedded element in the injection frame screenshot. The visual tracking point selection module is used to determine the similarity of the tracking point pairs and to perform visual tracking point processing on the page based on the similarity determination results.

8. A visual data embedding processing device, characterized in that, include: A processor, a memory, and a computer program stored in the memory and configured to be executed by the processor, wherein the processor, when executing the computer program, implements the visualization tracking method as described in any one of claims 1 to 6.

9. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores a computer program, wherein, when the computer program is executed, it controls the device where the computer-readable storage medium is located to perform the visualization tracking method as described in any one of claims 1 to 6.

10. A computer program product, comprising a computer program or instructions, characterized in that, When the computer program or instructions are executed by the processor, they implement the visualization tracking method according to any one of claims 1 to 6.

Images