Universal component point burying method based on user operation
By using JSON files to configure the buried point rules and injecting the read method in the react-native framework, automatic buried point burying and regular reporting are achieved, the problems of bloated code and high maintenance costs of traditional buried point methods are solved, and a flexible and non-invasive general component buried point method is realized.
Patent Information
- Application Number
- CN202510165202.X
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2025-02-14
- Publication Date
- 2025-03-18
- Estimated Expiration
- Not applicable · inactive patent
AI Technical Summary
The traditional method of burying points requires writing a large amount of function call code, which leads to bloated application code. Once the burying points change, the amount of code that needs to be changed is huge, which is highly invasive and has high maintenance costs.
A common component point burying method based on user operations is adopted. The point burying rules are configured through JSON files, and the reading method is injected into the source code of the react-native framework component to automatically bury the point burying, and the buried point data is regularly reported through independent threads.
It realizes a configurable, scalable, and non-invasive general component point burial method, reduces redundant point burial code, improves point quality and flexibility, and reduces modification and maintenance costs.
Smart Images

Figure CN119646283A_ABST
Abstract
Description
Technical Field
[0001] The present invention relates to the field of data tracking technology, and in particular to a general component tracking method based on user operations. Background Art
[0002] In the current era of data explosion, if you want to find target customers in massive data, you often need to perform data analysis on user operations. The traditional tracking method requires writing a large amount of function call code to report user operations. This method of reporting code at each behavior point will not only make the application code very bloated, but also once the tracking requirements change, the amount of code that needs to be modified is very large, so it is necessary to implement a general component tracking method based on user operations. Summary of the invention
[0003] The purpose of the present invention is to provide a universal component tracking method based on user operations, configure components according to business needs, and realize a configurable, extensible, and non-intrusive universal component tracking method to solve the problems of strong intrusiveness of existing tracking codes and high modification and maintenance costs, and has practicality and versatility.
[0004] To achieve the above purpose, the technical solution adopted by the present invention is as follows: A method for tracking common components based on user operations, comprising the following steps: Step 1: Set the tracking rules and configure them in a JSON file, with the route as the index. The tracking rules include the components, events, and attributes that need to be tracked. Step 2: Build a JSON file reading method and inject it into the source code of the react-native framework component; Step 3: When the user triggers an event on the component under the current route, the attribute value of the corresponding attribute is obtained from the JSON file through the reading method, and the obtained attribute value is stored in the database as the embedded data; Step 4: Start an independent thread to regularly read the tracking data in the database and report it in the form of a scheduled task.
[0005] Furthermore, the reading method includes: reading the JSON file when the component is loaded; searching for the burying point rules of the corresponding node in the JSON file according to the component name of the component under the current route, loading and parsing; extracting the events and attributes of the current component from the burying point rules; each component dynamically binds an event listener according to the extracted event, and obtains the attribute value of the attribute when the event is triggered; if the burying point rules under the current route are not loaded, extracting all the burying point rules under the current route from the JSON file and caching them in memory.
[0006] Furthermore, the reading method also includes: setting different priorities for different burying point rules in the JSON file; and grouping different burying point rules in the JSON file by function or business module.
[0007] Furthermore, in step 2, the reading method of the JSON file is designed as an independent plug-in, which supports dynamic loading and unloading; the tracking point rules of the JSON file are dynamically injected into the react-native framework component, and the dynamic injection of the tracking point logic is realized through high-order components or a customized hook function; and aspect-oriented programming is used to decouple the tracking point rules from the business logic.
[0008] Furthermore, in the step 3, the tracking point data is encapsulated as a record and inserted into the event table of the database. The table structure of the event table includes: primary key, routing path, component name, event type, event attribute, event occurrence time, and whether it has been reported. The whether it has been reported mark is 0, indicating that it has not been reported, and the whether it has been reported mark is 1, indicating that it has been reported.
[0009] Furthermore, step 4 includes: starting an independent thread, regularly querying the event table in the form of a scheduled task, and extracting unreported records; packaging the unreported buried point data and sending it to the server through the network interface; after the reporting is completed, deleting the reported records from the database.
[0010] Furthermore, in step 4, when the reporting of the buried data is unexpectedly interrupted, the thread will record the current state and continue the reporting operation from the last interrupted position when it is started again.
[0011] Furthermore, it also includes: generating a patch file describing the code modification according to the modification of the component code before and after the operation of step 1 to step 2, and synchronizing the patch file to the corresponding component each time the react-native framework executes the packaging command of the continuous integration packaging.
[0012] Furthermore, the patch file includes the name and version of the JSON file corresponding to the component, and the line number and content of the added and deleted code; Git is used to generate a patch file describing the code modification.
[0013] Furthermore, each time the react-native framework executes a packaging command for continuous integration, it first determines whether there is a patch file. If so, it parses the code modifications in the patch file, modifies the JSON file corresponding to the component according to the code modifications, and updates the version of the JSON file.
[0014] Compared with the prior art, the present invention has the following beneficial effects: 1. Based on a tracking method with universal tracking logic, the present invention encapsulates and extends the components of the React-Native framework, thereby realizing the reusable and configurable tracking capability of the components.
[0015] 2. The present invention realizes automatic tracking within the component, and the business code does not need to add tracking logic, thus solving the disadvantages of intrusive tracking.
[0016] 3. The present invention maintains the tracking point settings through tracking point rules, and the tracking point requirements can be adjusted without modifying the code, which has the characteristics of flexible configuration.
[0017] 4. The present invention significantly reduces redundant burying code and improves burying quality through a burying method with universal burying logic. The standardized burying scheme is conducive to outputting higher quality burying data. BRIEF DESCRIPTION OF THE DRAWINGS
[0018] Figure 1 The figure is a flow chart of the method of the present invention. DETAILED DESCRIPTION
[0019] Terminology explanation: The react-native framework is an open source cross-platform mobile application development framework; Git is an open source distributed version control system; SQLite is a lightweight relational database management system; JSON file is a text-based data format file; APK file is the installation package file of the application; The LRU cache algorithm is an algorithm used to manage cache.
[0020] In order to make the purpose, technical solution and advantages of the present invention more clearly understood, the present invention is further described in detail below in conjunction with the accompanying drawings. Obviously, the described embodiments are only part of the embodiments of the present invention, rather than all of the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by ordinary technicians in this field without making creative work are within the scope of protection of the present invention.
[0021] like Figure 1 As shown, the present invention provides a method for tracking common components based on user operations, comprising the following steps: Step 1: Set the tracking rules and configure them in a JSON file, with the route (page path) as the index. The tracking rules contain the components, events, and attributes that need to be tracked. Step 2: Build a JSON file reading method and inject it into the source code of the react-native framework component; Step 3: When the user triggers an event on the component under the current route, the attribute value of the corresponding attribute is obtained from the JSON file through the reading method, and the obtained attribute value is stored in the database as the embedded data; Step 4: Start an independent thread to regularly read the tracking data in the database and report it in the form of a scheduled task.
[0022] The present invention implements the tracking of components through JSON file configuration, wherein a tracking method (reading method) with a general tracking logic is generated according to the configuration of the JSON file to adapt to the general tracking requirements of different components, and provide interfaces of each component corresponding to the business system, such as events, properties, etc., to achieve customized requirements, components such as View, Text, Button, etc. The general tracking method is then imported into the component of the react-native framework for use, and the component accepts and executes the general tracking method. Finally, according to the interaction scenario of the component, when the component interacts with the user operation, the tracking data is automatically recorded. The react-native framework of the present invention can track the current component without making other modifications. Even if an existing system is connected, minimal changes are guaranteed, so that the configuration can be used.
[0023] In step 1, a configuration is constructed for each component type of a route, and one configuration implements tracking points of multiple components.
[0024] In some embodiments of the present invention, the reading method includes: reading the JSON file when the component is loaded; searching for the tracking point rules of the corresponding node in the JSON file according to the component name (such as Button) of the component under the current route (such as / home), loading and parsing; extracting the events and attributes of the current component from the tracking point rules; each component dynamically binds the event listener according to the extracted event, and obtains the attribute value of the attribute (such as label, position) when the event (such as click) is triggered. If the tracking point rules under the current route are not loaded, all the tracking point rules under the current route (such as button click, image loading and other event configurations) are extracted from the JSON file and cached into the memory. If the user has never visited the route, the corresponding tracking point rules will not be loaded, thereby avoiding redundant resource occupation. Preferably, the LRU cache algorithm is used to manage the loaded tracking point rules. When the cache capacity of the memory reaches the threshold, the longest unused tracking point rules are automatically removed to ensure efficient use of memory.
[0025] In some embodiments of the present invention, the reading method further includes: setting different priorities for different tracking rules in the JSON file; and grouping different tracking rules in the JSON file by function or business module. Setting different priorities for different tracking rules in the JSON file can ensure that high-priority tracking data can be reported first. Grouping different tracking rules in the JSON file by function or business module facilitates management and maintenance.
[0026] In some embodiments of the present invention, a JSON file reading method is designed as an independent plug-in, which supports dynamic loading and unloading; the tracking rules of the JSON file are dynamically injected into the react-native framework component, and the dynamic injection of the tracking logic is realized through a high-order component or a customized hook function; aspect-oriented programming is used to decouple the tracking rules from the business logic to further reduce the code intrusiveness.
[0027] In some embodiments of the present invention, in step 3, the buried point data is encapsulated as a record and inserted into the event table events_table of the local relational database (such as SQLite), and the table structure of the event table includes: primary key id, routing path route, component name component, event type event_type, event attribute properties, event occurrence time timestamp, whether it has been reported is_uploaded, whether it has been reported is marked as 0 for not reported, and whether it has been reported is marked as 1 for reported. The primary key is self-incrementing, the routing path, component name, event type and event attribute are JSON strings, and the event occurrence time is a timestamp.
[0028] Through the configured JSON file, for example, when the Button component uses this method, the Button component will have attributes such as title, button status, button color, etc. by default. The outside only needs to pass in the business parameters that need to be buried, such as title and color. If the buried event operation is "click the purchase button", when the user clicks the purchase button, the component will automatically store the title and color as buried data in the local database and wait for reporting.
[0029] In some embodiments of the present invention, step 4 includes: starting an independent thread, querying the event table regularly in the form of a scheduled task (job), extracting unreported records; packaging the unreported buried point data and sending it to the server through an interface; after the reporting is completed, deleting the reported records from the database. When the buried point data reporting is accidentally interrupted, the thread will record the current status, and when it is started again, continue to perform the reporting operation from the location where it was last interrupted.
[0030] Since step 2 involves the modification of the internal component code of the react-native framework, each time the react-native framework executes the packaging command of the continuous integration to generate the Apk file, the modification in step 2 will be overwritten. Therefore, it is necessary to add a patch to the continuous integration of the react-native framework. Each time the packaging command is executed, the modification in step 2 must be synchronized to the react-native framework before the modification can take effect. The tracking method must be synchronized to the components inside the react-native framework so that the components support the tracking function.
[0031] In some embodiments of the present invention, the present invention further includes: generating a patch file describing the code modification according to the modification of the code of the component before and after the operation of step 1 to step 2, and synchronizing the patch file to the corresponding component each time the react-native framework executes the packaging command of the packaging continuous integration.
[0032] Preferably, the patch file includes the name and version of the JSON file corresponding to the component, and the line number and content of the added and deleted code.
[0033] Preferably, each time the react-native framework executes the packaging command of the continuous integration package, it first determines whether there is a patch file. If so, it parses the code modification in the patch file, modifies the JSON file corresponding to the component according to the code modification, and updates the version of the JSON file to mark that the JSON file has been patched, for example, adding a "-patch" suffix after the version. If it does not exist, it means that the component of the react-native framework does not have the tracking function, and it is necessary to check whether the operations of steps 1 to 3 are correct.
[0034] Preferably, Git is used to generate a patch file describing the code modification. Specifically, Git's diff command is used to generate a patch file describing the code modification, and the patch file is in diff format. Then Git's apply command is used to synchronize the patch file to the corresponding component.
[0035] When the components of the react-native framework need to be tested in a test environment without the tracking function, it is only necessary to check whether the version of the JSON file has been modified after the packaging command of the continuous integration JSON file is executed: if it has been modified, roll back according to the content of the patch file to adapt to the tracking integration in a multi-person collaborative environment.
[0036] Finally, it should be noted that the above embodiments are only preferred embodiments of the present invention to illustrate the technical solutions of the present invention, rather than limiting them, and certainly not limiting the patent scope of the present invention. Although the present invention has been described in detail with reference to the aforementioned embodiments, those skilled in the art should understand that they can still modify the technical solutions recorded in the aforementioned embodiments, or replace some or all of the technical features therein by equivalents. These modifications or replacements do not make the essence of the corresponding technical solutions deviate from the scope of the technical solutions of the embodiments of the present invention. In other words, any changes or modifications made to the main design concept and spirit of the present invention that have no substantive significance, and the technical problems they solve are still consistent with the present invention, should be included in the protection scope of the present invention. In addition, the direct or indirect application of the technical solutions of the present invention in other related technical fields is also included in the patent protection scope of the present invention.
Claims
1. A method for tracking common components based on user operations, characterized in that: The following steps are involved: Step 1: Set the tracking rules and configure them in a JSON file, with the route as the index. The tracking rules include the components, events, and attributes that need to be tracked. Step 2: Build a JSON file reading method and inject it into the source code of the react-native framework component; Step 3: When the user triggers an event on the component under the current route, the attribute value of the corresponding attribute is obtained from the JSON file through the reading method, and the obtained attribute value is stored in the database as the embedded data; Step 4: Start an independent thread to regularly read the tracking data in the database and report it in the form of a scheduled task.
2. A method for tracking common components based on user operations according to claim 1, characterized in that: The reading method includes: reading a JSON file when a component is loaded; searching for and loading the tracking point rules of the corresponding node in the JSON file according to the component name of the component under the current route; extracting events and attributes of the current component from the tracking point rules; dynamically binding an event listener to each component according to the extracted event, and obtaining the attribute value of the attribute when the event is triggered; if the tracking point rules under the current route are not loaded, extracting all the tracking point rules under the current route from the JSON file and caching them in memory.
3. According to the method for tracking points of a general component based on user operation according to claim 1, it is characterized in that: The reading method also includes: setting different priorities for different tracking rules in the JSON file; and grouping different tracking rules in the JSON file according to functions or business modules.
4. According to the method for tracking points of a general component based on user operation according to claim 1, it is characterized in that: In the step 2, the reading method of the JSON file is designed as an independent plug-in, which supports dynamic loading and unloading; the tracking point rules of the JSON file are dynamically injected into the react-native framework component, and the dynamic injection of the tracking point logic is realized through a high-order component or a customized hook function; and the tracking point rules are decoupled from the business logic using aspect-oriented programming.
5. According to the method for tracking points of a general component based on user operation according to claim 1, it is characterized in that: In step 3, the buried point data is encapsulated as a record and inserted into the event table of the database. The table structure of the event table includes: primary key, routing path, component name, event type, event attribute, event occurrence time, and whether it has been reported. The whether it has been reported mark is 0, indicating that it has not been reported, and the whether it has been reported mark is 1, indicating that it has been reported.
6. A method for tracking common components based on user operations according to claim 5, characterized in that: The step 4 includes: starting an independent thread, regularly querying the event table in the form of a scheduled task, and extracting unreported records; packaging the unreported buried point data and sending it to the server through the network interface; after the reporting is completed, deleting the reported records from the database.
7. A method for embedding common components based on user operations according to claim 6, characterized in that: In step 4, when the reporting of the buried data is unexpectedly interrupted, the thread will record the current state and continue the reporting operation from the last interrupted position when it is started again.
8. A method for tracking common components based on user operations according to claim 1, characterized in that: Also includes: According to the code modification of the component before and after step 1 and step 2, a patch file describing the code modification is generated. Each time the react-native framework executes the packaging command of continuous integration, the patch file is synchronized to the corresponding component.
9. A method for tracking common components based on user operations according to claim 8, characterized in that: The patch file includes the name and version of the JSON file corresponding to the component, as well as the line numbers and content of the added and deleted code; Git is used to generate a patch file describing the code modification.
10. A method for tracking common components based on user operations according to claim 9, characterized in that: Each time the react-native framework executes a packaging command for continuous integration, it first determines whether there is a patch file. If so, it parses the code changes in the patch file, modifies the JSON file corresponding to the component according to the code changes, and updates the version of the JSON file.
Citation Information
Patent Citations
Data acquisition method, device and apparatus and storage medium
CN111737100A
Page monitoring method and device, computer equipment and storage medium
CN112181794A
Method and device for adding burying points, processor, storage medium and program product
CN114047924A
React Native-based hot update method and system
CN114115969A
Automatic test method, system and device for burying points and storage medium
CN114546850A
Cited By
Advertisement burying point test method and related device
CN121880218A