WebView-based cross-platform anomaly detection and repair method and system
By introducing a multi-layer monitoring mechanism in the H5 page and WebView components, monitoring and repairing exceptions in real time, the problem of inefficient abnormal detection in the existing technology is solved, and accurate detection and positioning of cross-platform abnormalities is realized, and user experience is improved.
Patent Information
- Application Number
- CN202510259719.5
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2025-03-06
- Publication Date
- 2025-04-08
- Estimated Expiration
- 2045-03-06
AI Technical Summary
The prior art is inefficient in abnormal detection and rapid recovery of H5 pages and WebView components, and cannot effectively monitor bidirectional communication exceptions, asynchronous function exceptions and third-party UI components, resulting in poor user experience.
The cross-platform exception detection and repair method based on WebView is adopted, and the JS bidirectional heartbeat mechanism monitoring is monitored, the JS function execution identification monitoring and gesture triggering two-way consistency monitoring, and the communication, logic and interaction status of H5 pages and WebView components are monitored in real time, and exceptions are quickly discovered and intelligently repaired.
It realizes comprehensive exception monitoring of H5 pages and WebView components, quickly detects and repairs exceptions, and improves user experience and system stability.
Smart Images

Figure CN119783118A_ABST
Abstract
Description
Technical Field
[0001] The present invention belongs to the technical field of cross-platform exception handling, and in particular relates to a method and system for cross-platform exception detection and repair based on WebView. Background Art
[0002] With the widespread application of WebView in cross-platform development, exception detection and rapid recovery of H5 pages and WebView components have become key issues. Traditional exception detection methods usually only monitor H5 pages in one direction, ignoring the exceptions of the WebView component itself, and it is difficult to quickly capture complex asynchronous logic exceptions or exceptions of third-party UI components. This paper proposes a cross-platform exception detection and repair method based on WebView. With the widespread use of WebView in mobile applications, H5 pages have become an important tool for cross-platform development. However, due to the complexity of H5 pages themselves and the introduction of third-party UI components, the system often encounters exceptions during operation, including communication interruption, logic dead loop, and no response to user interaction. Existing technologies mostly use one-way heartbeat mechanisms or global monitoring solutions, which have the following main shortcomings: (1) The one-way heartbeat mechanism cannot effectively detect anomalies in two-way communication; (2) Exceptions in asynchronous functions or closed-source third-party UI components are difficult to monitor; (3) The efficiency of exception capture is low, and it often takes a long time, such as 5 seconds, to discover an abnormal problem.
[0003] Therefore, we need to develop a cross-platform exception detection and repair method and system based on WebView, which can realize real-time monitoring of H5 pages and WebView components through a multi-layer monitoring mechanism, cover communication, logic, and interaction multi-level exception monitoring, quickly discover and intelligently repair exceptions, and ensure user experience. Summary of the invention
[0004] The purpose of the present invention is to provide a method and system for cross-platform exception detection and repair based on WebView, so as to solve the problems of low exception detection efficiency and insufficient exception detection in the existing exception handling schemes mentioned in the above background technology.
[0005] To achieve the above object, the present invention provides a method and system for cross-platform anomaly detection and repair based on WebView, and the method is specifically as follows: When the App starts, the WebView component is initialized, the H5 page is loaded, and multiple listeners are injected: JS bidirectional heartbeat mechanism monitoring, JS function execution identification monitoring, and gesture trigger bidirectional consistency monitoring; The operation of the H5 page is detected for abnormality through the listener, wherein the JS bidirectional heartbeat mechanism monitor is used to monitor the communication status between the WebView and the H5 page, the JS function execution identification listener is used to monitor the running status of the asynchronous function, and the gesture trigger bidirectional consistency monitor is used to monitor the consistency of the user interaction behavior; When any of the listeners triggers an exception, the system immediately refreshes the H5 page and automatically skips the abnormal function or component, and uploads the abnormal data to the server, including the event type and the listener ID; The server classifies and analyzes the abnormal data, identifies abnormal problems, generates dynamic repair patches for the abnormal problems, and injects them into the H5 page through the WebView to achieve rapid repair of the abnormal problems.
[0006] Based on the above scheme, the JS two-way heartbeat mechanism monitors, including the heartbeat sending and confirmation from the WebView to the H5 page, the heartbeat sending and confirmation from the H5 page to the WebView, two-way heartbeat anomaly detection and triggering, and two-way heartbeat anomaly processing and recovery.
[0007] Based on the above scheme, the JS function executes identification monitoring, including: if the asynchronous function does not trigger the end identification after triggering the start identification, it is determined to be a logical exception.
[0008] Based on the above solution, the gesture triggers bidirectional consistency monitoring, including: When a user triggers an interaction event, the H5 page and the WebView capture the interaction event at the same time. If the H5 page does not capture the interaction event but the WebView captures the interaction event, the H5 page is determined to be abnormal.
[0009] Based on the above scheme, the JS two-way heartbeat mechanism monitoring is specifically as follows: Heartbeat sending and confirmation from the WebView to the H5 page: the WebView sends a first heartbeat instruction to the H5 page every a seconds, the first heartbeat instruction is 1 byte in length and the value is 0, and the H5 page needs to immediately return a first confirmation instruction after receiving the first heartbeat instruction, the first confirmation instruction is 1 byte in length and the value is 1; Heartbeat transmission and confirmation from the H5 page to the WebView: the H5 page sends a second heartbeat instruction to the WebView every a seconds, the second heartbeat instruction is 1 byte in length and the value is 0, and the WebView needs to immediately return a second confirmation instruction after receiving the second heartbeat instruction, the second confirmation instruction is 1 byte in length and the value is 1; The bidirectional heartbeat anomaly detection and triggering: if the first confirmation instruction is not received within the limited time threshold after the first heartbeat instruction is sent, or if the second confirmation instruction is not received within the limited time threshold after the second heartbeat instruction is sent, it is determined to be a communication anomaly, and the heartbeat fast anomaly processing is triggered; if the H5 page or the WebView does not receive the heartbeat signal of the other party for a seconds, it is determined to be a serious anomaly (such as component crash, page unresponsiveness, etc.), and the heartbeat anomaly recovery mechanism is triggered; the limited time threshold is specifically 300 milliseconds; The bidirectional heartbeat exception processing and recovery: When the heartbeat fast exception processing or the heartbeat exception recovery mechanism is triggered, the system will record the exception information, including the heartbeat sender, receiver status, and unconfirmed heartbeat instructions, trigger the page refresh mechanism, reinitialize the H5 page, ensure that the system returns to a normal state, and upload the exception log to the server for subsequent analysis and optimization.
[0010] Based on the above solution, the JS function performs identification monitoring, specifically: When the asynchronous logic is running, the start and end markers of the JS function are monitored; If it is detected that the asynchronous function cannot trigger the end mark, the asynchronous function is determined to be an abnormal function, and the abnormal reasons include page freeze, no response, long business logic time consumption, and logic dead loop; Start the abnormal reporting mechanism, automatically refresh the H5 page and skip the abnormal function.
[0011] Based on the above solution, the gesture triggers bidirectional consistency monitoring, specifically: Initialize gesture listening: set the first gesture listener in the outermost layer of the WebView to capture all gesture events of the user on the screen, and set the second gesture listener in the interactive area on the page to capture the gesture events performed on the H5 page, which include single click, slide, and touch; When the user triggers the gesture event, the H5 page and the WebView capture the gesture event at the same time. If the H5 page does not capture the gesture event but the WebView captures the gesture event, or the gesture event captured by the WebView does not match the gesture event transmitted by the H5 page, it is determined that the H5 page gesture trigger is abnormal. When the gesture triggering exception is detected, the WebView will prompt the user that the H5 page is about to be refreshed, and automatically reload the H5 page to restore the normal interaction logic, and upload the exception data to the server. The exception data includes the exception type, gesture event status value, and the timestamp of the gesture triggering exception.
[0012] Based on the above solution, skipping the abnormal function is specifically as follows: The H5 page initializes the abnormal method name set List, and defines the abnormal method name map<method name, bool> structure for storing the abnormal function, where the method name is the abnormal function name also recorded as key, and bool is the state value value, which is a Boolean type. When the value is true, it means that the JS function is judged to be abnormal, and when it is false, it means that the JS function is normal; The WebView defines a data structure for receiving a JS function name map<method name, status value>, which is used to manage the execution status of the abnormal method name map, where the status value is 0 for start and 1 for reception; When the H5 page executes the JS function, it first determines whether the JS function exists in the abnormal method name map. If it exists, it returns directly. If it does not exist, it passes the method name and the status value to the receiving JS function name of the WebView and executes normally. The received JS function name calls map.put(method name, 0), indicating that the JS function of the H5 page starts to execute, and waits for the H5 page to send a JS function execution end instruction, and sets the waiting time threshold to b seconds, wherein b is preferably 12. If the JS function starts to execute b seconds and has not received the JS function execution end instruction, then there is an exception in the JS function, resulting in an infinite loop or freeze, or a serious time-consuming phenomenon. The method name is recorded in the abnormal method name set List, and the method name is passed to the H5 page through the JS interface communication mode, and reported to the server, and map.remove(method name) in the WebView is executed to remove the method name described in the received JS function name; If the receiving JS function name receives the method name and the end status as parameters, it determines whether the status of the method name is the start status. If so, the map.remove (method name) code is called, indicating that the JS function is executed normally, otherwise it indicates an exception. The method name is passed to the H5 page through the JS interface communication method and reported to the server.
[0013] In addition, the present invention also provides a cross-platform anomaly detection and repair system based on WebView, which is as follows: The listener injection module is used to initialize the WebView component and load the H5 page when the App is started. During the H5 page loading process, multiple listeners are injected: JS bidirectional heartbeat mechanism monitoring, JS function execution identification monitoring, and gesture trigger bidirectional consistency monitoring; A monitoring module, used to detect abnormalities in the operation of the H5 page through the multiple listeners, wherein the JS bidirectional heartbeat mechanism monitor is used to monitor the communication status between the WebView and the H5 page, and the JS function execution identification listener is used to monitor the running status of the asynchronous function; the gesture-triggered bidirectional consistency monitor is used to monitor the consistency of user interaction behavior; The exception reporting module is used for causing the system to immediately refresh the H5 page and automatically skip the abnormal function or component after any of the listeners trigger an exception, and upload the abnormal data to the server, wherein the abnormal data includes the event type and the listener ID; The abnormality repair module is used to classify and analyze the abnormal data through the server, identify abnormal problems, generate dynamic repair patches for the abnormal problems, and inject them into the H5 page through the WebView to achieve rapid repair of the abnormal problems.
[0014] Compared with the prior art, the present invention has the following advantages and effects: (1) Designed a JS two-way heartbeat mechanism monitor to implement two-way communication detection between WebView and H5 pages. It can effectively detect two-way communication anomalies such as component crashes and communication interruptions, and quickly restore the page to normal status; (2) Introduce JS function execution mark monitoring, monitor the start mark and end mark when the asynchronous function is executed. If the function does not trigger the end mark or exceeds the set time, it is judged as a logical exception and recorded in the exception method set for filtering. It can realize detection while executing, accurately capture exceptions in asynchronous functions, automatically skip the abnormal function and refresh the page to ensure page stability; (3) Design gesture-triggered bidirectional consistency monitoring to synchronously capture gesture data such as clicks, slides, and touches in the interaction events between WebView and H5 pages. If the H5 page fails to capture the data, the captured event is inconsistent with WebView, and the interaction is judged as abnormal and the page is automatically restored. This can effectively cover the abnormalities of closed-source third-party UI components. Through interaction event consistency monitoring, the abnormality of H5 page unresponsiveness can be accurately located. BRIEF DESCRIPTION OF THE DRAWINGS
[0015] Figure 1 It is a flow chart of a method for cross-platform anomaly detection and repair based on WebView provided by an embodiment of the present invention; Figure 2 It is a flow chart of a JS bidirectional heartbeat mechanism monitoring and JS function execution identification monitoring solution provided by an embodiment of the present invention; Figure 3 is a flow chart of a gesture-triggered bidirectional consistency monitoring solution provided by an embodiment of the present invention; Figure 4is a flow chart of an abnormal function filtering solution provided by an embodiment of the present invention; Figure 5 It is a flow chart of the start instruction and end instruction scheme of the proxy mode automatic joining method provided by an embodiment of the present invention; Figure 6 It is a structural diagram of a cross-platform anomaly detection and repair system based on WebView provided in an embodiment of the present invention. DETAILED DESCRIPTION
[0016] In order to more clearly explain the purpose, technical solutions and advantages of the present invention, the technical solutions in the embodiments of the present invention will be clearly and completely described below in conjunction with the drawings in the embodiments of the present invention. Obviously, the described embodiments are only part of the embodiments of the present invention, rather than all of the embodiments. The example implementation methods can be implemented in various forms and should not be understood as being limited to the examples described herein. On the contrary, these implementation methods are provided to make the present invention more comprehensive and complete, and to fully convey the concepts of the example implementation methods to those skilled in the art.
[0017] In addition, the described features, structures or characteristics may be combined in one or more embodiments in any suitable manner. In the following description, many specific details are provided to provide a full understanding of the embodiments of the present invention. However, those skilled in the art will appreciate that the technical solution of the present invention can be practiced without one or more of the specific details, or other methods, components, devices, steps, etc. may be adopted. In other cases, known methods, devices, implementations or operations are not shown or described in detail to avoid blurring various aspects of the present invention.
[0018] The block diagrams shown in the accompanying drawings are merely functional entities and do not necessarily correspond to physically independent entities. That is, these functional entities may be implemented in software form, or in one or more hardware modules or integrated circuits, or in different networks and / or processor devices and / or microcontroller devices.
[0019] The flowcharts shown in the accompanying drawings are only exemplary and do not necessarily include all the contents and operations / steps, nor must they be executed in the order described. For example, some operations / steps can be decomposed, and some operations / steps can be combined or partially combined, so the actual execution order may change according to actual conditions.
[0020] The present invention is described in detail below with reference to specific embodiments.
[0021] Example 1
[0022] As attached Figure 1As shown, an embodiment of the present invention provides a method for cross-platform anomaly detection and repair based on WebView, and the specific steps of the method are as follows: Step S1, when the App is started, initialize the WebView component, load the H5 page and inject multiple listeners: JS two-way heartbeat mechanism monitoring, JS function execution identification monitoring, gesture trigger two-way consistency monitoring; Step S2, performing abnormal detection on the operation of the H5 page through the listener, wherein the JS bidirectional heartbeat mechanism monitor is used to monitor the communication status between the WebView and the H5 page, the JS function execution identification listener is used to monitor the running status of the asynchronous function, and the gesture trigger bidirectional consistency monitor is used to monitor the consistency of the user interaction behavior; Step S3: When any of the listeners triggers an exception, the system immediately refreshes the H5 page and automatically skips the abnormal function or component, and uploads the abnormal data to the server, the abnormal data including the event type and the listener ID; Step S4, the server classifies and analyzes the abnormal data, identifies abnormal problems, generates dynamic repair patches for the abnormal problems, and injects them into the H5 page through the WebView to achieve rapid repair of the abnormal problems.
[0023] Preferably, the JS two-way heartbeat mechanism monitoring in step S1 includes sending and confirming the heartbeat from the WebView to the H5 page, sending and confirming the heartbeat from the H5 page to the WebView, detecting and triggering the two-way heartbeat anomaly, and handling and recovering the two-way heartbeat anomaly; Specifically, the JS two-way heartbeat mechanism monitors: Heartbeat sending and confirmation from the WebView to the H5 page: the WebView sends a first heartbeat instruction to the H5 page every a seconds, where a is preferably 5, the first heartbeat instruction is 1 byte long and the value is 0, and the H5 page needs to immediately return a first confirmation instruction after receiving the first heartbeat instruction, where the first confirmation instruction is 1 byte long and the value is 1; Heartbeat transmission and confirmation from the H5 page to the WebView: the H5 page sends a second heartbeat instruction to the WebView every a seconds, the second heartbeat instruction is 1 byte in length and the value is 0, and the WebView needs to immediately return a second confirmation instruction after receiving the second heartbeat instruction, the second confirmation instruction is 1 byte in length and the value is 1; The bidirectional heartbeat anomaly detection and triggering: if the first confirmation instruction is not received within the limited time threshold after the first heartbeat instruction is sent, or if the second confirmation instruction is not received within the limited time threshold after the second heartbeat instruction is sent, it is determined to be a communication anomaly, and the heartbeat fast anomaly processing is triggered; if the H5 page or the WebView does not receive the heartbeat signal of the other party for a seconds, it is determined to be a serious anomaly (such as component crash, page unresponsiveness, etc.), and the heartbeat anomaly recovery mechanism is triggered; the limited time threshold is preferably 300 milliseconds; The bidirectional heartbeat exception processing and recovery: When the heartbeat fast exception processing or the heartbeat exception recovery mechanism is triggered, the system will record the exception information, including the heartbeat sender, receiver status, and unconfirmed heartbeat instructions, trigger the page refresh mechanism, reinitialize the H5 page, ensure that the system returns to a normal state, and upload the exception log to the server for subsequent analysis and optimization.
[0024] Preferably, the JS function execution identifier monitoring in step S1 includes: if the asynchronous function does not trigger the end identifier after triggering the start identifier, it is determined to be a logical exception.
[0025] Preferably, the gesture triggering bidirectional consistency monitoring in step S1 includes: When the user triggers an interaction event, the H5 page and the WebView capture the interaction event at the same time. If the H5 page does not capture the interaction event but the WebView captures the interaction event, the H5 page is determined to be abnormal, as follows: When the asynchronous logic is running, the start and end markers of the JS function are monitored; If it is detected that the asynchronous function cannot trigger the end mark, the asynchronous function is determined to be an abnormal function, and the abnormal reasons include page freeze, no response, long business logic time consumption, and logic dead loop; Start the abnormal reporting mechanism, automatically refresh the H5 page and skip the abnormal function.
[0026] Based on the above solution, the gesture triggers bidirectional consistency monitoring, specifically: Initialize gesture listening: set the first gesture listener in the outermost layer of the WebView to capture all gesture events of the user on the screen, and set the second gesture listener in the interactive area on the page to capture the gesture events performed on the H5 page, which include single click, slide, and touch; When the user triggers the gesture event, the H5 page and the WebView capture the gesture event at the same time. If the H5 page does not capture the gesture event but the WebView captures the gesture event, or the gesture event captured by the WebView does not match the gesture event transmitted by the H5 page, it is determined that the H5 page gesture trigger is abnormal. When the gesture triggering exception is detected, the WebView will prompt the user that the H5 page is about to be refreshed, and automatically reload the H5 page to restore the normal interaction logic, and upload the exception data to the server. The exception data includes the exception type, gesture event status value, and the timestamp of the gesture triggering exception.
[0027] Preferably, the listener ID in step S3 includes: JS two-way heartbeat mechanism monitoring ID: 1; JS function execution identification monitoring ID: 2; Gesture triggers the ID of bidirectional consistency monitoring: 3; Preferably, skipping the abnormal function in step S3 is specifically: The H5 page initializes the abnormal method name set List, and defines the abnormal method name map<method name, bool> structure for storing the abnormal function, where the method name is the abnormal function name also recorded as key, and bool is the state value value, which is a Boolean type. When the value is true, it means that the JS function is judged to be abnormal, and when it is false, it means that the JS function is normal; The WebView defines a data structure for receiving a JS function name map<method name, status value>, which is used to manage the execution status of the abnormal method name map, where the status is 0 for start and 1 for reception; When the H5 page executes the JS function, it first determines whether the JS function exists in the abnormal method name map. If it exists, it returns directly. If it does not exist, it passes the method name and the status value to the receiving JS function name of the WebView and executes normally. The received JS function name calls map.put(method name, 0), indicating that the JS function of the H5 page starts to execute, and waits for the H5 page to send a JS function execution end instruction, and sets the waiting time threshold to b seconds. If the JS function starts to execute b seconds and has not received the JS function execution end instruction, then there is an exception in the JS function that causes an infinite loop or freeze, or a serious time-consuming phenomenon. The method name is recorded in the abnormal method name set List, and the method name is passed to the H5 page through the JS interface communication method, and reported to the server, and the map.remove(method name) in the WebView is executed to remove the method name described in the received JS function name; If the receiving JS function name receives the method name and the end status as parameters, it determines whether the status of the method name is the start status. If so, the map.remove (method name) code is called, indicating that the JS function is executed normally, otherwise it indicates an exception. The method name is passed to the H5 page through the JS interface communication method and reported to the server.
[0028] For example, as shown in the attached Figure 2 The following is a JS bidirectional heartbeat mechanism monitoring and JS function execution identification monitoring solution provided by this embodiment, which is as follows: When the App starts WebView, WebView will register the JS receiving function and the JS heartbeat receiving function; The JS heartbeat function sets a 5-second timeout. If the heartbeat confirmation of the H5 page is not received within 5 seconds, a page exception occurs. When WebView opens an H5 page, the page will start a timer and send a heartbeat mechanism to WebView every 5 seconds. If WebView does not receive a heartbeat confirmation within 5 seconds, it means that an abnormality has occurred on the H5 page, including page freeze, no response, long business logic time consumption, and logic dead loop. When WebView opens an H5 page to execute a JS function, it returns the start status before execution and the end status after execution to the JS receiving function of WebView. If only the start status notification of the JS function is received but the end status notification is not received, it indicates an exception. The exception includes page freeze, no response, long business logic time consumption, logical dead loop, etc. The system will reopen the H5 page and notify the H5 page to filter the JS function with exceptions, that is, the JS function with exceptions will not be executed; It should be noted that the reason why the JS function with exceptions is not executed is because WebView is in single-threaded mode. Once a JS function has an infinite loop, the heartbeat mechanism will be stuck.
[0029] For example, as shown in the attached Figure 3A gesture-triggered bidirectional consistency monitoring solution provided in this embodiment is shown as follows: The App will monitor the top-level gestures of WebView and also monitor gestures in the H5 page. Gesture monitoring includes click, slide, and touch events. When WebView listens to click, slide or touch events, it saves the state, listens to the JS receiving function to receive H5 events and sets a timeout of 2 seconds. At the same time, the H5 page also listens to gesture events. The gesture events monitored by the H5 page are passed to WebView. WebView determines whether the gesture events are consistent. If they are consistent, it is normal. If WebView does not receive the gesture events of the H5 page or the gesture event status is inconsistent, it indicates an exception. If an exception occurs, a Toast prompt will pop up to refresh the page and report the exception information to the server. It should be noted that the gesture event state values include: 1: click; 2: slide; 3: touch; For example, as shown in the attached Figure 4 The following is an abnormal function filtering solution provided by this embodiment, which is as follows: The H5 page initializes the abnormal method name, which is stored in the map<method name, bool> data structure. The key is the method name, and the value is the bool type status. The value is true: the method is abnormal, and false: the method is normal. WebView defines the receiving JS function name map<method name, status value>, where the status value is: 0 for the start flag, and 1 for the receiving flag; When the H5 page executes a function, it enters the function body and first determines whether the function name exists in the abnormal method name structure map. If it exists, it returns directly. If not, it executes normally. At the start of execution (start), the method name and status value are passed to the receiving JS function name of WebView. The receiving JS function name in WebView calls map.put(method name, 0) to indicate that the method of the H5 page starts to execute, waiting for the H5 page to send an end instruction, and setting the timeout for receiving the end method instruction to 12 seconds. If the method end instruction is not received within 12 seconds, it is judged that the reason for the method timeout may be an exception in the JS function, resulting in an infinite loop, freeze, and serious time-consuming phenomenon; Record the method name into the exception method name collection List, pass the exception method name to the H5 page through the JS interface communication method, and then report the exception to the server; Because it has been determined that the method has an exception, and the method exception has been passed to the H5 page, WebView is no longer used, and the map.remove(method name) code in WebView is executed synchronously to remove the abnormal method name in the JS function name map<method name, status value> defined in WebView; If the receiving JS function name in WebView receives the end instruction (end) and end status sent by the H5 page as parameters, the map in WebView first determines whether the status of the method name is the start status. If so, the map.remove(method name) code is called, indicating that the JS function in the H5 page is executed normally; otherwise, the exception method name is passed to the H5 page through the JS interface communication method, and then the exception is reported to the server.
[0030] Preferably, as attached Figure 4 As shown, the abnormal method name is stored through the browser database storage logic, including: WebView passes the exception method name to the H5 page through JS interface communication. When the H5 page receives the exception method name, it is added to the map<method name, status value> cache. When the status value is true, the exception method name is synchronized to the browser database. When the H5 page is initialized, it is synchronized from the browser database to the H5 page cache map variable. The database version number is used to determine whether the abnormal function has been repaired. If the database version newly deployed by H5 is larger than the version number in the browser database abnormal function data table, the browser database abnormal function data table is deleted; The browser database abnormal function data table includes: (1) Abnormal function version number data table: tablename: ErrorFuncVersionTable; columns: id (integer, auto-increment id); version (string type, only one version number data is stored); (2) Abnormal function data table: tablename: ErrorFuncTable; columns: id (integer, auto-increment id); func (string type, abnormal function name); It should be noted that if the exception method name is not stored in the browser database, the exception method name storage cache will be cleared after the page is refreshed.
[0031] Specifically, in this embodiment, the method start instruction and the end instruction can be automatically added through the proxy mode, as shown in the attached Figure 5 As shown, including the following: Add a proxy function through proxy mode. The function parameter is: method object; when calling the JS function, first get the method to be executed, pass the method as a parameter to the custom proxy function, and execute the proxy function. In the proxy function, the first step is to pass the method name and start start mark to WebView, indicating that the method is ready to execute; the second step is to formally call the method, that is, to formally execute the method; the third step is to pass the method name and end end mark to WebView; if an exception such as an infinite loop occurs when executing the method, it will be stuck in the second step and cannot execute the third step; It should be noted that communication instructions with WebView need to be added at the beginning and end of each method in the JS code. If the developer adds it manually, it will be inefficient. There is also a risk of forgetting to add it in a team assisted by multiple people, which will lead to the imperfection of the entire detection system. Therefore, this embodiment proposes to automatically add method start instructions and end instructions through the proxy mode.
[0032] In this embodiment, a method for cross-platform exception detection and repair based on WebView is provided. By initializing the WebView component, loading the H5 page and injecting multiple listeners, the operation of the H5 page is detected for exceptions. When any of the listeners triggers an exception, the system immediately refreshes the H5 page and automatically skips the abnormal function or component. At the same time, the abnormal data is uploaded to the server, and the abnormal data is classified and analyzed by the server, the abnormal problem is identified, and a dynamic repair patch is automatically generated and injected into the H5 page to achieve rapid repair of the abnormal problem. It can realize accurate detection and positioning of cross-platform exceptions, and intelligently filter and restore the exceptions, enhance user experience, and optimize the development process.
[0033] Example 2
[0034] As attached Figure 6 As shown, the embodiment of the present invention provides a system 600 for cross-platform anomaly detection and repair based on WebView, including the following parts: The listener injection module 601 is used to initialize the WebView component and load the H5 page when the App is started. During the H5 page loading process, multiple listeners are injected: JS bidirectional heartbeat mechanism monitoring, JS function execution identification monitoring, and gesture trigger bidirectional consistency monitoring; The monitoring module 602 is used to perform abnormal detection on the operation of the H5 page through the multiple listeners, wherein the JS bidirectional heartbeat mechanism monitor is used to monitor the communication status between the WebView and the H5 page, and the JS function execution identification listener is used to monitor the running status of the asynchronous function; the gesture trigger bidirectional consistency monitor is used to monitor the consistency of the user interaction behavior; The exception reporting module 603 is used to immediately refresh the H5 page and automatically skip the abnormal function or component after any of the listeners trigger an exception, and upload the abnormal data to the server, wherein the abnormal data includes the event type and the listener ID; The abnormality repair module 604 is used to classify and analyze the abnormal data through the server, identify abnormal problems, generate dynamic repair patches for the abnormal problems, and inject them into the H5 page through the WebView to achieve rapid repair of the abnormal problems.
[0035] Those skilled in the art will readily appreciate other embodiments of the present invention after considering the specification and practicing the invention disclosed herein. This application is intended to cover any modification, use or adaptation of the present invention, which follows the general principles of the present invention and includes common knowledge or customary techniques in the art that are not disclosed by the present invention. The specification and examples are intended to be exemplary only, and the true scope and spirit of the present invention are indicated by the claims. It should be understood that the present invention is not limited to the precise structure described above and shown in the accompanying drawings, and various modifications and changes can be made without departing from the scope thereof. The scope of the present invention is limited only by the appended claims.
Claims
1. A method for cross-platform anomaly detection and repair based on WebView, characterized in that: include: When the App starts, the WebView component is initialized, the H5 page is loaded and multiple listeners are injected, including: JS bidirectional heartbeat mechanism monitoring, JS function execution identification monitoring, gesture trigger bidirectional consistency monitoring; The operation of the H5 page is detected for abnormality through the listener, wherein the JS bidirectional heartbeat mechanism monitor is used to monitor the communication status between the WebView and the H5 page, the JS function execution identification listener is used to monitor the running status of the asynchronous function, and the gesture trigger bidirectional consistency monitor is used to monitor the consistency of the user interaction behavior; When any of the listeners triggers an exception, the system immediately refreshes the H5 page and automatically skips the abnormal function or component, and uploads the abnormal data to the server, including the event type and the listener ID; The server classifies and analyzes the abnormal data, identifies abnormal problems, generates dynamic repair patches for the abnormal problems, and injects them into the H5 page through the WebView to achieve rapid repair of the abnormal problems.
2. According to claim 1, a method for cross-platform anomaly detection and repair based on WebView is characterized in that: The JS two-way heartbeat mechanism monitoring includes the heartbeat sending and confirmation from the WebView to the H5 page, the heartbeat sending and confirmation from the H5 page to the WebView, two-way heartbeat anomaly detection and triggering, and two-way heartbeat anomaly processing and recovery.
3. According to the method of claim 1, a cross-platform anomaly detection and repair method based on WebView is characterized in that: The JS function execution identifier monitoring includes: if the asynchronous function does not trigger the end identifier after triggering the start identifier, it is determined to be a logical exception.
4. According to the method of claim 1, the method is characterized in that: The gesture triggers bidirectional consistency monitoring, including: When a user triggers an interaction event, the H5 page and the WebView capture the interaction event at the same time. If the H5 page does not capture the interaction event but the WebView captures the interaction event, the H5 page is determined to be abnormal.
5. According to a WebView-based cross-platform anomaly detection and repair method according to claim 2, it is characterized in that: The JS two-way heartbeat mechanism monitoring is specifically as follows: Heartbeat sending and confirmation from the WebView to the H5 page: the WebView sends a first heartbeat instruction to the H5 page every a seconds, the first heartbeat instruction is 1 byte in length and the value is 0, and the H5 page needs to immediately return a first confirmation instruction after receiving the first heartbeat instruction, the first confirmation instruction is 1 byte in length and the value is 1; Heartbeat sending and confirmation from the H5 page to the WebView: the H5 page sends a second heartbeat instruction to the WebView every a seconds, the second heartbeat instruction is 1 byte in length and the value is 0, and after receiving the second heartbeat instruction, the WebView must immediately return a second confirmation instruction, the second confirmation instruction is 1 byte in length and the value is 1.
6. A method for cross-platform anomaly detection and repair based on WebView according to claim 5, characterized in that: The JS two-way heartbeat mechanism monitoring also includes: The bidirectional heartbeat abnormality detection and triggering: if the first confirmation instruction is not received within the specified time threshold after the first heartbeat instruction is sent, or if the second confirmation instruction is not received within the specified time threshold after the second heartbeat instruction is sent, it is determined as a communication abnormality and the heartbeat fast abnormality processing is triggered; if the H5 page or the WebView does not receive the other party's heartbeat signal for a seconds in a row, it is determined as a serious abnormality and the heartbeat abnormality recovery mechanism is triggered.
7. The method for cross-platform anomaly detection and repair based on WebView according to claim 3, characterized in that: The JS function executes the identification monitoring, specifically: When the asynchronous logic is running, the start and end markers of the JS function are monitored; If it is detected that the asynchronous function cannot trigger the end mark, the asynchronous function is determined to be an abnormal function, and the abnormal reasons include page freeze, no response, long business logic time consumption, and logic dead loop; Start the abnormal reporting mechanism, automatically refresh the H5 page and skip the abnormal function.
8. The method for cross-platform anomaly detection and repair based on WebView according to claim 4, characterized in that: The gesture triggers bidirectional consistency monitoring, specifically including: Initialize gesture listening: set a first gesture listener in the outermost layer of the WebView to capture all gesture events of the user on the screen, and set a second gesture listener in the interactive area on the H5 page to capture the gesture events performed on the H5 page, which include single click, slide, and touch; When the user triggers the gesture event, the H5 page and the WebView capture the gesture event at the same time. If the H5 page does not capture the gesture event but the WebView captures the gesture event, or the gesture event captured by the WebView does not match the gesture event transmitted by the H5 page, it is determined that the H5 page gesture trigger is abnormal.
9. The method for cross-platform anomaly detection and repair based on WebView according to claim 7, characterized in that: The skipping of the abnormal function is specifically: The H5 page initializes the abnormal method name set List, and defines the abnormal method name map<method name, bool> structure for storing the abnormal function, where the method name is the abnormal function name, and bool is the state value value. When the value is true, it means that the JS function is judged to be abnormal, and when it is false, it means that the JS function is normal; The WebView defines a data structure for receiving a JS function name map<method name, status value>, which is used to manage the execution status of the abnormal method name map, where the status value is 0 for start and 1 for reception; When the H5 page executes the JS function, it first determines whether the JS function exists in the abnormal method name map. If it exists, it returns directly. If it does not exist, it passes the method name and the status value to the receiving JS function name of the WebView and executes normally. The received JS function name calls map.put(method name, 0), indicating that the JS function of the H5 page starts to execute, and waits for the H5 page to send a JS function execution end instruction, and sets the waiting time threshold to b seconds. If the JS function execution end instruction is not received after b seconds of the JS function starting to execute, there is an exception in the JS function.
10. A cross-platform anomaly detection and repair system based on WebView, characterized in that: The system comprises: The listener injection module is used to initialize the WebView component and load the H5 page when the App is started. During the H5 page loading process, multiple listeners are injected: JS bidirectional heartbeat mechanism monitoring, JS function execution identification monitoring, and gesture trigger bidirectional consistency monitoring; A monitoring module, used to detect abnormalities in the operation of the H5 page through the multiple listeners, wherein the JS bidirectional heartbeat mechanism monitor is used to monitor the communication status between the WebView and the H5 page, and the JS function execution identification listener is used to monitor the running status of the asynchronous function; the gesture-triggered bidirectional consistency monitor is used to monitor the consistency of user interaction behavior; The exception reporting module is used for causing the system to immediately refresh the H5 page and automatically skip the abnormal function or component after any of the listeners trigger an exception, and upload the abnormal data to the server, wherein the abnormal data includes the event type and the listener ID; The abnormality repair module is used to classify and analyze the abnormal data through the server, identify abnormal problems, generate dynamic repair patches for the abnormal problems, and inject them into the H5 page through the WebView to achieve rapid repair of the abnormal problems.
Citation Information
Patent Citations
Webpage monitoring method, device and system
CN112528186A
WebView off-line access fault tolerance method, system and device and storage medium
CN117540119A
Page exception processing method and device, equipment and storage medium
CN119088467A