Method and device for intelligent event burying of a web system

Abstract

The application relates to a method and device for intelligent event burying of a web system, and belongs to the technical field of event burying. The method comprises the following steps: listening to a user click event, acquiring a dom element set of a user click event subject part; filtering the dom element set of the user click event subject part; traversing the filtered dom element set of the click event subject part to determine an operable event; acquiring information of the dom element set of the operable event to obtain operable event detailed information and user information; transmitting the operable event detailed information and the user information to a background through a request interface, saving the operable event detailed information and the user information to a database, and completing burying; wherein the operable event detailed information at least comprises a page title, a page path, a button name, a button icon and button coordinates. The application realizes automatic and intelligent event burying of a web system, automatically recognizes an operable button through code, and automatically completes event burying.

Description

Technical Field

[0001] This invention belongs to the field of event tracking technology, and particularly relates to a method and apparatus for intelligent event tracking in a web system. Background Technology

[0002] When implementing event tracking in a web system, developers need to actively insert tracking code at the locations where tracking is required and transmit the captured tracking information to the backend.

[0003] Because this operation requires developers to insert tracking code at each location where tracking is needed, two problems arise:

[0004] 1. When the system is large and there are many operations that require data tracking, it takes a lot of time to track data at each location.

[0005] 2. Every time a new or modified requirement is added, new tracking points must be added for the new requirement. Summary of the Invention

[0006] In view of the shortcomings of the prior art, the purpose of the invention is to provide a method and device for intelligent event tracking in a web system, which realizes automatic and intelligent event tracking in the web system. Users do not need to manually track events at each location, but the code automatically identifies operable buttons and automatically completes event tracking.

[0007] In a first aspect, the present invention provides a method for intelligent event tracking in a web system, comprising:

[0008] Listen for user click events and retrieve the collection of DOM elements representing the main body of the user click event.

[0009] Filter the collection of DOM elements that constitute the main body of a user click event;

[0010] Iterate through the filtered collection of DOM elements containing the main body of the click event to determine the operable events;

[0011] Information is retrieved from the collection of DOM elements with actionable events to obtain detailed information about the actionable events and user information;

[0012] By requesting the interface, the detailed information of the actionable events and user information are sent to the backend and saved to the database to complete the data tracking.

[0013] The details of actionable events include at least the following: page title, page path, button name, button icon, and button coordinates.

[0014] Furthermore, in the above-mentioned method for intelligent event tracking in a web system, listening to user click events and obtaining the DOM element set of the main body of the user click event includes:

[0015] Listen for user click events using document.onclick;

[0016] The collection of DOM elements for the main body of the click event is obtained through parameter e;

[0017] This can be represented as: document.onclick = function(e) { console.log(e);}.

[0018] Furthermore, in the above-mentioned method for intelligent event tracking in a web system, the set of DOM elements filtering the main body of the user click event includes:

[0019] Filter the collection of DOM elements in the main body of the user click event using the path field.

[0020] Furthermore, in the above-mentioned method for intelligent event tracking in a web system, the DOM element set of the filtered click event body is traversed to determine operable events, including:

[0021] Iterate through the path field and check if there are any operable tags in the path field;

[0022] If the determination result is that there is an operable label in the path field, then the click event corresponding to the path field is determined to be an operable event.

[0023] The iteration ends when nodeName is BODY;

[0024] Among them, operable tags include one or more of the following types: , <input> and <button> .

[0025] Furthermore, in the above-mentioned method for intelligent event tracking in a web system, the process of traversing the filtered collection of DOM elements representing the main body of the click event to determine operable events also includes:

[0026] Iterate through the path field and check if there are any operable tags in the path field;

[0027] If the result indicates that there is no operable label in the path field, then determine whether the path field is bound to a click event;

[0028] If the determination result is that the path field is bound to a click event, then the click event corresponding to the path field is determined to be an operable event.

[0029] The iteration ends when nodeName is BODY;

[0030] Click events include at least one or more of the following types: click and mousedown.

[0031] Furthermore, in the above-mentioned method for intelligent event tracking in a web system, information is obtained from the set of DOM elements representing operable events to obtain detailed information about the operable events and user information, including:

[0032] Get the page title for actionable events using document.title;

[0033] Get the page path for the actionable events using location.href;

[0034] Get the name of the event button that can be interacted with by using the innerText property;

[0035] Get the x-coordinate of the operable event button using e.pageX, and get the y-coordinate of the operable event button using e.pageY;

[0036] Retrieve images and icons of actionable event buttons, including:

[0037] Determine whether the domain contains child elements based on [dom].children.

[0038] If the result indicates that the event does not contain child elements, obtain the image and icon of the event button from the DOM element containing the event; if the result indicates that the event does contain child elements, iterate through the child elements [dom].children and check if there are img and i tags.

[0039] If the result indicates the existence of an `img` tag, obtain the image path of the actionable event button using `[children].currentSrc`; if the result indicates the existence of an `i` tag, obtain the complete button icon code for the actionable event using `[children].outerHTML`; if the result indicates neither `img` nor `i` tags exist, obtain the actionable event button image and icon using `[children].style.backgroundImage` and the root node `[dom].style.backgroundImage`.

[0040] Call https: / / xxx.co / json / to retrieve user information.

[0041] Furthermore, in the above-mentioned method for intelligent event tracking in a web system, obtaining the image icon through the DOM element of the operable event includes:

[0042] If the DOM element is an `img` tag, you can get the actionable event button image and actionable event button icon through `[dom].currentSrc`.

[0043] If the DOM element is an `i` tag, you can get the entire image of the actionable event button and the actionable event icon code through `[dom].outerHTML`;

[0044] If the DOM element is a tag other than the `i` tag and the `img` tag, you can get the actionable event button image and actionable event button icon through `[dom].style.backgroundImage`.

[0045] A second aspect of the present invention also provides an apparatus for intelligent event tracking in a web system, comprising:

[0046] Listening and getting modules: used to listen for user click events and get the collection of DOM elements that constitute the main body of the user click event;

[0047] Filtering module: Used to filter the collection of DOM elements in the main body of user click events;

[0048] Determine module: Used to traverse the DOM element collection of the main body of the filtered click events and determine the operable events;

[0049] Information Acquisition Module: Used to acquire detailed information about the actionable events and user information from the collection of DOM elements related to actionable events;

[0050] The event tracking module is used to send detailed information about actionable events and user information to the backend via a request interface, save it to the database, and complete the event tracking.

[0051] The details of actionable events include at least the following: page title, page path, button name, button icon, and button coordinates.

[0052] A third aspect of the present invention also provides an electronic device comprising: a processor and a memory;

[0053] The processor executes any of the above methods for intelligent event tracking in a web system by calling programs or instructions stored in memory.

[0054] In a fourth aspect, the present invention also provides a computer-readable storage medium storing a program or instructions that cause a computer to execute a method for intelligent event tracking in a web system as described in any of the preceding claims.

[0055] The beneficial effects of this invention are as follows: This invention obtains the DOM element set of the main body of the user click event by listening to user click events; filters the DOM element set of the main body of the user click event; iterates through the filtered DOM element set of the main body of the click event to determine operable events; obtains detailed information about the operable events and user information from the DOM element set of the operable events; and transmits the detailed information about the operable events and user information to the backend through a request interface, saves it to the database, and completes the event tracking. The detailed information about the operable events includes at least: page title, page path, button name, button icon, and button coordinates. This invention achieves automatic and intelligent event tracking for web systems. Users do not need to manually track events at each location; instead, the code automatically identifies operable buttons and automatically completes event tracking. Attached Figure Description

[0056] The accompanying drawings are for illustrative purposes only and are not intended to limit the invention. Throughout the drawings, the same reference numerals denote the same parts. It is obvious that the drawings described below are merely some embodiments of the present invention, and those skilled in the art can obtain other drawings based on these drawings.

[0057] Figure 1 A diagram illustrating a method for intelligent event tracking in a web system, provided by an embodiment of the present invention.

[0058] Figure 2 A method for obtaining a set of DOM elements representing the main body of a user click event, as provided in an embodiment of the present invention;

[0059] Figure 3 Method for determining operable events provided in embodiments of the present invention Figure 1 ;

[0060] Figure 4 Method for determining operable events provided in embodiments of the present invention Figure 2 ;

[0061] Figure 5 A diagram of a device for intelligent event tracking in a web system provided in an embodiment of the present invention;

[0062] Figure 6 This is a schematic block diagram of an electronic device provided in an embodiment of the present invention. Detailed Implementation

[0063] To enable those skilled in the art to better understand the technical solutions in the embodiments of the present invention, the technical solutions 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, not all embodiments. It should be understood that these descriptions are merely exemplary and are not intended to limit the scope of the present invention. Based on the embodiments of the present invention, all other embodiments obtained by those skilled in the art without creative effort should fall within the scope of protection of the present invention.

[0064] Furthermore, descriptions of well-known structures and techniques are omitted in the following description to avoid unnecessarily obscuring the concepts disclosed in this invention.

[0065] In the description of this invention, the terms "first," "second," and "third" are used for descriptive purposes only and should not be construed as indicating or implying relative importance. The terms "installed," "connected," and "linked" should be interpreted broadly; for example, they can refer to a fixed connection, a detachable connection, or an integral connection; they can refer to a mechanical connection or an electrical connection; they can refer to a direct connection or an indirect connection through an intermediate medium; and they can refer to the internal connection of two components. Those skilled in the art will understand the specific meaning of the above terms in this invention based on the specific circumstances.

[0066] Exemplary embodiments will now be described in detail, examples of which are illustrated in the accompanying drawings. When the following description relates to the drawings, unless otherwise indicated, the same numerals in different drawings denote the same or similar elements. The embodiments described in the following exemplary embodiments do not represent all embodiments consistent with the present invention. Rather, they are merely examples of methods and systems consistent with some aspects of the invention as detailed in the appended claims.

[0067] This invention proposes a method, apparatus, electronic device, and storage medium for intelligent event tracking in a web system. It enables automatic and intelligent event tracking in a web system, eliminating the need for users to manually track events at each location. Instead, the system automatically identifies operable buttons through code and completes event tracking automatically.

[0068] Before introducing the embodiments of the present invention, the technical terms involved in the present invention will be introduced first.

[0069] Web system: Also known as the World Wide Web system, it is an information service system on the Internet that integrates various media such as text, sound, animation, and video. It allows users to jump between different web pages through hyperlinks to browse and obtain information.

[0070] Event tracking: This is a term in the field of data collection (especially user behavior data collection), referring to the insertion of code at specific locations in an application or webpage to capture, process, and send data related to specific user behaviors or events. Through event tracking, product teams and data analysts can understand user habits and product usage, thereby providing data support for product optimization and decision-making.

[0071] Method Implementation Examples

[0072] Figure 1 This diagram illustrates a method for intelligent event tracking in a web system, as provided in an embodiment of the present invention.

[0073] In a first aspect, this invention proposes a method for intelligent event tracking in a web system, combining... Figure 1 It includes five steps, S1 to S5:

[0074] S1: Listen for user click events and obtain the collection of DOM elements for the main part of the user click event.

[0075] Specifically, in this embodiment of the invention, the method for listening to user click events and obtaining the set of DOM elements of the main part of the user click event is described in detail below.

[0076] S2: Filters the collection of DOM elements that constitute the main body of a user click event.

[0077] Specifically, in this embodiment of the invention, the method for filtering the set of DOM elements in the main body of a user click event is described in detail below.

[0078] S3: Traverse the set of DOM elements in the main body of the filtered click event to determine the operable events.

[0079] Specifically, in this embodiment of the invention, the method for traversing the set of DOM elements in the filtered click event body to determine operable events is described in detail below.

[0080] S4: Obtain detailed information about the actionable events and user information from the collection of DOM elements containing actionable events.

[0081] Specifically, in this embodiment of the invention, the method for obtaining detailed information about operable events and user information by acquiring information from the DOM element set of operable events is described in detail below.

[0082] S5: Send detailed information about actionable events and user information to the backend via the request interface, save it to the database, and complete the event tracking.

[0083] The details of actionable events include at least the following: page title, page path, button name, button icon, and button coordinates.

[0084] Specifically, in this embodiment of the invention, all detailed information of the operation event and user information are transmitted to the backend through the request interface, saved to the database, and the data tracking is completed.

[0085] For example: fetch(` / eventBuryingPoint / setData`,{

[0086] method:"post",

[0087] headers:{

[0088] "Content-Type":"application / x-www-form-urlencoded; charset=UTF-8"

[0089] },

[0090] body: `pageTitle=${page title}&pageUrl=${page path}&eventName=${event button name}&eventCoordinate=${event button coordinates}&eventImg=${event button image}&eventIcon=${event button icon}……`

[0091] }).then(response=>{

[0092] if (response === 200) {

[0093] / / Inbound successful

[0094] }

[0095] })

[0096] Figure 2 This diagram illustrates a method for obtaining a set of DOM elements representing the main body of a user click event, as provided in an embodiment of the present invention.

[0097] Furthermore, in the aforementioned method for intelligent event tracking in a web system, user click events are monitored, the set of DOM elements representing the main body of the user click event is obtained, and then... Figure 2 It includes two steps, S21 and S22:

[0098] S21: Listen for user click events using document.onclick;

[0099] S22: Obtain the collection of DOM elements for the main body of the click event using parameter e;

[0100] This can be represented as: document.onclick = function(e) { console.log(e);}.

[0101] Specifically, in this embodiment of the invention, by

[0102] document.onclick = function(e) { console.log(e);} Listen for all click events. When the user clicks, the collection of DOM elements in the main body of the click event is obtained through the parameter e.

[0103] Furthermore, in the above-mentioned method for intelligent event tracking in a web system, the set of DOM elements filtering the main body of the user click event includes:

[0104] Filter the collection of DOM elements in the main body of the user click event using the path field.

[0105] Specifically, in this embodiment of the invention, parameter e contains a path field, which records the set of DOM elements of all box models corresponding to the click operation. It is an array with indices starting from 0 and sequentially from the innermost to the outermost DOM elements.

[0106] Figure 3 Method for determining operable events provided in embodiments of the present invention Figure 1 .

[0107] Furthermore, in the aforementioned method for intelligent event tracking in a web system, the DOM element set of the filtered click event body is traversed to determine operable events, and then combined with... Figure 3 It includes three steps, S31 to S33:

[0108] S31: Iterate through the path field and determine whether there are operable tags in the path field.

[0109] S32: If the judgment result is that there is an operable label in the path field, determine that the click event corresponding to the path field is an operable event;

[0110] S33: End the traversal when nodeName is BODY;

[0111] Among them, operable tags include one or more of the following types: , <input> and < / button> <button> .

[0112] Specifically, in this embodiment of the invention, the path field is traversed, and when [dom].tagName is found to be A, it is determined that... Label, The tag may contain redirects. It is an operable tag; when [dom].tagName is INPUT, it is determined to be... <input> The tag `` indicates that the tag is a form submission button when its `type` is set to `submit`. <input> The tag is an operable tag; when [dom].tagName exists and is BUTTON, it is determined to be... < / button> <button> The tag `` indicates that the tag is a form submission button when its `type` is set to `submit`.< / button> <button> The tag is an operable tag. The traversal ends when nodeName is BODY, and the result is a collection of all DOM elements in the main body of the click event. nodeName being BODY is the main body of the HTML document.

[0113] Figure 4 Method for determining operable events provided in embodiments of the present invention Figure 2 .

[0114] Furthermore, in the aforementioned method for intelligent event tracking in a web system, the DOM element set of the filtered click event body is traversed to determine operable events, and then combined with... Figure 4 It also includes four steps, S41 to S44:

[0115] S41: Iterate through the path field and determine whether there are operable tags in the path field;

[0116] S42: If the result of the judgment is that there is no operable label in the path field, then determine whether the path field is bound to a click event;

[0117] S43: If the judgment result is that the path field is bound to a click event, determine that the click event corresponding to the path field is an operable event;

[0118] S44: End the traversal when nodeName is BODY;

[0119] The bound click events must include at least one or more of the following types: click and mousedown.

[0120] Specifically, in this embodiment of the invention, the path field is traversed, and when it does not exist... , <input> and

[0121] < / button> <button> When encountering operable tags, it is necessary to determine whether a click event is bound. The getEventListeners plugin can be installed for this determination. After the installation is complete, the element can be determined via the [dom].getEventListeners() method: if a click or mousedown event exists in [dom].getEventListeners(), it is determined that a click event exists in the path field, which is recorded as an operable event.

[0122] The methods for installing the getEventListeners plugin include:

[0123] Method 1 (npm package installation):

[0124] npm install getEventListeners --save

[0125] Method 2 (cdn import):

[0126] <script src='https: / / cdn.xxx.net / gh / colxi / xxx / src / getEventListen

[0127] ers.min.js'>.

[0128] When obtaining the detailed information of the operable event, the following four points need to be considered:

[0129] 1. The click button corresponding to the operation event may be in several forms such as text, image, icon or blank block;

[0130] 2. The image may not be in the form of an img tag, but introduced through css background;

[0131] 3. Data such as text, images, and icons may be contained in the child elements of the operation event, not necessarily on the surface layer of the operation event, and the button may be composed of text, images, and icons together, for example:

[0132] <div class＝”btn”onclick＝”fn()”>

[0133] <img src＝”xxxxx.png”>

[0134] <span class＝”text”> Query

[0135]

[0136] In the above example, the operation event is on the dom node with the class name btn, but the valid information of the button is the image of the child element and the text with the class name text, so special processing is required;

[0137] 4. For the input tag, the text should be obtained from value instead of innerText.

[0138] Based on the above reasons, the detailed information of the operable event is obtained through the following method.

[0139] Furthermore, in the above-mentioned method for intelligent event tracking in a web system, information is obtained from the set of DOM elements representing operable events to obtain detailed information about the operable events and user information, including:

[0140] Get the page title for actionable events using document.title;

[0141] Get the page path for the actionable events using location.href;

[0142] Get the name of the event button that can be interacted with by using the innerText property;

[0143] Get the x-coordinate of the operable event button using e.pageX, and get the y-coordinate of the operable event button using e.pageY;

[0144] Retrieve images and icons of actionable event buttons, including:

[0145] Determine whether the domain contains child elements based on [dom].children.

[0146] If the result indicates that the event does not contain child elements, obtain the image and icon of the event button from the DOM element containing the event; if the result indicates that the event does contain child elements, iterate through the child elements [dom].children and check if there are img and i tags.

[0147] If the result indicates the existence of an `img` tag, obtain the image path of the actionable event button using `[children].currentSrc`; if the result indicates the existence of an `i` tag, obtain the complete button icon code for the actionable event using `[children].outerHTML`; if the result indicates neither `img` nor `i` tags exist, obtain the actionable event button image and icon using `[children].style.backgroundImage` and the root node `[dom].style.backgroundImage`.

[0148] Call https: / / xxx.co / json / to retrieve user information.

[0149] Specifically, in this embodiment of the invention, obtaining the event button name of the operable event through the innerText property includes: obtaining the text of the operation button through the innerText property of the DOM element collection of the operable event. This operation can obtain the text under the operation button, including the text of child elements, as the event button name; document.onclick=function(e){console.log(e);} When listening for the click event, the parameter e can be obtained through e.pageX to obtain the horizontal coordinate of the event button, and through e.pageY to obtain the vertical coordinate of the event button. The user information includes at least: user IP, user region, and latitude and longitude information. The operable event button image and operable event button icon are obtained through the DOM element of the operable event in detail below.

[0150] Furthermore, in the above-mentioned method for intelligent event tracking in a web system, obtaining the image icon through the DOM element of the operable event includes:

[0151] If the DOM element is an `img` tag, you can get the actionable event button image and actionable event button icon through `[dom].currentSrc`.

[0152] If the DOM element is an `i` tag, you can get the entire image of the actionable event button and the actionable event icon code through `[dom].outerHTML`;

[0153] If the DOM element is a tag other than the `i` tag and the `img` tag, you can get the actionable event button image and actionable event button icon through `[dom].style.backgroundImage`.

[0154] It should be understood that the above steps are used to obtain the images and icons of the operable event buttons; if none are available, they will be empty.

[0155] In some embodiments, a manual event tracking interface can be added, allowing users to manually track events for specific scenarios when event tracking cannot be automatically triggered.

[0156] In some embodiments, a switch option can also be added, with a switch button added based on the current page, event name, image, etc. When turned off, certain operations that do not need to be recorded can be canceled.

[0157] Device Examples

[0158] Figure 5 This is a diagram of a device for intelligent event tracking in a web system, provided as an embodiment of the present invention.

[0159] In a second aspect, the present invention also proposes a device for intelligent event tracking in a web system, combined with... Figure 5 ,include:

[0160] Listening module 51 and getting module 52: used to listen for user click events and get the collection of DOM elements in the main part of the user click event.

[0161] Specifically, in this embodiment of the invention, the listening module 51 listens for user click events, and the acquisition module 52 acquires the DOM element set of the main part of the user click event.

[0162] Filtering module 53: Used to filter the collection of DOM elements in the main body of user click events.

[0163] Specifically, in this embodiment of the invention, the filtering module 53 filters the set of DOM elements in the main part of the user click event.

[0164] Module 54: Used to iterate through the filtered collection of DOM elements in the main body of the click event and determine the operable events.

[0165] Specifically, in this embodiment of the invention, the determining module 54 traverses the set of DOM elements in the main body of the click event after filtering to determine the operable events.

[0166] Information Acquisition Module 55: Used to acquire information from the collection of DOM elements of operable events, obtaining detailed information about operable events and user information.

[0167] Specifically, in this embodiment of the invention, the information acquisition module 55 acquires information from the set of DOM elements of operable events to obtain detailed information about operable events and user information.

[0168] Event tracking module 56: Used to send detailed information about actionable events and user information to the backend via a request interface, save it to the database, and complete the event tracking.

[0169] The details of actionable events include at least the following: page title, page path, button name, button icon, and button coordinates.

[0170] Specifically, in this embodiment of the invention, the event tracking module 56 transmits detailed information about operable events and user information to the backend through a request interface, saves it to the database, and completes the event tracking.

[0171] A third aspect of the present invention also provides an electronic device comprising: a processor and a memory;

[0172] The processor executes any of the above methods for intelligent event tracking in a web system by calling programs or instructions stored in memory.

[0173] In a fourth aspect, the present invention also provides a computer-readable storage medium storing a program or instructions that cause a computer to execute a method for intelligent event tracking in a web system as described in any of the preceding claims.

[0174] Figure 6 This is a schematic block diagram of an electronic device provided in an embodiment of the present invention.

[0175] like Figure 6 As shown, the electronic device includes at least one processor 601, at least one memory 602, and at least one communication interface 603. The various components of the electronic device are coupled together via a bus system 604. The communication interface 603 is used for information transmission with external devices. It is understood that the bus system 604 is used to implement communication between these components. In addition to a data bus, the bus system 604 also includes a power bus, a control bus, and a status signal bus. However, for clarity, ... Figure 6 The general designated all buses as Bus System 604.

[0176] It is understood that the memory 602 in this embodiment may be volatile memory or non-volatile memory, or may include both volatile and non-volatile memory.

[0177] In some implementations, memory 602 stores elements such as executable units or data structures, or subsets thereof, or extended sets thereof: operating systems and applications.

[0178] The operating system, comprising various system programs such as the framework layer, core library layer, and driver layer, is used to implement various basic business functions and handle hardware-based tasks. The application programs, including media players and browsers, are used to implement various application functions. The program implementing any method in the web system intelligent event tracking method provided in this embodiment of the invention can be included in the application program.

[0179] In this embodiment of the invention, the processor 601 executes the steps of various embodiments of the method for intelligent event tracking in a web system provided by the present invention by calling the program or instructions stored in the memory 602, specifically, the program or instructions stored in the application.

[0180] Listen for user click events and retrieve the collection of DOM elements representing the main body of the user click event.

[0181] Filter the collection of DOM elements that constitute the main body of a user click event;

[0182] Iterate through the filtered collection of DOM elements containing the main body of the click event to determine the operable events;

[0183] Information is retrieved from the collection of DOM elements with actionable events to obtain detailed information about the actionable events and user information;

[0184] By requesting the interface, the detailed information of the actionable events and user information are sent to the backend and saved to the database to complete the data tracking.

[0185] The details of actionable events include at least the following: page title, page path, button name, button icon, and button coordinates.

[0186] Any method in the intelligent event tracking method for a web system provided in this embodiment of the invention can be applied to, or implemented by, the processor 601. The processor 601 can be an integrated circuit chip with signal processing capabilities. During implementation, each step of the above method can be completed by the integrated logic circuits in the hardware of the processor 601 or by instructions in software form. The processor 601 can be a general-purpose processor, a digital signal processor (DSP), an application-specific integrated circuit (ASIC), a field-programmable gate array (FPGA), or other programmable logic devices, discrete gate or transistor logic devices, or discrete hardware components. The general-purpose processor can be a microprocessor or any conventional processor, etc.

[0187] In the method for intelligent event tracking in a web system provided by this invention, any step can be directly implemented by a hardware decoding processor, or by a combination of hardware and software units within the decoding processor. The software units can reside in readily available storage media in the art, such as random access memory, flash memory, read-only memory, programmable read-only memory, electrically erasable programmable memory, or registers. This storage medium is located in memory 602, and processor 601 reads information from memory 602 and combines it with hardware to complete the steps of the method.

[0188] Those skilled in the art will understand that although some embodiments described herein include certain features included in other embodiments but not others, combinations of features from different embodiments are meant to be within the scope of the invention and form different embodiments.

[0189] Those skilled in the art will understand that the descriptions of the various embodiments have different focuses, and for parts not described in detail in a certain embodiment, reference can be made to the relevant descriptions of other embodiments.

[0190] Although embodiments of the present invention have been described in conjunction with the accompanying drawings, those skilled in the art can make various modifications and variations without departing from the spirit and scope of the invention. All such modifications and variations fall within the scope defined by the appended claims. The above are merely specific embodiments of the present invention, but the scope of protection of the present invention is not limited thereto. Any person skilled in the art can easily conceive of various equivalent modifications or substitutions within the technical scope disclosed in the present invention, and these modifications or substitutions should all be covered within the scope of protection of the present invention. Therefore, the scope of protection of the present invention should be determined by the scope of the claims.

[0191] The above are merely specific embodiments of the present invention, but the scope of protection of the present invention is not limited thereto. Any person skilled in the art can easily conceive of various equivalent modifications or substitutions within the technical scope disclosed in the present invention, and these modifications or substitutions should all be covered within the scope of protection of the present invention. Therefore, the scope of protection of the present invention should be determined by the scope of the claims.< / button>

Claims

1. A method for intelligent event tracking in a web system, characterized in that, include: Listen for user click events and retrieve the collection of DOM elements representing the main body of the user click event. Filter the collection of DOM elements that constitute the main body of a user click event; Iterate through the filtered collection of DOM elements containing the main body of the click event to determine the operable events; Information is retrieved from the collection of DOM elements with actionable events to obtain detailed information about the actionable events and user information; By requesting the interface, the detailed information of the actionable events and user information are sent to the backend and saved to the database to complete the data tracking. The details of actionable events include at least: page title, page path, button name, button icon, and button coordinates; Filter the collection of DOM elements in the main body of the user click event, including: Filter the collection of DOM elements in the main body of the user click event using the path field; Iterate through the filtered collection of DOM elements representing the main body of the click events to determine the operable events, including: Iterate through the path field and check if there are any operable tags in the path field; If the determination result is that there is an operable label in the path field, then the click event corresponding to the path field is determined to be an operable event. If the result of the determination is that there is no operable tag in the path field, then determine whether the path field is bound to a click event; if the result of the determination is that the path field is bound to a click event, then determine that the click event corresponding to the path field is an operable event. The iteration ends when nodeName is BODY; Among them, operable tags include one or more of the following types: , <input> and <button> The path field records the collection of DOM elements of all box models corresponding to the click operation. It is an array with the index starting from 0 and sequentially from the innermost to the outermost DOM element. The click event includes at least one or more of the following types: click and mousedown.< / button> Information retrieval is performed on the collection of DOM elements with actionable events to obtain detailed information about the actionable events and user information, including: Get the page title for actionable events using document.title; Get the page path for the actionable events using location.href; Get the name of the event button that can be interacted with by using the innerText property; Get the x-coordinate of the operable event button using e.pageX, and get the y-coordinate of the operable event button using e.pageY; Retrieve images and icons of actionable event buttons, including: Determine whether the domain contains child elements based on [dom].children. If the result indicates that the event does not contain child elements, obtain the image and icon of the event button from the DOM element containing the event; if the result indicates that the event does contain child elements, iterate through the child elements [dom].children and check if there are img and i tags. If the result indicates the existence of an `img` tag, obtain the image path of the actionable event button using `[children].currentSrc`; if the result indicates the existence of an `i` tag, obtain the complete button icon code for the actionable event using `[children].outerHTML`; if the result indicates neither `img` nor `i` tags exist, obtain the actionable event button image and icon using `[children].style.backgroundImage` and the root node `[dom].style.backgroundImage`. Call https: / / xxx.co / json / to retrieve user information; Retrieving image icons from DOM elements with actionable events, including: If the DOM element is an `img` tag, you can get the actionable event button image and actionable event button icon through `[dom].currentSrc`. If the DOM element is an `i` tag, you can obtain the entire image and action icon code of the actionable event button through `[dom].outerHTML`. If the DOM element is a tag other than the `i` tag and the `img` tag, then... [dom].style.backgroundImage retrieves the image and icon of the actionable event button.

2. The method for intelligent event tracking in a web system according to claim 1, characterized in that, Listen for user click events and retrieve the collection of DOM elements representing the main body of the user click event, including: Listen for user click events using document.onclick; The collection of DOM elements for the main body of the click event is obtained through parameter e; This can be represented as: document.onclick=function(e){console.log(e);}.

3. A device for intelligent event tracking in a web system, characterized in that, include: Listening and getting modules: used to listen for user click events and get the collection of DOM elements that constitute the main body of the user click event; Filtering module: Used to filter the collection of DOM elements in the main body of a user click event; Determine module: Used to traverse the DOM element collection of the main body of the filtered click events and determine the operable events; Information Acquisition Module: Used to acquire detailed information about the actionable events and user information from the collection of DOM elements related to actionable events; The event tracking module is used to send detailed information about actionable events and user information to the backend via a request interface, save it to the database, and complete the event tracking. The details of actionable events include at least: page title, page path, button name, button icon, and button coordinates; Filter the collection of DOM elements in the main body of the user click event, including: Filter the collection of DOM elements in the main body of the user click event using the path field; Iterate through the filtered collection of DOM elements representing the main body of the click events to determine the operable events, including: Iterate through the path field and check if there are any operable tags in the path field; If the determination result is that there is an operable label in the path field, then the click event corresponding to the path field is determined to be an operable event. If the result of the determination is that there is no operable tag in the path field, then determine whether the path field is bound to a click event; if the result of the determination is that the path field is bound to a click event, then determine that the click event corresponding to the path field is an operable event. The iteration ends when nodeName is BODY; Among them, operable tags include one or more of the following types: , <input> and <button> The path field records the collection of DOM elements of all box models corresponding to the click operation. It is an array with the index starting from 0 and sequentially from the innermost to the outermost DOM element. The click event includes at least one or more of the following types: click and mousedown.< / button> Information retrieval is performed on the collection of DOM elements with actionable events to obtain detailed information about the actionable events and user information, including: Get the page title for actionable events using document.title; Get the page path for the actionable events using location.href; Get the name of the event button that can be interacted with by using the innerText property; Get the x-coordinate of the operable event button using e.pageX, and get the y-coordinate of the operable event button using e.pageY; Retrieve images and icons of actionable event buttons, including: Determine whether the domain contains child elements based on [dom].children. If the result indicates that the event does not contain child elements, obtain the image and icon of the event button from the DOM element containing the event; if the result indicates that the event does contain child elements, iterate through the child elements [dom].children and check if there are img and i tags. If the result indicates the existence of an `img` tag, obtain the image path of the actionable event button using `[children].currentSrc`; if the result indicates the existence of an `i` tag, obtain the complete button icon code for the actionable event using `[children].outerHTML`; if the result indicates neither `img` nor `i` tags exist, obtain the actionable event button image and icon using `[children].style.backgroundImage` and the root node `[dom].style.backgroundImage`. Call https: / / xxx.co / json / to retrieve user information; Retrieving image icons from DOM elements with actionable events, including: If the DOM element is an `img` tag, you can get the actionable event button image and actionable event button icon through `[dom].currentSrc`. If the DOM element is an `i` tag, you can obtain the entire image and action icon code of the actionable event button through `[dom].outerHTML`. If the DOM element is a tag other than the `i` tag and the `img` tag, then... [dom].style.backgroundImage retrieves the image and icon of the actionable event button.

4. An electronic device, characterized in that, include: Processor and memory; The processor executes a method for intelligent event tracking in a web system as described in any one of claims 1 to 2 by calling programs or instructions stored in the memory.

5. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores a program or instructions that cause a computer to perform a method for intelligent event tracking in a web system as described in any one of claims 1 to 2.

Images