Page exception judgment method and device, equipment, medium and program product

Abstract

The invention relates to the technical field of front-end development, and discloses a page exception judgment method and device, equipment, a medium and a program product, document object model nodes and document object model elements of a target page are obtained, and a target node is screened out from the document object model nodes according to business data corresponding to the target page; performing structural feature analysis on the target nodes according to a preset measurement index to obtain a structural feature analysis result, and performing semantic analysis on the document object model element in each target node to obtain a semantic analysis result; and determining whether the target page is abnormal or not based on the structural feature analysis result and / or the semantic analysis result. Structural feature analysis is performed on the target node so as to capture the structural distortion problem caused by compatibility, dynamic loading or rendering errors, and the limitation that visual comparison lags behind and is easily influenced by UI iteration is broken through; and semantic analysis is performed on the DOM elements in the nodes, so that the defects of narrow attribute monitoring range and low accuracy are overcome.

Description

Technical Field

[0001] This disclosure relates to the field of front-end development technology, specifically to methods, devices, equipment, media, and program products for judging page anomalies. Background Technology

[0002] In related technologies, the detection of abnormal web page display mainly relies on two paths: one is a visual comparison scheme based on image recognition, which involves periodically taking screenshots of the page and performing difference analysis based on pixel sampling to identify anomalies; the other is a scheme based on attribute state monitoring, which collects attribute values ​​related to page rendering to establish a state set and determines anomalies based on the consistency of attribute changes. While the former can capture visual deviations, it relies on high-frequency screenshots and pixel-level comparisons, resulting in slow processing speed, significant performance overhead, and difficulty in accurately defining anomaly boundaries. Furthermore, UI iterations can cause historical image baselines to become invalid, leading to poor sustainability. The latter, while enabling code-level monitoring, is limited to projects using specific data-driven frameworks, and not all attributes are strongly correlated with visual rendering, resulting in incomplete monitoring coverage and limited accuracy.

[0003] In other words, when faced with page display anomalies caused by compatibility issues, dynamic rendering, or non-code errors, the relevant technologies cannot achieve low-cost, real-time proactive detection, nor can they maintain a stable and effective judgment benchmark as the UI continues to evolve. As a result, many anomalies cannot be detected in a timely manner, often passively relying on user feedback, leading to delayed problem exposure, prolonged repair cycles, and a decline in user experience. Summary of the Invention

[0004] This disclosure provides a method, apparatus, device, medium, and program product for judging page anomalies, in order to solve the problem of how to proactively detect page display anomalies caused by compatibility, dynamic rendering, or non-code errors.

[0005] Firstly, this disclosure provides a method for determining page anomalies, the method comprising: Obtain the document object model nodes and document object model elements of the target page, and filter out the target node from the document object model nodes according to the business data corresponding to the target page; Structural feature analysis is performed on the target nodes based on preset metrics to obtain structural feature analysis results, and semantic analysis is performed on the document object model elements in each target node to obtain semantic analysis results; Based on the structural feature analysis results and / or the semantic analysis results, determine whether the target page has any anomalies.

[0006] This disclosure obtains the Document Object Model (DOM) nodes and DOM elements of the target page, and filters out target nodes from the DOM nodes based on the corresponding business data of the target page. It then performs structural feature analysis on the target nodes according to preset metrics to obtain structural feature analysis results, and performs semantic analysis on the DOM elements within each target node to obtain semantic analysis results. Based on the structural feature analysis results and / or semantic analysis results, it determines whether the target page has any anomalies. This disclosure performs structural feature analysis on target nodes to capture structural distortion problems caused by compatibility, dynamic loading, or rendering errors, overcoming the limitations of visual comparison being lagging and easily affected by UI iterations. It also performs semantic analysis on DOM elements within nodes to verify the compliance of element functions, states, and content, compensating for the shortcomings of narrow attribute monitoring scope and low accuracy.

[0007] Secondly, this disclosure provides a device for determining page anomalies, the device comprising: The acquisition module is used to acquire the document object model nodes and document object model elements of the target page, and to filter out the target node from the document object model nodes according to the business data corresponding to the target page; The analysis module is used to perform structural feature analysis on the target node based on preset metrics to obtain structural feature analysis results, and to perform semantic analysis on the document object model elements in each target node to obtain semantic analysis results. The judgment module is used to determine whether the target page has any anomalies based on the structural analysis results and / or semantic analysis results.

[0008] Thirdly, this disclosure provides an electronic device, including: a memory and a processor, which are communicatively connected to each other. The memory stores computer instructions, and the processor executes the computer instructions to perform the page anomaly judgment method of the first aspect or any corresponding embodiment described above.

[0009] Fourthly, this disclosure provides a computer-readable storage medium storing computer instructions for causing a computer to execute the page anomaly determination method of the first aspect or any corresponding embodiment described above.

[0010] Fifthly, this disclosure provides a computer program product, including computer instructions, which are used to cause a computer to execute the page exception determination method described in the first aspect or any corresponding embodiment. Attached Figure Description

[0011] To more clearly illustrate the technical solutions in the specific embodiments of this disclosure or the prior art, the drawings used in the description of the specific embodiments or the prior art will be briefly introduced below. Obviously, the drawings described below are some embodiments of this disclosure. For those skilled in the art, other drawings can be obtained from these drawings without creative effort.

[0012] Figure 1 This is a schematic diagram illustrating an application scenario according to an embodiment of this disclosure; Figure 2 This is a schematic flowchart of a first method for determining page anomalies according to an embodiment of the present disclosure; Figure 3 This is a schematic diagram of a page based on a method for determining page anomalies according to an embodiment of this disclosure; Figure 4 This is a schematic diagram of the DOM distribution for a method of determining page anomalies according to an embodiment of this disclosure; Figure 5 This is a structural block diagram of a page anomaly determination device according to an embodiment of the present disclosure; Figure 6 This is a schematic diagram of the hardware structure of an electronic device according to an embodiment of this disclosure. Detailed Implementation

[0013] To make the objectives, technical solutions, and advantages of the embodiments of this disclosure clearer, the technical solutions of the embodiments of this disclosure will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of this disclosure, and not all embodiments. Based on the embodiments of this disclosure, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of this disclosure.

[0014] It should be noted that the information (including but not limited to user input information, such as information entered by the user into input boxes), data (including but not limited to data used for analysis, stored data, and displayed data, such as context code, all code of the current project, the service pressure corresponding to operations performed on all code of the current project, and the code development status of the current project), and signals involved in this application are all authorized by the user or fully authorized by all parties, and the collection, use, and processing of related data must comply with relevant laws, regulations, and standards. For example, the context code, operations performed on all code of the current project, the corresponding service pressure, and the code development status involved in this application were all obtained with full authorization.

[0015] The terms "first" and "second" are used for descriptive purposes only and should not be construed as indicating or implying relative importance or implicitly specifying the number of technical features indicated. Thus, a feature defined as "first" or "second" may explicitly or implicitly include one or more of that feature. In the description of this disclosure, "a plurality of" means two or more, unless otherwise expressly specified.

[0016] As one optional application scenario of this disclosure embodiment, such as Figure 1 As shown, application 101 is installed in terminal device 110, and user 130 can interact with application 101 through terminal device 110 and / or access device of terminal device 110.

[0017] For example, application 101 can be any application that provides question-and-answer related services. For instance, application 101 could be a question-and-answer interactive application, such as a text-to-text application, an image-to-text application, etc. Figure 1 In the application scenario shown, if application 101 is active, the terminal device 110 can display the interface 102 of application 101. The interface 102 may include various pages that application 101 can provide, such as interactive pages, settings pages, query pages, etc.

[0018] In some embodiments, terminal device 110 is communicatively connected to server 120 to provide services to application 101. Terminal device 110 may be a mobile terminal, fixed terminal, or portable terminal, etc., including but not limited to mobile phones, desktop computers, laptop computers, multimedia tablets, e-book devices, gaming devices, or any combination thereof, including accessories and peripherals of these devices or any combination thereof. In some embodiments, terminal device 110 may also support any type of interface, and server 120 may be various types of computing systems or servers capable of providing computing power, including but not limited to mainframes, edge computing nodes, computing devices in cloud environments, etc.

[0019] It should be noted that, Figure 1 This is merely an example of an application scenario and does not limit the scope of protection of this disclosure.

[0020] The embodiments of this disclosure will now be described with reference to the accompanying drawings. It should be understood that the pages shown in the drawings are merely examples, and various page designs are possible in practice. The various graphic elements on the page may have different arrangements and different visual representations, one or more elements may be omitted or replaced, and one or more other elements may also be present; no limitations are imposed on the embodiments described in this disclosure. Furthermore, the embodiments are primarily described below with reference to terminal device 110. It should be understood that the actions described relative to terminal device 110 can be performed by application 101 on terminal device 110, or can be performed by application 101 in conjunction with its server (e.g., server 120).

[0021] In related technologies, the detection of abnormal web page display mainly relies on two paths: one is a visual comparison scheme based on image recognition, which involves periodically taking screenshots of the page and performing difference analysis based on pixel sampling to identify anomalies; the other is a scheme based on attribute state monitoring, which collects attribute values ​​related to page rendering to establish a state set and determines anomalies based on the consistency of attribute changes. While the former can capture visual deviations, it relies on high-frequency screenshots and pixel-level comparisons, resulting in slow processing speed, significant performance overhead, and difficulty in accurately defining anomaly boundaries. Furthermore, UI iterations can cause historical image baselines to become invalid, leading to poor sustainability. The latter, while enabling code-level monitoring, is limited to projects using specific data-driven frameworks, and not all attributes are strongly correlated with visual rendering, resulting in incomplete monitoring coverage and limited accuracy.

[0022] In other words, when faced with page display anomalies caused by compatibility issues, dynamic rendering, or non-code errors, the relevant technologies cannot achieve low-cost, real-time proactive detection, nor can they maintain a stable and effective judgment benchmark as the UI continues to evolve. As a result, many anomalies cannot be detected in a timely manner, often passively relying on user feedback, leading to delayed problem exposure, prolonged repair cycles, and a decline in user experience.

[0023] Therefore, this disclosure provides a method for judging page anomalies. It involves obtaining the document object model (DOM) nodes and DOM elements of the target page, and filtering target nodes from the DOM nodes based on the corresponding business data of the target page. Structural feature analysis is performed on the target nodes according to preset metrics to obtain structural feature analysis results. Semantic analysis is also performed on the DOM elements within each target node to obtain semantic analysis results. Based on the structural feature analysis results and / or semantic analysis results, it is determined whether the target page exhibits anomalies. This disclosure performs structural feature analysis on target nodes to capture structural distortion problems caused by compatibility issues, dynamic loading, or rendering errors, overcoming the limitations of visual comparison being lagging and easily affected by UI iterations. Semantic analysis of DOM elements within nodes enables verification of element functionality, status, and content compliance, compensating for the narrow scope and low accuracy of attribute monitoring.

[0024] According to an embodiment of this disclosure, a method for determining page anomalies is provided. It should be noted that the steps shown in the flowchart in the accompanying drawings can be executed in a computer system such as a set of computer-executable instructions. Furthermore, although a logical order is shown in the flowchart, in some cases, the steps shown or described may be executed in a different order than that shown here.

[0025] This embodiment provides a method for determining page anomalies, which can be used in terminal devices. Figure 2 This is a flowchart of a method for determining page anomalies according to an embodiment of this disclosure, such as... Figure 2 As shown, the process includes the following steps: Step S201: Obtain the document object model nodes and document object model elements of the target page, and filter out the target node from the document object model nodes according to the business data corresponding to the target page.

[0026] In this embodiment, the target page refers to the page instance that is monitored, detected, or processed, such as the payment page of a product or the login page of an application.

[0027] In this embodiment, a Document Object Model (DOM) node, specifically a webpage, refers to a basic unit in a tree-like data structure generated during webpage parsing based on the HTML or XML document structure. A node is a single point in this tree-like data structure and can be an element, attribute, text, comment, etc. For example, in a webpage, a... A tag, a piece of text, or a class attribute can all be considered a DOM node.

[0028] Document Object Model (DOM) elements, in this embodiment, refer to nodes of type "element" in the DOM tree, i.e., nodes defined by HTML or XML tags, such as... 、 <input> 、 DOM elements are subsets of DOM nodes, containing characteristics such as tag names, attributes, and child nodes. For example, <input type="text" id="username"> It is a DOM element that corresponds to an interactive input box.

[0029] Business data refers to a specific set of data related to the function or logic of a target page. It is usually provided by the backend system or defined by the frontend logic and is used to guide the rendering or interactive behavior of page content. For example, in an e-commerce page, business data may include product ID, price, inventory status, etc.; in a form page, business data may include field validation rules, fill content, or display conditions.

[0030] In one embodiment, the DOM structure of the target page is accessed, and the target page is sampled to obtain the rendered Document Object Model (DOM) nodes or DOM elements in the target page. Then, based on logical rules of business data, such as importance, attribute matching, content matching, or structural position, nodes that meet the requirements are filtered from the obtained set of DOM nodes.

[0031] Reference Figure 3 The diagram illustrates a page diagram of a method for determining page anomalies according to an embodiment of this disclosure. Figure 3 The target page corresponds to business data related to payment. Therefore, the basic information module, payment method module, and operation area related to payment can be filtered as target nodes. The basic information module can include payment amount and payment account, the payment method module can include the current user's available payment methods, unavailable payment methods, and payment methods that can be added, and the operation area can include the "confirm payment" operation.

[0032] Specifically, this embodiment first obtains the DOM nodes and DOM elements of the target page, and then filters out the target nodes that need further operation from the DOM nodes based on business data, thereby accurately locating the page components related to business logic.

[0033] Step S202: Perform structural feature analysis on the target nodes based on preset metrics to obtain structural feature analysis results, and perform semantic analysis on the document object model elements in each target node to obtain semantic analysis results.

[0034] Preset metrics are rules used to quantify and evaluate the status, importance, or complexity of a target node within the page structure of a target page. For example, the nesting depth of target nodes within each area of ​​the target page (referring to the number of levels from the root node to the current target node), and the number of target nodes at each depth level within each area of ​​the target page can all be used as preset metrics.

[0035] In this embodiment, within each target node, the functional meaning or content role of the Document Object Model (DOM) element in the actual business scenario is analyzed, relying on the element's own attributes, content, contextual relationships, and predefined business rules. For example, a... <input> The element, structurally speaking, is an input box; however, through semantic analysis, combined with its type attribute (such as type="email"), and nearby elements... <label>Text (such as "user email") or the aria-label accessibility attribute can be semantically recognized as "email input field," and then the meaning can be determined. <input> Does the element actually function as an "email input field" under the target node?

[0036] For example, in the product details page of an e-commerce platform, filter out As a target node, this node is responsible for displaying core product information. Pre-defined metrics for the target node are calculated, such as dividing the target page into N regions and calculating the density distribution, maximum nesting depth, and average nesting depth of target nodes within each region.

[0037] Next, semantic analysis is performed on the DOM elements within each target node, starting by traversing every Document Object Model element within the target node. For example, for a... <h1>The element, whose text content is "Flagship Smartphone X1", is categorized as "Product Main Title"; for a class named gallery-main An element, combined with its src attribute pointing to a high-resolution image and its location within a specific container, is identified as the "main display image"; for a The element, based on the number of elements it contains with the data-rating attribute. The element is identified as a "user rating component"; for an element with the text "Add to cart"... <button>The element, combined with its id="add-to-cart", is identified as a "shopping cart add button".

[0038] Step S203: Based on the structural feature analysis results and / or semantic analysis results, determine whether there are any anomalies on the target page.

[0039] The structural feature analysis results are generated after analyzing the internal architecture and external relationships of the target node through preset metrics. Semantic analysis results are generated after identifying and analyzing the function and content meaning of each document object model element within the target node. These semantic analysis results represent the mapping relationship from the original page elements to business logic concepts. For example, the semantic analysis result for a product card might be labeled as: {Element 1: "Product Main Image", Element 2: "Product Title", Element 3: "Selling Price", Element 4: "Inventory Status"}.

[0040] An anomaly on the target page refers to a situation where the target page deviates from the expected or normal state in terms of structural integrity, correctness of business logic, or consistency of content presentation. This deviation is detectable, unexpected, and may affect functionality or user experience. For example, a target node having zero child nodes, or a "Buy Now" button (i.e., a Document Object Model element in this disclosure) not being grayed out and disabled according to business rules when the inventory is 0, are both considered anomalies on the target page.

[0041] Suppose we are monitoring an order confirmation page (the target page in this disclosure) of an e-commerce platform. On this page, the address selection module (target node 1 in this disclosure) and the payment method module (target node 2 in this disclosure) are key business areas. Normally, they should contain at least one address option. Suppose that structural feature analysis reveals that target node 1 has zero child nodes. This structural feature of target node 1 ("zero child nodes") triggers the rule that "the number of child nodes in a key form container should not be zero," thus confirming a content-missing structural anomaly on the target page.

[0042] In target node 2, semantic analysis reveals that the element representing "credit card payment option" has a computed value of none for its display style property, meaning the DOM element is hidden. However, the business data indicates that the user currently has a valid credit card linked to their account. Given the semantic analysis result "credit card payment option is hidden" and the business data indicating "user has an available credit card" in target node 2, since the corresponding semantic element should not be hidden if the user has an available payment method, a semantic anomaly of business logic inconsistency is identified on the target page.

[0043] The page anomaly detection method provided in this embodiment obtains the document object model (DOM) nodes and DOM elements of the target page, and filters out target nodes from the DOM nodes based on the business data corresponding to the target page. It then performs structural feature analysis on the target nodes according to preset metrics to obtain structural feature analysis results, and performs semantic analysis on the DOM elements within each target node to obtain semantic analysis results. Based on the structural feature analysis results and / or semantic analysis results, it determines whether the target page has anomalies. This embodiment performs structural feature analysis on target nodes to capture structural distortion problems caused by compatibility, dynamic loading, or rendering errors, overcoming the limitations of visual comparison being lagging and easily affected by UI iterations. Semantic analysis of DOM elements within nodes enables verification of element functionality, state, and content compliance, compensating for the narrow scope and low accuracy of attribute monitoring.

[0044] For step S201, obtain the document object model nodes and document object model elements of the target page, and filter out the target node from the document object model nodes according to the business data corresponding to the target page.

[0045] In this embodiment, the target page refers to the page instance that is monitored, detected, or processed, such as the payment page of a product or the login page of an application.

[0046] Document Object Model (DOM) nodes, in this embodiment, refer to each basic unit in the tree-like data structure generated during webpage parsing based on the HTML or XML document structure. A node is a single point in the tree-like data structure and can be an element, attribute, text, comment, etc.

[0047] Document Object Model (DOM) elements, in this embodiment, refer to nodes of type `<element>` in the DOM tree, that is, nodes defined by HTML or XML tags. DOM elements are a subset of DOM nodes, containing characteristics such as tag names, attributes, and child nodes.

[0048] Business data refers to a specific set of data related to the function or logic of the target page. It is usually provided by the backend system or defined by the frontend logic and is used to guide the rendering or interactive behavior of the page content.

[0049] In one embodiment, during the testing or canary release phase, the target page has been deployed in a pre-production or isolated environment and has a real operating context, but the risks are controllable. At this time, anomaly monitoring of the target page will not affect all online users and can generate page instances that are close to real business but with more diverse scenarios.

[0050] Specifically, the target page is sampled frequently under various normal scenarios. Normal scenarios refer to various typical usage situations that meet business expectations and have no known defects, and can include key dimensions such as different users, different data, and different states.

[0051] Different users are used to simulate user identities with different attributes, permissions, or preferences when accessing pages. For example, regular users and VIP users, new users and returning users, and users from different geographical locations may see different page content, functional modules, or recommended information.

[0052] Different data sets are used to drive the loading and processing of different datasets on the target page. For example, a product list page may load data formats such as an empty list, a small number of products, a large number of paginated products, and products with promotional tags.

[0053] Different states are used to trigger and capture snapshots of the page under different interactive states. For example, a form page in its initial state, partially filled state, and submitted state; or a tab page in its state after switching between different tabs.

[0054] Next, the target page is sampled frequently. Specifically, within a short period or over a sustained period, scenario traversal and page visits are automatically and repeatedly executed at regular intervals or based on event triggers, thereby collecting a large number of page instance samples. This ensures the comprehensiveness and statistical significance of the sampling, covering the page's performance under various normal fluctuations.

[0055] During each sampling, the total number of basic DOM nodes is recorded. The total number of DOM nodes refers to the total number of DOM nodes on the target page. Then, multi-dimensional preset metrics are extracted from the total number of DOM nodes. These preset metrics are used to quantitatively describe the structural characteristics of the DOM tree and the spatial relationships between elements. Specific metrics may include, but are not limited to, depth metrics, density metrics, element topology metrics, and stability metrics.

[0056] Depth metrics can include, for example, the maximum and average depth of the DOM tree, reflecting the complexity of page nesting. Density metrics can include, for example, the average and maximum number of child nodes at each level, reflecting the density of the page layout. Element topology metrics can include, for example, the clustering of interactive elements and the relative positional relationships of key content blocks, such as buttons and links. Stability metrics refer to the rate of structural change of the DOM subtree in dynamic content areas across multiple samplings.

[0057] In a single sampling, multi-dimensional preset metrics are calculated and extracted, and a feature vector is constructed based on the extraction results. The feature vector is represented as an ordered list or array of values, where each position corresponds to a specific metric value. For example, the feature vector of a single sampling might be represented as [total number of nodes: 1520, maximum depth: 12, interaction element clustering coefficient: 0.85, ...].

[0058] For step S202, structural feature analysis is performed on the target nodes based on preset metrics to obtain structural feature analysis results, and semantic analysis is performed on the document object model elements in each target node to obtain semantic analysis results.

[0059] In one embodiment, structural feature analysis of the target node is performed based on preset metrics to obtain structural feature analysis results. Specifically, a first structural feature of the target node is obtained and matched with a first baseline feature. If no match is found, the target page is determined to be abnormal. If a match is successful, at least one second structural feature of the target page is calculated, and the error rate between the second structural feature and the second baseline feature is calculated. The error rate is compared with a first threshold. If the error rate is greater than the first threshold, the target page is determined to be abnormal. If the error rate is less than or equal to the first threshold, the second structural feature is uploaded to the server. Based on the historical statistical data of the second structural feature in the server, the statistical fluctuation range of the second structural feature is calculated. It is determined whether the second structural feature of the target page exceeds the statistical fluctuation range. If so, the target page is determined to be abnormal.

[0060] The first structural feature refers to the hash value of the target node, which compresses the complex tree structure information of the target node into a fixed-length, highly unique hash value. The first baseline feature is the baseline hash value of the target node, pre-calculated and stored using the same algorithm under normal and correct page conditions. Matching refers to comparing the first structural feature calculated from the current sampling with the preset first baseline feature to check whether it meets expectations. Specifically, obtaining the first structural feature of the target node and matching it with the first baseline feature includes: obtaining the hash value of the target node, where the first baseline feature is the baseline hash value; and matching the hash value of the target node with the baseline hash value.

[0061] This embodiment performs instantaneous structural integrity and correctness checks on critical modules such as the navigation bar, product list container, and payment button group—areas crucial to business functionality and user experience—within complex target pages. Specifically, when calculating the hash value of a target node, this embodiment relies solely on purely descriptive structural information of the target page, such as tag names, quantities, and orders. This filters out dynamic text, numbers, and other content data contained within the target node and its child nodes, such as changes in product names, prices, and descriptions. Therefore, the hash value can stably represent the layout template or component framework of the target page and will not fluctuate due to normal updates to business data, thus accurately distinguishing between structural damage and content updates.

[0062] When performing hash calculations, the structural metadata of the target node is first extracted, such as the target node's label name, the number of child nodes under the target node, and the sequence of label names of the first-level child nodes under the target node. Note that the child nodes under the target node are ordered; that is, the order in which the child nodes appear is an important part of its structural characteristics. For example, a node with two child nodes... <h1>and A container with two child nodes and < / h1> <h1>The containers used in this process differ in structure, resulting in different hash values. The extracted structural metadata is combined into a corresponding string or data structure, and then hashed using hash functions such as MurmurHash or a truncated version of SHA-1 to generate the final hash value.

[0063] Next, the calculated hash value is precisely compared with the pre-stored baseline hash value. If a match is found, meaning the hash value is equal to the baseline hash value, it indicates that the DOM tree of the target node is completely consistent with the baseline state, and the structure has not undergone any abnormal changes, thus quickly passing the verification. If a match is not found, meaning the hash value is not equal to the baseline hash value, it means that the underlying XML structure of the target node has undergone unexpected changes. This could be due to front-end code deployment errors, third-party resource loading failures leading to incomplete component rendering, or malicious injection attacks that have tampered with the page structure, thus indicating that the target page is abnormal.

[0064] This embodiment is based on the hash of an ordered tag sequence, which can sensitively capture various structural anomalies such as disordered child element order, increased or decreased quantity, and type replacement, covering common rendering error types.

[0065] In one embodiment, after a successful match of the first structural feature, at least one second structural feature of the target page is calculated. The second structural feature is a continuous numerical metric used to describe the internal structure or topological relationship of the target node. Examples include the total number of child nodes of the target node, the maximum depth or average depth of the DOM subtree, or the spatial distribution density of interactive elements within the node. The second baseline feature represents the standard or expected value of the preset metric under baseline conditions, typically a single value or a range of values. The error rate is a quantitative indicator that calculates the deviation between the current second structural feature value and the second baseline feature value, and can be calculated using absolute error, relative error, or standardized distance (such as Z-score). The first threshold is a pre-set, tolerable upper limit of deviation. For example, for a product list container node, the total number of child nodes of its second baseline feature might be 20, corresponding to 20 products displayed per page. If the current value is calculated to be 19 in a single sampling, the relative error rate is calculated to be 5%. If the preset first threshold is 5%, the error rate is less than or equal to the threshold and is considered an acceptable normal fluctuation, and the process continues; if the current value is 10, the error rate reaches 50%, which is far beyond the first threshold, and the target page is immediately determined to be abnormal.

[0066] Specifically, the second structural feature in this embodiment includes a density distribution index and a depth index. Calculating at least one second structural feature of the target page and calculating the error rate between the second structural feature and a second baseline feature, and comparing the error rate with a first threshold, includes: calculating the density distribution index and depth index of the target page, and at each target node, calculating a first error value between the density distribution index and the baseline density distribution, and a second error value between the depth index and the baseline depth index; comparing the first error value and the second error value with the first threshold respectively.

[0067] Specifically, this embodiment can divide the entire target page into N key areas based on the physical coordinates of the viewport, such as an equal grid; semantic layout, such as header, main content area, sidebar, and footer; or logical partitioning of the DOM tree.

[0068] Within each defined region, the number of target nodes at each DOM depth level within that region is calculated. Depth level refers to the DOM nesting level relative to the root node of the entire target page or the root node of the region. For example, region A has 10 nodes at depth 2 and 25 nodes at depth 3. Finally, based on the node count data for all regions and all depth levels in the target page, a two-dimensional matrix is ​​constructed representing the number of regions and the maximum depth. This two-dimensional matrix serves as the region DOM density distribution map of the target page, reflecting the distribution density of target nodes across regions and their stacking at depth. It can accurately capture structural density changes caused by element additions or deletions, layout misalignments, or accidental collapses.

[0069] Depth metrics include maximum depth and average depth. When calculating the maximum and average depth of a target node, the entire target page or the DOM subtree of each region is traversed first. The path length from the root node to the deepest leaf node is calculated as the maximum depth, reflecting the maximum complexity of the target page's nested structure. The average depth is calculated as the average depth of all child node depths, reflecting the average complexity of the page's nested structure. An abnormal increase in the depth metric may indicate unexpected infinite nesting or rendering errors, while an abnormal decrease may indicate that content has been unexpectedly truncated.

[0070] After obtaining the density and depth metrics for the current page, for the density metric, the currently calculated two-dimensional matrix is ​​compared element-by-element with the baseline density distribution matrix obtained from sampling statistics under normal conditions. The difference between the two is calculated to obtain the first error value. (Refer to...) Figure 4 This diagram illustrates the DOM distribution of the page anomaly detection method according to an embodiment of this disclosure. Figure 3 Taking the target page and target node as an example, Figure 4 It shows the normal and abnormal DOM distribution of target nodes such as basic information, payment methods, and operation areas at each level.

[0071] For the depth metric, the maximum depth and average depth of the current page are compared with the baseline depth metric under normal conditions. The baseline depth metric includes the baseline maximum depth and the baseline average depth. The relative errors between the maximum depth and the baseline maximum depth, and between the average depth and the baseline average depth can be calculated to obtain the second error value.

[0072] Furthermore, the calculated first and second error values ​​are compared with a preset first threshold. For example, the first threshold is an adjustable parameter representing the inherent and acceptable range of structural fluctuations allowed in a page due to dynamic content and normal functional state switching. If either the first or second error value exceeds the first threshold, it is determined that the structural density or nesting complexity of the current target page has undergone an abnormal change exceeding the normal dynamic range, and the target page is deemed abnormal. For example, this determination would be triggered if the DOM density matrix of a key area experiences a significant decrease in density due to a component loading failure, or if its maximum depth increases sharply due to a loop rendering error.

[0073] If both the first error value and the second error value are less than or equal to the first threshold, then the current target page structure is considered to be within the normal fluctuation range. At this point, the fluctuation range can be further verified based on historical statistical data.

[0074] This embodiment employs an automated detection method that constructs and compares regionalized and hierarchical DOM density distribution matrices and depth indicators, combined with adjustable thresholds for multi-level and multi-dimensional error analysis. This method differs from existing simple rule checks or screenshot comparisons. Furthermore, it configures an adjustable first threshold, effectively distinguishing between abnormal structural damage and normal dynamic changes, significantly reducing false alarms caused by the business functions themselves, and improving the accuracy of detection.

[0075] In one embodiment, after the aforementioned determination, the second structural feature can be uploaded to a remote server, which contains continuously updated historical statistical data. Based on the historical statistical data, statistical analysis is performed on the uploaded second structural feature to calculate the statistical fluctuation range of the feature within the current time window. For example, "mean ± 3 standard deviations" can be used as the normal fluctuation boundary to reflect the normal pattern of natural fluctuation of the indicator in long-term operation.

[0076] The currently sampled second structural feature value is compared with the statistical fluctuation range. If it exceeds the statistical fluctuation range, it indicates that the structural feature sampled this time deviates from its own historical normal behavior pattern. Even if its static error rate does not exceed the first threshold, it may indicate a trend anomaly. For example, the number of child nodes in the product list container has historically fluctuated steadily between 18 and 22. Suddenly, a value of 25 appears consecutively. Although its error rate with the benchmark value of 20 is 25%, if the first threshold is set to 30%, it does not exceed the set first threshold. However, because it deviates from its own historical statistical fluctuation range, it will still be judged that there is an anomaly in the target page, thereby enhancing the ability to perceive implicit, slow, or new anomaly patterns.

[0077] Specifically, based on the historical statistical data of the second structural feature in the server, the statistical fluctuation range of the second structural feature is calculated, including: obtaining the historical statistical data of the second structural feature from the server and calculating the mean and standard deviation of the historical statistical data; and generating the statistical fluctuation range of the second structural feature based on the mean and standard deviation.

[0078] Specifically, the remote server continuously receives and stores the second structural features from a massive number of normal access sessions, forming historical statistical data that grows over time. The historical statistical data represents the structural features of the target page under various normal business scenarios, such as different users, different data, and different interaction states.

[0079] The historical statistical data of the second structural feature of the target node on each target page are periodically analyzed to calculate the mean and standard deviation. The mean is the arithmetic mean of all historical statistical data, representing the central trend or normal level of the structural feature in long-term operation. The standard deviation is a quantitative indicator of the average deviation of all historical statistical data from the mean, representing the inherent volatility or dispersion of the structural feature in long-term operation.

[0080] Based on the calculated mean and standard deviation, the statistical fluctuation range of this feature within the current time window is generated according to the principle of normal distribution. , where represents the mean , representing standard deviation Statistically, for data with an approximately normal distribution, about 99.7% of normal data will fall within this statistical fluctuation range. Next, the second structural features uploaded by the terminal device can be compared with the statistical fluctuation range in the remote server. If both the density and depth indices in the second structural features are within the fluctuation range, the target page is considered normal. If the density and depth indices in the reported second structural features exceed their corresponding statistical fluctuation ranges, the sampling is considered to have deviated from its historical normal behavior pattern, and the target page is abnormal. This allows for the timely detection of trend deviations and sudden rare anomalies.

[0081] In one embodiment, semantic analysis is performed on document object model elements in each target node to obtain semantic analysis results. Specifically, the node identifier of each target node is obtained; in each target node, the correctness of the attributes of the document object model elements is determined based on the node identifier; in each target node, the number of document object model elements visible to the user is obtained, and it is determined whether the number of document object model elements is within the normal range; in each target node, the current position of the document object model elements visible to the user is obtained, and it is determined whether the current position of the document object model elements is correct.

[0082] Specifically, the process begins by obtaining the node identifier for each target node. Each node identifier uniquely corresponds to a specific business module or UI component, such as a "product main image carousel container," a "user nickname display area," or an "inventory quantity label." The node identifier indicates the attribute conditions that various DOM elements should meet. Next, the attribute values ​​of the target nodes identified by the node identifiers are checked against expectations. For example, within the target node identified as the "product purchase button," the process is further examined...< / h1> < / button> <button>Check if the disabled attribute of the element is consistent with the business logic (e.g., it should be true when the inventory is 0); within the node identified as "user avatar area", check... Check if the element's src attribute is valid and correctly formatted, and if the alt attribute is not empty (compliant with accessibility standards); within the node identified as the "form submission button", check if its type attribute is "submit", thus ensuring that the element's basic functional state is synchronized with business data and conforms to design specifications.

[0083] Furthermore, the number of visible Document Object Model (DOM) elements is obtained and compared with the normal range corresponding to the node identifier. For example, within a node identified as "top navigation menu item," the normal range might be [5, 7] visible elements. Elements. If only 3 elements are rendered, it is considered a content missing anomaly; if 10 elements are rendered, it may be due to data corruption or duplicate rendering anomalies. Within the node identified as "Search Results List," the normal range is [1, 50] visible product cards; if the number is 0, it may be due to a no-result rendering anomaly or a search function malfunction. This effectively prevents incomplete target page content caused by abnormal data interfaces or errors in front-end rendering logic.

[0084] Furthermore, the browser API is used to obtain the current position of the DOM elements visible to the user. This position is typically represented by coordinates relative to the viewport or parent container. The obtained actual position of the element is then compared with the expected or legal position area defined based on node identifiers and page design specifications. Specifically, for key elements in fixed layouts, such as the "login button," it is checked whether they appear near the expected precise coordinates; for list or flow layouts, the relative order or topological relationship of DOM elements is checked. For example, within a node identified as "product price sorting list," the price is verified to be arranged from low to high. Verify that the elements are in the correct vertical order. Verify that elements with specific functions are always within the visible area of ​​their container and are not pushed out due to layout errors. For example, verify that the confirmation button in an alert popup is always within the popup's visible area. This can help identify serious layout problems caused by CSS style conflicts, float errors, abnormal positioning, etc.

[0085] This embodiment performs semantic analysis on document object model elements at each target node, enabling it to detect whether the attribute states, visible quantity, and spatial positions of key interactive elements meet expectations from a business logic perspective. It covers various functional anomalies that traditional methods easily miss, such as button states not matching data, unexpected missing or duplicated content, and element misalignment or overflow due to layout errors. By transforming business rules into verifiable multi-dimensional constraints, it improves the depth and accuracy of front-end anomaly detection, ensuring the functional integrity and visual consistency of the user interface.

[0086] In one embodiment, for a target page exhibiting anomalies, a corresponding alarm log is generated, and the text data exchange format of the target page is updated. Specifically, in this embodiment, after analyzing and determining that the target page is abnormal, the outdated text data exchange format is updated in reverse. In this embodiment, the text data exchange format refers to a JSON data structure, representing the static baseline configuration stored on the terminal device for comparison in the first two levels.

[0087] Furthermore, when it is determined that the mean value in the second structural feature has deviated from the second baseline feature stored in the terminal device configuration file, and this deviation is judged to be due to normal business development, such as a reasonable increase in page density after a product redesign, this embodiment can update the text data exchange format of the target page to generate a new baseline configuration file (JSON) that better reflects the current situation, and then distribute the updated baseline configuration file to each terminal device.

[0088] After determining that the target page is abnormal, this embodiment automatically generates alarm logs and dynamically updates the JSON data structure used as a static baseline configuration. When it is confirmed that the abnormality of the target page is caused by normal business iteration rather than a fault, this embodiment overwrites the outdated baseline configuration with new structural feature data. This effectively solves the problems of baseline drift and false alarm proliferation caused by continuous iteration of the target page in traditional static threshold monitoring, reduces long-term maintenance costs, and ensures the sustainability of detection accuracy.

[0089] This embodiment also provides a page anomaly detection device, which is used to implement the above embodiments and preferred embodiments, and will not be repeated as already described. As used below, the term "module" can be a combination of software and / or hardware that implements a predetermined function. Although the device described in the following embodiments is preferably implemented in software, hardware implementation, or a combination of software and hardware, is also possible and contemplated.

[0090] This embodiment provides a device for determining page anomalies, such as... Figure 5 As shown, it includes: The acquisition module 501 is used to acquire the document object model nodes and document object model elements of the target page, and to filter out the target node from the document object model nodes according to the business data corresponding to the target page.

[0091] The analysis module 502 is used to perform structural feature analysis on the target nodes based on preset metrics, obtain structural feature analysis results, and perform semantic analysis on the document object model elements in each target node, obtain semantic analysis results.

[0092] The judgment module 503 is used to determine whether there are any anomalies in the target page based on the structural analysis results and / or semantic analysis results.

[0093] In some alternative implementations, the analysis module 502 includes: The first-level analysis unit is used to obtain the first structural features of the target node and match the first structural features with the first baseline features; if no match can be found, it is determined that the target page is abnormal.

[0094] The secondary analysis unit is used to calculate at least one second structural feature of the target page if a match is successful, and to calculate the error rate between the second structural feature and the second baseline feature, and compare the error rate with a first threshold; if the error rate is greater than the first threshold, the target page is determined to be abnormal; if the error rate is less than or equal to the first threshold, the second structural feature is uploaded to the server.

[0095] The third-level analysis unit is used to calculate the statistical fluctuation range of the second structural feature based on the historical statistical data of the second structural feature in the server; determine whether the second structural feature of the target page exceeds the statistical fluctuation range; if so, determine that the target page is abnormal.

[0096] In some alternative implementations, the primary analysis unit includes: The hash acquisition sub-unit is used to obtain the hash value of the target node, with the first benchmark feature being the benchmark hash value.

[0097] The hash matching subunit is used to match the hash value of the target node with the base hash value.

[0098] In some optional implementations, the second structural feature includes a density distribution index and a depth index, and the secondary analysis unit includes: The error calculation subunit is used to calculate the density distribution index and depth index of the target page, and at each target node, calculate the first error value between the density distribution index and the baseline density distribution, and the second error value between the depth index and the baseline depth index.

[0099] The error comparison subunit is used to compare the first error value and the second error value with the first threshold, respectively.

[0100] In some alternative implementations, the three-level analysis unit includes: The historical data acquisition subunit is used to obtain historical statistical data of the second structural feature from the server and calculate the mean and standard deviation of the historical statistical data.

[0101] The fluctuation range calculation subunit is used to generate the statistical fluctuation range of the second structural feature based on the mean and standard deviation.

[0102] In some alternative implementations, the analysis module 502 includes: The identifier acquisition unit is used to acquire the node identifier of each target node.

[0103] The attribute judgment unit is used to determine whether the attributes of document object model elements are correct based on the node identifier in each target node.

[0104] The quantity judgment unit is used to obtain the number of document object model elements visible to the user in each target node, and to determine whether the number of document object model elements is within the normal range.

[0105] The position determination unit is used to obtain the current position of the document object model element visible to the user in each target node, and to determine whether the current position of the document object model element is correct.

[0106] In some alternative implementations, the apparatus further includes: The update module is used to generate corresponding alarm logs for target pages with anomalies and update the text data exchange format of the target pages with anomalies.

[0107] The page anomaly detection device provided in this disclosure can execute the page anomaly detection method provided in any embodiment of this disclosure, and has the corresponding functional modules and beneficial effects of the method execution. Further functional descriptions of the various modules and units described above are the same as in the corresponding embodiments described above, and will not be repeated here.

[0108] Figure 6 This is a schematic diagram of the structure of an electronic device provided in an embodiment of this disclosure.

[0109] The following is a detailed reference. Figure 6 This diagram illustrates a suitable structural schematic for implementing an electronic device according to embodiments of the present disclosure. The electronic device may include a processor (e.g., a central processing unit, graphics processor, etc.) 601, which can perform various appropriate actions and processes based on a program stored in read-only memory (ROM) 602 or a program loaded from memory 608 into random access memory (RAM) 603. The RAM 603 also stores various programs and data required for the operation of the electronic device. The processor 601, ROM 602, and RAM 603 are interconnected via a bus 604. An input / output (I / O) interface 605 is also connected to the bus 604.

[0110] Typically, the following devices can be connected to I / O interface 605: input devices 606 including, for example, touchscreens, touchpads, keyboards, mice, cameras, microphones, accelerometers, gyroscopes, etc.; output devices 607 including, for example, liquid crystal displays (LCDs), speakers, vibrators, etc.; memory devices 608 including, for example, magnetic tapes, hard disks, etc.; and communication devices 609. Communication device 609 allows electronic devices to communicate wirelessly or wiredly with other devices to exchange data. Although Figure 6 Electronic devices with various devices are shown, but it should be understood that it is not required to implement or have all of the devices shown, and more or fewer devices may be implemented or have instead.

[0111] In particular, according to embodiments of this disclosure, the processes described above with reference to the flowcharts can be implemented as computer software programs. For example, embodiments of this disclosure include a computer program product comprising a computer program carried on a non-transitory computer-readable medium, the computer program containing program code for performing the methods shown in the flowcharts. In such embodiments, the computer program can be downloaded and installed from a network via a communication device 609, or installed from a memory 608, or installed from a ROM 602. When the computer program is executed by the processor 601, it performs the functions defined in the page anomaly determination method of embodiments of this disclosure.

[0112] Figure 6 The electronic device shown is merely an example and should not be construed as limiting the functionality and scope of the embodiments disclosed herein.

[0113] This disclosure also provides a computer-readable storage medium in which the methods described in this disclosure can be implemented in hardware or firmware, or implemented as recordable on a storage medium, or implemented as computer code originally stored on a remote storage medium or a non-transitory machine-readable storage medium and subsequently stored on a local storage medium after being downloaded via a network. Thus, the methods described herein can be processed by software stored on a storage medium using a general-purpose computer, a dedicated processor, or programmable or dedicated hardware. The storage medium can be a magnetic disk, optical disk, read-only memory, random access memory, flash memory, hard disk, or solid-state drive, etc.; further, the storage medium can also include combinations of the above types of memory. It is understood that computers, processors, microprocessor controllers, or programmable hardware include storage components capable of storing or receiving software or computer code. When the software or computer code is accessed and executed by the computer, processor, or hardware, the page anomaly detection method shown in the above embodiments is implemented.

[0114] A portion of this disclosure can be applied to computer program products, such as computer program instructions, which, when executed by a computer, can invoke or provide methods and / or technical solutions according to this disclosure through the operation of the computer. Those skilled in the art will understand that the forms in which computer program instructions exist in a computer-readable medium include, but are not limited to, source files, executable files, and installation package files. Accordingly, the ways in which computer program instructions are executed by a computer include, but are not limited to: the computer directly executing the instructions; the computer compiling the instructions and then executing the corresponding compiled program; the computer reading and executing the instructions; or the computer reading and installing the instructions and then executing the corresponding installed program. Here, the computer-readable medium can be any available computer-readable storage medium or communication medium accessible to a computer.

[0115] Although embodiments of the present disclosure 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 present disclosure, and such modifications and variations all fall within the scope defined by the appended claims. < / button> < / h1> < / label>

Claims

1. A method for determining page anomalies, characterized in that, The method includes: Obtain the document object model nodes and document object model elements of the target page, and filter out the target node from the document object model nodes according to the business data corresponding to the target page; Structural feature analysis is performed on the target nodes based on preset metrics to obtain structural feature analysis results, and semantic analysis is performed on the document object model elements in each target node to obtain semantic analysis results; Based on the structural feature analysis results and / or the semantic analysis results, determine whether the target page has any anomalies.

2. The method according to claim 1, characterized in that, The structural feature analysis of the target node based on preset metrics, to obtain the structural feature analysis results, includes: Obtain the first structural feature of the target node and match the first structural feature with the first benchmark feature; if no match can be found, determine that the target page is abnormal. If a match is successful, at least one second structural feature of the target page is calculated, and the error rate between the second structural feature and the second baseline feature is calculated. The error rate is then compared with a first threshold. If the error rate is greater than the first threshold, the target page is determined to be abnormal; if the error rate is less than or equal to the first threshold, the second structural feature is uploaded to the server. Based on the historical statistical data of the second structural feature in the server, the statistical fluctuation range of the second structural feature is calculated; Determine whether the second structural feature of the target page exceeds the statistical fluctuation range; if so, determine that the target page is abnormal.

3. The method according to claim 2, characterized in that, The step of obtaining the first structural feature of the target node and matching the first structural feature with the first reference feature includes: Obtain the hash value of the target node, where the first reference feature is the reference hash value; The hash value of the target node is matched with the base hash value.

4. The method according to claim 2, characterized in that, The second structural feature includes a density distribution index and a depth index. The calculation of at least one second structural feature of the target page, and the calculation of the error rate between the second structural feature and a second baseline feature, and the comparison of the error rate with a first threshold, includes: Calculate the density distribution index and depth index of the target page, and at each target node, calculate the first error value between the density distribution index and the baseline density distribution, and the second error value between the depth index and the baseline depth index; The first error value and the second error value are compared with the first threshold respectively.

5. The method according to claim 2, characterized in that, The calculation of the statistical fluctuation range of the second structural feature based on historical statistical data of the second structural feature in the server includes: Historical statistical data of the second structural feature are obtained from the server, and the mean and standard deviation of the historical statistical data are calculated. The statistical fluctuation range of the second structural feature is generated based on the mean and the standard deviation.

6. The method according to claim 1, characterized in that, The semantic analysis of the document object model elements in each target node to obtain semantic analysis results includes: Obtain the node identifier of each target node; In each target node, the attributes of the document object model element are determined to be correct based on the node identifier; In each target node, the number of document object model elements visible to the user is obtained, and it is determined whether the number of document object model elements is within the normal range. In each target node, the current position of the document object model element visible to the user is obtained, and it is determined whether the current position of the document object model element is correct.

7. A device for determining page anomalies, characterized in that, The device includes: The acquisition module is used to acquire the document object model nodes and document object model elements of the target page, and to filter out the target node from the document object model nodes according to the business data corresponding to the target page; The analysis module is used to perform structural feature analysis on the target node based on preset metrics to obtain structural feature analysis results, and to perform semantic analysis on the document object model elements in each target node to obtain semantic analysis results. The judgment module is used to determine whether the target page has any anomalies based on the structural analysis results and / or the semantic analysis results.

8. An electronic device, characterized in that, include: A memory and a processor are interconnected, the memory stores computer instructions, and the processor executes the computer instructions to perform the page anomaly detection method according to any one of claims 1 to 6.

9. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores computer instructions for causing the computer to execute the page anomaly determination method according to any one of claims 1 to 6.

10. A computer program product, characterized in that, It includes computer instructions, which are used to cause a computer to execute the page anomaly determination method according to any one of claims 1 to 6.

Images