Point burying method, device, equipment and medium

Abstract

The embodiment of the invention provides a point burying method and device, equipment and a medium. According to the embodiment of the invention, the burying point parameters are declared through the v-sa instruction in the Vue component template, and the burying point configuration is concentrated on the template level, so that the business code does not need to directly contain burying point calling logic, the separation of the configuration and the code is realized, the coupling degree is reduced, and the business code change risk caused by the modification of the burying point is reduced. According to the method, a uniform buried point configuration specification can be formed through declaration of buried point parameters in the instruction, the problems of point location dispersion and non-uniform parameter formats in manual buried point are avoided, and the parameters are transmitted according to a preset rule by analyzing the parameters declarated by the v-sa instruction and automatically binding corresponding event monitors for elements, so that errors caused by manual operation are reduced, and the efficiency is improved. And the data acquisition accuracy is improved. The controllability of manual point burying is reserved, and the invasiveness and the maintenance cost are reduced through instructions; the problem of insufficient data granularity without burying points is solved, and false alarm and missing alarm are reduced through accurate binding.

Description

TECHNICAL FIELD

[0001] The present application relates to the field of data processing, and in particular to a method and device for embedding points, equipment and medium. BACKGROUND

[0002] With the rapid development of Internet products, the collection and analysis of user behavior data have become an important basis for product optimization and business decision-making. Front-end embedding is a major means of data collection and is widely used in Web and mobile products. Common embedding methods include manual embedding, no embedding (automatic embedding), etc. Two schemes are adopted in related technologies: Scheme 1: manual embedding; developers directly call the API of the embedding SDK in the business code to report events. The disadvantage of this scheme is that it is highly invasive, the business code is coupled with the embedding logic, and the maintenance cost is high; the embedding points are scattered, and it is difficult to manage and reuse them uniformly; embedding parameters are easily omitted or incorrect, affecting data accuracy. Scheme 2: no embedding (automatic embedding); the software development kit (SDK) automatically listens to user operations (such as clicking, page browsing, etc.), without the need for manual embedding by developers. The disadvantage of this scheme is that the data granularity is limited, and it is difficult to collect business-related custom parameters; false positives and false negatives are common, and data quality is difficult to guarantee; there is insufficient support for special interactions or custom events. SUMMARY

[0003] The embodiments of the present application provide a method and device for embedding points, equipment and medium, to solve the problems in the prior art.

[0004] In a first aspect, the embodiments of the present application provide a method for embedding points, which comprises: obtaining an embedding parameter declared by a v-sa instruction in a Vue component template; parsing the embedding parameter to obtain an element corresponding to the embedding parameter; binding an event listener corresponding to the embedding parameter to the element; and performing event listening corresponding to the element based on the event listener; wherein the event includes a click event, a page loading event and other events.

[0005] Further, the obtaining method of the v-sa instruction comprises: extracting an event type and an extended parameter included in the embedding parameter through a preset parsing rule; processing the event type and the extended parameter included in the embedding parameter through a plug-in method in a Vue entry file to register the v-sa instruction.

[0006] Further, before the obtaining an embedding parameter declared by a v-sa instruction in a Vue component template, the method further comprises: Import the data tracking plugin into the entry file and trigger the plugin installation process by calling the application instance's global installation hook; wherein, the installation process performs initialization configuration, registers global tracking attributes, and completes the global registration of custom commands through the application instance's command methods.

[0007] Furthermore, the method also includes: If an event is detected, the target element corresponding to the event is obtained; the target embedding parameters corresponding to the target element are assembled.

[0008] Furthermore, the method also includes: Call the event tracking SDK to report data.

[0009] Furthermore, the method also includes: If an event is detected to have been triggered a certain number of times within a preset time period, then throttling will be performed on that event to avoid duplicate reporting.

[0010] Furthermore, the method also includes: If an element uninstallation instruction is received, the uninstallation element carried during the element uninstallation process is obtained; Remove the event listener corresponding to the unloaded element.

[0011] Secondly, embodiments of this application also provide a data embedding device, the device comprising: The `get` module is used to retrieve the event tracking parameters declared in the Vue component template via the `v-sa` directive. The processing module is used to parse the tracking parameters, obtain the element corresponding to the tracking parameters, bind the event listener corresponding to the tracking parameters to the element, and listen for events corresponding to the element based on the event listener; wherein, the events include click events, page load events and other events.

[0012] Furthermore, the processing module is also used to extract the event types and extended parameters included in the tracking parameters through preset parsing rules; in the Vue entry file, the event types and extended parameters included in the tracking parameters are processed through a plugin to register the v-sa command.

[0013] Furthermore, the processing module is also used to import the data tracking plugin into the entry file and call the global installation hook of the application instance to trigger the plugin installation process; wherein, the installation process performs initialization configuration, registers global tracking attributes, and completes the global registration of custom instructions through the instruction methods of the application instance.

[0014] Furthermore, the processing module is also used to obtain the target element corresponding to the event if a certain event is detected; and to assemble the target embedding parameters corresponding to the target element.

[0015] Furthermore, the processing module is also used to call the data reporting SDK to report data.

[0016] Furthermore, the processing module is also used to perform throttling on the event if the number of times a certain event is detected to have been triggered reaches a preset number within a preset time period, so as to avoid repeated reporting.

[0017] Furthermore, the processing module is also configured to, if an element uninstallation instruction is received, obtain the uninstallation element carried during the element uninstallation execution; and remove the event listener corresponding to the uninstallation element.

[0018] Thirdly, embodiments of this application also provide an electronic device, which includes at least a processor and a memory, wherein the processor is used to execute the steps of any embedding method when executing a computer program stored in the memory.

[0019] Fourthly, embodiments of this application also provide a computer-readable storage medium, characterized in that it stores a computer program, which, when executed by a processor, performs the steps of any embedding method.

[0020] In this embodiment, the tracking parameters are declared through the `v-sa` directive in the Vue component template, centralizing the tracking configuration at the template level. Business code does not need to directly include tracking call logic, achieving separation of configuration and code, reducing coupling, and minimizing the risk of business code changes due to tracking modifications. Declaring tracking parameters in the directive creates a unified tracking configuration standard, avoiding the problems of scattered points and inconsistent parameter formats in manual tracking. Furthermore, by parsing the parameters declared by the `v-sa` directive, corresponding event listeners are automatically bound to elements, ensuring that parameters are passed according to preset rules, reducing errors caused by human operation, and improving the accuracy of data collection. This approach retains the controllability of manual tracking while reducing invasiveness and maintenance costs through directives; it solves the problem of insufficient data granularity in no-code tracking while reducing false positives and false negatives through precise binding. Attached Figure Description

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

[0022] Figure 1A schematic diagram of the embedding process provided in this application embodiment; Figure 2 A detailed process diagram provided for an embodiment of this application; Figure 3 This is a schematic diagram of the structure of an embedded point device provided in an embodiment of this application; Figure 4 This is a schematic diagram of an electronic device structure provided in an embodiment of this application. Detailed Implementation

[0023] The present application will now be described in further detail with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of the present application, and not all embodiments. Based on the embodiments of the present application, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of the present application.

[0024] To address the problems in related technologies, embodiments of this application provide a method, apparatus, device, and medium for embedding data points.

[0025] The event tracking method includes: obtaining the event tracking parameters declared in the Vue component template via the v-sa directive on the electronic device; parsing the event tracking parameters to obtain the element corresponding to the event tracking parameters; binding the event listener corresponding to the event tracking parameters to the element; and listening for the corresponding events of the element based on the event listener; wherein, the events include click events, page load events and other events.

[0026] Example 1: Figure 1 A schematic diagram of a data embedding process provided in this application embodiment includes the following steps: S101: Retrieves the event tracking parameters declared in the Vue component template via the v-sa directive.

[0027] The decision-making method provided in this application is applied to an electronic device, which can be a smart device such as a PC or a server.

[0028] In this embodiment, developers can declare event tracking parameters on HyperText Markup Language (HTML) elements or component tags in the template section of a Vue component using the custom directive `v-sa`. For example, `v-sa` is used as a directive prefix, followed by a colon and then a specific event type, such as click or page-load. After the equals sign, the event tracking parameters required by the business logic are declared using object literals, including unique event identifiers, custom business attributes, and context information.

[0029] Electronic devices can use the Vue compiler to obtain the v-sa directive in the Vue component template during the component compilation phase, extract the elements, event types and parameter objects bound to the directive, and generate structured event tracking configuration data, including elements such as buttons and divisions (div).

[0030] Developers can configure event tracking parameters in the template using the declarative syntax of v-sa: event type|event name|extended parameters.

[0031] S102: Parse the tracking parameters to obtain the element corresponding to the tracking parameters; bind the event listener corresponding to the tracking parameters to the element; and listen for events corresponding to the element based on the event listener; wherein the events include click events, page load events, and other events.

[0032] During the component mounting lifecycle, the electronic device locates the target element by querying the element selector in the event tracking configuration table. Subsequently, a listener of the corresponding event type is bound to the element. The listener function calls the event tracking SDK's Application Programming Interface (API) and injects the parsed parameter object.

[0033] For dynamically bound parameters, Vue's reactivity system can be used to track changes in parameter values, ensuring that the parameters are always the latest values ​​when the event is triggered, thus avoiding data lag or errors.

[0034] In addition to basic events, custom event types can be supported through the directive extension mechanism. For example, after defining the `v-sa:longpress` directive, the compiler will parse the threshold parameter of the long press event, and the runtime listener will determine whether to trigger the long press event based on the time difference between the `mousedown` and `mouseup` events.

[0035] All event types declared via the v-sa directive are processed through a unified listener registration and parameter reporting logic, avoiding the high maintenance costs and poor scalability issues caused by global listening and hard-coding of event types in code-free tracking. Events in this embodiment include click events, page load events, etc.

[0036] Developers only need to add directives to Vue component templates, eliminating the need to manually write event listener code or handle SDK call logic, thus reducing repetitive work. For example, for page load events, the traditional approach requires manually calling the event tracking API in the `mounted` or `created` hooks. This approach automates this process using the `v-sa:page-load` directive, shortening development time. Compile-time parsing ensures consistent parameter formats (e.g., event IDs are strings, parameter values ​​are valid types), avoiding dirty data caused by missing parameters, incorrect types, or inconsistent formats in manual event tracking. Simultaneously, the dynamic parameter reactive update mechanism ensures the real-time nature of critical business data (e.g., user IDs, product prices), improving analysis accuracy. Event tracking configuration is centralized in template directives, decoupling business code from event tracking logic. When business iterations require adjusting event tracking parameters, only the directive parameters in the template need to be modified, eliminating the need to traverse the business code to modify multiple event tracking calls, reducing maintenance costs.

[0037] In this embodiment, the tracking parameters are declared through the `v-sa` directive in the Vue component template, centralizing the tracking configuration at the template level. Business code does not need to directly include tracking call logic, achieving separation of configuration and code, reducing coupling, and minimizing the risk of business code changes due to tracking modifications. Declaring tracking parameters in the directive creates a unified tracking configuration standard, avoiding the problems of scattered points and inconsistent parameter formats in manual tracking. Furthermore, by parsing the parameters declared by the `v-sa` directive, corresponding event listeners are automatically bound to elements, ensuring that parameters are passed according to preset rules, reducing errors caused by human operation, and improving the accuracy of data collection. This approach retains the controllability of manual tracking while reducing invasiveness and maintenance costs through directives; it solves the problem of insufficient data granularity in no-code tracking while reducing false positives and false negatives through precise binding.

[0038] Example 2: To obtain the V-SA instruction, based on the above examples, the method for obtaining the V-SA instruction in this application embodiment includes: Extract the event types and extended parameters included in the event tracking parameters using preset parsing rules; In the Vue entry file, the event types and extended parameters included in the event tracking parameters are processed through a plugin to register the v-sa directive.

[0039] In this embodiment, the electronic device can extract the event types and extended parameters included in the event tracking parameters through preset parsing rules. For example, regular expressions can be used to match the event type identifier in the instruction declaration, such as "click" in "v-sa:click", supporting unified parsing of basic events (click, page load) and custom events (long press, swipe). For instance, the event type string can be matched using " / ([a-z_-]+) / " and its presence in the preset event type whitelist can be verified to avoid runtime errors caused by invalid event types.

[0040] Electronic devices can also recursively parse the parameter objects bound to directives, extracting static values, dynamic expressions, and nested objects. The dependencies of dynamic expressions are analyzed using an Abstract Syntax Tree (AST) to ensure the real-time nature and accuracy of parameter values. In the Vue entry file, a custom plugin is registered using `Vue.use` (the event tracking plugin). The plugin internally defines the `v-sa` directive and adds it to Vue's directive system. Directives are globally registered using the `Vue.directive` method, ensuring that all Vue components can use the `v-sa` directive. Dynamic updates of parameter values ​​are achieved through Vue's reactivity system. For example, when `product.id` changes in a component, the parameter updates of event listeners are automatically triggered via `watch` or `computed`, ensuring that event tracking data is synchronized with business data. For example, the implementation of directive lifecycle hooks involves the following process: `bind` hook: Executed when the directive is first bound to an element, parsing event tracking parameters and caching event types, parameter objects, and dynamic expression dependencies to prepare for subsequent event listening. The `inserted` hook: Triggered when an element is inserted into the Document Object Model (DOM), it binds listeners of the corresponding event type (such as click, page-load) to the element based on the parsing results and initializes dynamic tracking of parameter values ​​(e.g., using Vue's `$watch` to listen for changes in dynamic expression dependencies). The `update` hook: Executed when an element is updated or parameters change, it dynamically updates the parameter values ​​of event listeners (e.g., automatically synchronizing to the event tracking when `product.id` changes), ensuring data real-time performance. The `unbind` hook: Cleans up event listeners and cached data when a directive is unbound from an element, preventing memory leaks.

[0041] In one possible implementation, the parsed parameters can be validated for format (e.g., whether the event ID is a string, whether the numeric parameter is within a reasonable range) and business rules (e.g., whether required fields are missing, whether enumerated values ​​are valid) to generate standardized event tracking configuration data, providing structured input for subsequent plugin processing.

[0042] Example 3: Based on the above embodiments, in this embodiment of the application, before obtaining the tracking parameters declared by the v-sa directive in the Vue component template, the method further includes: Import the data tracking plugin into the entry file and trigger the plugin installation process by calling the application instance's global installation hook; wherein, the installation process performs initialization configuration, registers global tracking attributes, and completes the global registration of custom commands through the application instance's command methods.

[0043] In this embodiment, the data tracking plugin can be imported in the entry file of the Vue project (such as main.js) by importing SensorsPlugin from 'Sensors Tracking Plugin', and then the plugin installation process is triggered by calling app.use(SensorsPlugin). This step binds the tracking capability to the Vue application instance to ensure global availability. The app.use() method internally calls the plugin's install function, which serves as the core entry point of the installation process, sequentially executing three key steps: initialization configuration, global property registration, and command registration, forming a complete tracking capability initialization chain.

[0044] The core steps of the installation process include: SDK initialization configuration: The basic initialization of the SDK is completed through the initSensorsSdk() function, including setting core parameters such as the data reporting address (e.g., Sensors Data's serverURL), user identifier (e.g., distinct_id), and data encryption method. This step ensures that the SDK is available when the application starts, providing a basic guarantee for subsequent event reporting.

[0045] Global tracking attribute registration: Register global tracking attributes (such as page view events $pageview) using the registerPage() function to automatically add page-level tracking capabilities to the application. For example, automatically report metadata such as page path and dwell time when a user enters a page, eliminating the need for developers to manually add tracking points and improving data collection efficiency and consistency.

[0046] Global registration of custom directives: Register the v-sa directive as a global directive using app.directive('sa', saDirective). This step allows all Vue components to directly use the v-sa directive in the template to declare event tracking parameters (e.g., v-sa:click="{eventId: 'add_to_cart'}"), achieving "install once, available globally" declarative event tracking capabilities.

[0047] Example 4: Based on the above embodiments, in this embodiment of the application, the method further includes: If an event is detected, the target element corresponding to the event is obtained; the target embedding parameters corresponding to the target element are assembled.

[0048] In this embodiment, when a user action triggers a preset event (such as clicking a button declared with `v-sa:click` or loading a page declared with `v-sa:page-load`), an event object (such as `MouseEvent`) is captured by an event listener. This event object contains a reference to the DOM element or Vue component instance that triggered the event and can be directly used to locate the target element. Within the Vue framework, the actual element that triggered the event is accurately located using the `target` or `currentTarget` property of the event object, avoiding misjudgments of elements due to event bubbling or delegation mechanisms. For example, when a parent element delegates an event to a child element, the complete event path is obtained through the `composedPath()` method of the event object, ensuring that the original element declaring the `v-sa` directive is located.

[0049] Basic parameters can be extracted from the directive declaration associated with the event object and the target element, including: Event name: directly taken from the event type declared in the directive (e.g., click, page-load), ensuring consistency of event identification. Element identifier: a unique identifier generated through the target element's id, class, or custom attributes (e.g., data-sa-id), used to track the behavior of specific elements. Context information: obtaining the parent component name (e.g., this.$parent.name), page path (e.g., this.$route.path), and route parameters (e.g., product ID, user ID) through the Vue component instance, forming the context dimension required for business analysis. Dynamic injection of extended parameters: combining extended parameters declared in the directive (e.g., {eventId: 'add_to_cart', productId:product.id}), parameter values ​​are dynamically obtained through Vue's reactive system. For example, when product.id changes with data, it is automatically synchronized to the tracking parameters, ensuring data real-time performance. Simultaneously, it supports configuring a whitelist of extended parameters through plugins (e.g., only allowing the reporting of business fields such as eventId and productId), avoiding the leakage of sensitive information.

[0050] In this embodiment, parameters are automatically assembled when an event is triggered, eliminating the need for developers to manually concatenate event names, context information, and extended parameters, thus reducing the amount of code required for event tracking. For example, in an e-commerce scenario, when the "Add to Cart" button is clicked, the system automatically assembles parameters such as the event name "click," the parent component name "ProductDetail," and the product ID "123," achieving "out-of-the-box" event tracking capabilities.

[0051] Based on the above embodiments, in this embodiment of the application, the method further includes: Call the event tracking SDK to report data.

[0052] When a user action triggers a preset event (such as a click or page load), the event tracking data reporting process is automatically initiated. For example, when a user clicks a button declared with `v-sa:click`, the event listener captures the click event and immediately calls the `track` method of the event tracking SDK (such as Sensors Analytics' `sensors.track`) to report the event data, ensuring real-time "behavior-reporting". The event reporting format is standardized by encapsulating the event tracking SDK's calling interface. Taking Sensors Analytics' SDK as an example, calling `sensors.track('event name', {parameter object})`, where the "event name" is taken from the event type declared in the instruction (such as `click`), and the "parameter object" contains dynamically assembled event tracking parameters (such as event ID, product ID, user behavior tag), ensuring that the data structure conforms to the SDK specification and avoiding reporting failures due to incorrect formatting.

[0053] Figure 2 This is a detailed process diagram provided for an embodiment of this application.

[0054] Depend on Figure 2 As can be seen, the `v-sa` directive is used based on Vue component templates. Vue's custom directive hooks execute according to lifecycle phases. Event listening and parameter assembly are performed, and the event tracking SDK is called to report the results.

[0055] Example 5: Based on the above embodiments, in this embodiment of the application, the method further includes: If an event is detected to have been triggered a certain number of times within a preset time period, then throttling will be performed on that event to avoid duplicate reporting.

[0056] Within a preset time period (e.g., 500 milliseconds), the event listener continuously counts the number of times a specific event (e.g., a button click declared with `v-sa:click`) is triggered. When the number of triggers reaches a preset threshold (e.g., 3 times), a throttling process is immediately initiated to avoid repeated reporting within a short period. The throttling time window (e.g., expanding from 500 milliseconds to 1000 milliseconds) and trigger threshold (e.g., adjusting from 3 times to 5 times) can be dynamically adjusted via a configuration center (e.g., a JSON file or management backend) to adapt to the frequency control needs of different business scenarios. For example, during promotional activities, the throttling threshold can be relaxed to capture high-frequency user actions; in regular scenarios, the threshold can be tightened to reduce redundant reporting.

[0057] Based on the above embodiments, in this embodiment of the application, the method further includes: If an element uninstallation instruction is received, the uninstallation element carried during the element uninstallation process is obtained; Remove the event listener corresponding to the unloaded element.

[0058] In this embodiment, the element unloading directive can be automatically triggered in the `beforeUnmount` or `unmounted` lifecycle hooks of a Vue component. For example, when a button declaring the `v-sa` directive is removed due to conditional rendering (such as `v-if` switching) or route switching, Vue will call the directive's `unbind` hook, passing a reference to the unloaded element. The unloaded element can be accurately obtained through the directive's `unbind` hook parameter or the component's `$el` property. For example, in the `unbind` hook of the `v-sa:click` directive, the unloaded DOM element can be directly accessed through the `el` parameter, ensuring the accuracy of the removal operation.

[0059] The embodiments of this application have the following advantages: Custom-instruction-based event tracking strategy: Automatically binds events, assembles parameters, and reports them through instructions, reducing development costs. Automatic parameter parsing and assembly mechanism: Supports multiple parameter formats and extended fields, improving flexibility. Built-in throttling and debouncing mechanism: Automatically throttles for high-frequency events, ensuring data accuracy. Decoupled design from the event tracking SDK: SDK calls are encapsulated within the instructions, facilitating subsequent replacement or upgrades of the event tracking SDK. Global registration and automatic unbinding mechanism: Ensures that the lifecycle of the instructions is consistent with that of the components, preventing memory leaks.

[0060] Example 6: Based on the above embodiments, this application provides a device for embedding data points. Figure 2 This is a schematic diagram of the structure of an embedded device provided in an embodiment of this application, as shown below. Figure 2 As shown, the device includes: Get module 201, used to retrieve the instrumentation parameters declared in the Vue component template via the v-sa directive; The processing module 202 is used to parse the tracking parameters, obtain the element corresponding to the tracking parameters, bind the event listener corresponding to the tracking parameters to the element, and listen for events corresponding to the element based on the event listener; wherein, the events include click events, page load events and other events.

[0061] Furthermore, the processing module 202 is also used to extract the event type and extended parameters included in the tracking parameters through preset parsing rules; in the Vue entry file, the event type and extended parameters included in the tracking parameters are processed by a plugin to register the v-sa command.

[0062] Furthermore, the processing module 202 is also used to import the data tracking plugin into the entry file and call the global installation hook of the application instance to trigger the plugin installation process; wherein, the installation process performs initialization configuration, registers global tracking attributes, and completes the global registration of custom instructions through the instruction methods of the application instance.

[0063] Furthermore, the processing module 202 is also used to obtain the target element corresponding to the event if a certain event is detected; and to assemble the target embedding parameters corresponding to the target element.

[0064] Furthermore, the processing module 202 is also used to call the data reporting SDK to report data.

[0065] Furthermore, the processing module 202 is also used to perform throttling processing on the event if the number of times a certain event is detected to have been triggered reaches a preset number within a preset time period, so as to avoid repeated reporting.

[0066] Furthermore, the processing module 202 is also configured to, if an element uninstallation instruction is received, obtain the uninstallation element carried in the element uninstallation execution; and remove the event listener corresponding to the uninstallation element.

[0067] Example 7: Based on the above examples, this application also provides an electronic device. Figure 4 This application provides a schematic diagram of an electronic device structure, such as... Figure 4 As shown, it includes: processor 401, communication interface 402, memory 403 and communication bus 403, wherein processor 401, communication interface 402 and memory 403 communicate with each other through communication bus 404. The memory 403 stores a computer program. When the program is executed by the processor 401, the processor 401 performs the following steps: Retrieve the event tracking parameters declared in the Vue component template using the v-sa directive; Parse the tracking parameters to obtain the element corresponding to the tracking parameters; bind the event listener corresponding to the tracking parameters to the element; and listen for events corresponding to the element based on the event listener; wherein, the events include click events, page load events, and other events.

[0068] In one possible implementation, the method for obtaining the v-sa instruction includes: Extract the event types and extended parameters included in the event tracking parameters using preset parsing rules; In the Vue entry file, the event types and extended parameters included in the event tracking parameters are processed through a plugin to register the v-sa directive.

[0069] In one possible implementation, before obtaining the event tracking parameters declared via the v-sa directive in the Vue component template, the method further includes: Import the data tracking plugin into the entry file and trigger the plugin installation process by calling the application instance's global installation hook; wherein, the installation process performs initialization configuration, registers global tracking attributes, and completes the global registration of custom commands through the application instance's command methods.

[0070] In one possible implementation, the method further includes: If an event is detected, the target element corresponding to the event is obtained; the target embedding parameters corresponding to the target element are assembled.

[0071] In one possible implementation, the method further includes: Call the event tracking SDK to report data.

[0072] In one possible implementation, the method further includes: If an event is detected to have been triggered a certain number of times within a preset time period, then throttling will be performed on that event to avoid duplicate reporting.

[0073] In one possible implementation, the method further includes: If an element uninstallation instruction is received, the uninstallation element carried during the element uninstallation process is obtained; Remove the event listener corresponding to the unloaded element.

[0074] The communication bus mentioned in the above electronic devices can be a PCI (Peripheral Component Interconnect) bus or an EISA (Extended Industry Standard Architecture) bus, etc. This communication bus can be divided into address bus, data bus, control bus, etc. For ease of illustration, only one thick line is used to represent it in the diagram, but this does not mean that there is only one bus or one type of bus.

[0075] Communication interface 402 is used for communication between the above-mentioned electronic device and other devices.

[0076] The memory may include RAM (Random Access Memory) or NVM (Non-Volatile Memory), such as at least one disk storage device. Optionally, the memory may also be at least one storage device located remotely from the aforementioned processor.

[0077] The processors mentioned above can be general-purpose processors, including central processing units (CPUs), network processors (NPs), etc.; they can also be DSPs (Digital Signal Processors), 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.

[0078] Example 8: Based on the above embodiments, this application provides a computer-readable storage medium storing a computer program executable by an electronic device. When the program is run on the electronic device, the electronic device performs the following steps: Retrieve the event tracking parameters declared in the Vue component template using the v-sa directive; Parse the tracking parameters to obtain the element corresponding to the tracking parameters; bind the event listener corresponding to the tracking parameters to the element; and listen for events corresponding to the element based on the event listener; wherein, the events include click events, page load events, and other events.

[0079] In one possible implementation, the method for obtaining the v-sa instruction includes: Extract the event types and extended parameters included in the event tracking parameters using preset parsing rules; In the Vue entry file, the event types and extended parameters included in the event tracking parameters are processed through a plugin to register the v-sa directive.

[0080] In one possible implementation, before obtaining the event tracking parameters declared via the v-sa directive in the Vue component template, the method further includes: Import the data tracking plugin into the entry file and trigger the plugin installation process by calling the application instance's global installation hook; wherein, the installation process performs initialization configuration, registers global tracking attributes, and completes the global registration of custom commands through the application instance's command methods.

[0081] In one possible implementation, the method further includes: If an event is detected, the target element corresponding to the event is obtained; the target embedding parameters corresponding to the target element are assembled.

[0082] In one possible implementation, the method further includes: Call the event tracking SDK to report data.

[0083] In one possible implementation, the method further includes: If an event is detected to have been triggered a certain number of times within a preset time period, then throttling will be performed on that event to avoid duplicate reporting.

[0084] In one possible implementation, the method further includes: If an element uninstallation instruction is received, the uninstallation element carried during the element uninstallation process is obtained; Remove the event listener corresponding to the unloaded element.

[0085] Those skilled in the art will understand that embodiments of this application can be provided as methods, systems, or computer program products. Therefore, this application can take the form of a completely hardware embodiment, a completely software embodiment, or an embodiment combining software and hardware aspects. Furthermore, this application can take the form of a computer program product embodied on one or more computer-usable storage media (including, but not limited to, disk storage, CD-ROM, optical storage, etc.) containing computer-usable program code.

[0086] This application is described with reference to flowchart illustrations and / or block diagrams of methods, apparatus (systems), and computer program products according to this application. It should be understood that each block of the flowchart illustrations and / or block diagrams, and combinations of blocks in the flowchart illustrations and / or block diagrams, can be implemented by computer program instructions. These computer program instructions can be provided to a processor of a general-purpose computer, special-purpose computer, embedded processor, or other programmable data processing apparatus to produce a machine, such that the instructions, which execute via the processor of the computer or other programmable data processing apparatus, generate instructions for implementing the flowchart illustrations and / or block diagrams. Figure 1 One or more processes and / or boxes Figure 1 A device that provides the functions specified in one or more boxes.

[0087] These computer program instructions may also be stored in a computer-readable storage medium that can direct a computer or other programmable data processing device to function in a particular manner, such that the instructions stored in the computer-readable storage medium produce an article of manufacture including instruction means, which are implemented in a process Figure 1 One or more processes and / or boxes Figure 1 The function specified in one or more boxes.

[0088] These computer program instructions may also be loaded onto a computer or other programmable data processing equipment to cause a series of operational steps to be performed on the computer or other programmable equipment to produce a computer-implemented process, thereby providing instructions that execute on the computer or other programmable equipment for implementing the process. Figure 1 One or more processes and / or boxes Figure 1 The steps of the function specified in one or more boxes.

[0089] Obviously, those skilled in the art can make various modifications and variations to this application without departing from the spirit and scope of this application. Therefore, if such modifications and variations fall within the scope of the claims of this application and their equivalents, this application also intends to include such modifications and variations.

Claims

1. A method for embedding data points, characterized in that, The method includes: Retrieve the event tracking parameters declared in the Vue component template using the v-sa directive; Parse the tracking parameters to obtain the element corresponding to the tracking parameters; bind the event listener corresponding to the tracking parameters to the element; and listen for events corresponding to the element based on the event listener; wherein the events include click events, page load events, and other events.

2. The method according to claim 1, characterized in that, The methods for obtaining the v-sa command include: Extract the event types and extended parameters included in the event tracking parameters using preset parsing rules; In the Vue entry file, the event types and extended parameters included in the event tracking parameters are processed through a plugin to register the v-sa directive.

3. The method according to claim 1, characterized in that, Before retrieving the event tracking parameters declared via the v-sa directive in the Vue component template, the method further includes: Import the data tracking plugin into the entry file and trigger the plugin installation process by calling the application instance's global installation hook; wherein, the installation process performs initialization configuration, registers global tracking attributes, and completes the global registration of custom commands through the application instance's command methods.

4. The method according to any one of claims 1-3, characterized in that, The method further includes: If an event is detected, the target element corresponding to the event is obtained; the target embedding parameters corresponding to the target element are assembled.

5. The method according to any one of claims 1-3, characterized in that, The method further includes: The data is reported by calling the data tracking software development kit (SDK).

6. The method according to claim 5, characterized in that, The method further includes: If an event is detected to have been triggered a certain number of times within a preset time period, then throttling will be performed on that event to avoid duplicate reporting.

7. The method according to claim 1, characterized in that, The method further includes: If an element uninstallation instruction is received, the uninstallation element carried during the element uninstallation process is obtained; Remove the event listener corresponding to the unloaded element.

8. A device for embedding points, characterized in that, The device includes: The `get` module is used to retrieve the event tracking parameters declared in the Vue component template via the `v-sa` directive. The processing module is used to parse the tracking parameters, obtain the element corresponding to the tracking parameters, bind the event listener corresponding to the tracking parameters to the element, and listen for events corresponding to the element based on the event listener; wherein, the events include click events, page load events and other events.

9. An electronic device, characterized in that, The electronic device includes at least a processor and a memory, wherein the processor is used to execute the steps of any of the embedding methods described in claims 1-7 when executing a computer program stored in the memory.

10. A computer-readable storage medium, characterized in that, It stores a computer program that, when executed by a processor, performs the steps of any of the embedding methods described in claims 1-7.

Images