A webpage synchronization implementation method

Abstract

The application relates to a webpage synchronization implementation method applied to the synchronization of a source webpage and a target webpage. The method comprises the following steps: creating first execution content in the source webpage, and creating second execution content in the target webpage, which are used for executing different processing at both ends of the synchronization according to the response HTML event in the synchronization process; creating third execution content in the source webpage and the target webpage, which are used for executing the same processing at both ends of the synchronization according to the response HTML event in the synchronization process. According to the HTML event occurring in the source webpage, when it is determined that the corresponding processing is the first execution content, the first execution content is executed in the source webpage, and the second execution content is executed in the target webpage; when it is determined that the corresponding processing is the third execution content, the third execution content is executed at both ends. In the synchronization process, the same or different execution content is executed at both ends of the synchronization by responding to the HTML event, the synchronization of the two webpages is flexibly realized, and the method is suitable for processing complex synchronization situations.

Description

Technical Field

[0001] This invention relates to the field of communications, and more particularly to a method for implementing webpage synchronization. Background Technology

[0002] In web page synchronization applications, when a user performs web page operations on one end (source web page), the resulting operation effect is synchronized to the other end (target web page, which can be the same web page as the source web page). The display screen and web page operations of both ends are kept synchronized in real time, which can achieve a very good communication effect.

[0003] However, web pages are programs, carrying complex and diverse content. Due to differences in content and function, the synchronization requirements vary significantly. Existing web page synchronization technologies, such as those synchronizing web page data or web page operations, suffer from problems such as insufficient protection of user data, large data transmission volumes, chaotic interaction with the server during synchronization, and poor flexibility in synchronization processing. These technologies are insufficient to meet complex web page synchronization scenarios. For example, when a user performs an operation on the source web page, synchronization for that operation is not simply a matter of synchronizing web page data or operations. It also requires consideration of data security, data storage, execution permissions, server-side interaction, and device-related issues. Specific processing must be performed on the target web page based on the specific operation performed.

[0004] The above-mentioned issues regarding webpage synchronization based on specific synchronization requirements urgently require the application of new technologies for resolution. Summary of the Invention

[0005] This application provides a method for webpage synchronization, which solves the problem of accurately synchronizing webpages or webpage programs according to specific synchronization requirements.

[0006] Firstly, this application provides a method for synchronizing web pages, applied to the synchronization of a source web page and a target web page, the method comprising:

[0007] A first execution content is created in the source webpage, and a corresponding second execution content is created in the target webpage. The first and second execution contents are used to perform different processing in the source webpage and the target webpage according to the responding HTML events during the synchronization process. A third execution content is created in both the source webpage and the target webpage. The third execution content is used to perform the same processing in both the source webpage and the target webpage during the synchronization process.

[0008] Based on the HTML events occurring in the source webpage, when it is determined that the processing corresponding to the HTML event is the first execution content, the first execution content is executed on the source webpage, and the corresponding second execution content is executed on the target webpage; when it is determined that the processing corresponding to the HTML event is the third execution content, the third execution content is executed on the source webpage, and the third execution content is executed on the target webpage.

[0009] In the technical solution provided in the first aspect above, the source webpage and the target webpage can be the same webpage or different webpages with a corresponding relationship. Furthermore, the source webpage and the target webpage refer to the synchronous initiation and reception of a single webpage operation; relatively speaking, the webpage initiating the synchronization request is considered the source webpage, and the webpage receiving the synchronization request is considered the target webpage. Based on the above, when an HTML event requiring synchronization is detected at one end, that webpage is considered the source webpage. In this application, the process of performing corresponding processing on the source webpage and performing corresponding synchronization processing on the target webpage based on the HTML event occurring on the source webpage is described as "a single synchronization".

[0010] In the technical solution provided in the first aspect above, the first execution content and the second execution content are two execution contents created respectively in the source webpage and the target webpage to achieve synchronization and to perform different processing in the source webpage and the target webpage, and there is a corresponding relationship between them. They can be defined when the webpage is created or generated at runtime. In addition, the execution of the third execution content is exactly the same in the source webpage and the target webpage, and its creation can also be the same. Based on the above, the first execution content, the second execution content, and the third execution content are divided based on the purpose of synchronization, and do not refer to a specific execution content. Their relationship is as follows: Figure 2 As shown, multiple first execution contents can exist in the source webpage, and multiple second execution contents can exist in the target webpage. For each second execution content in the target webpage, there is always a corresponding first execution content in the source webpage. Multiple identical third execution contents can exist in both the source and target webpages. According to the synchronization requirements, when different processing needs to be performed in the source and target webpages for a single synchronization, the first and second execution contents are executed accordingly. When the same processing needs to be performed in both the source and target webpages for a single synchronization, the corresponding processing content for the HTML event in the source webpage is executed separately in the target and source webpages. In this case, the target and source webpages contain the same code and processing procedures for the HTML event.

[0011] In one possible implementation of the first aspect, based on HTML events occurring in the source webpage, it further includes:

[0012] When it is determined that the processing corresponding to the HTML event is the first execution content, the first execution content is executed in the source webpage. At the same time, according to the second execution content corresponding to the first execution content, a synchronous execution instruction for calling the second execution content is generated and the synchronous execution instruction is sent to the target webpage.

[0013] When it is determined that the processing corresponding to the HTML event is a third execution content, the third execution content is executed in the source webpage, and a synchronous execution instruction for calling the third execution content is generated and sent to the target webpage;

[0014] The synchronous execution instruction is used to receive and execute the target webpage.

[0015] In this possible implementation, a corresponding synchronous execution instruction is generated based on the type of execution content corresponding to the HTML event occurring in the source webpage and sent to the target webpage for execution. In this implementation, the target webpage may not contain the code for the first execution content, which is beneficial for code protection.

[0016] One possible implementation of the first aspect also includes:

[0017] When the first executable content is created on the source webpage and the second executable content is created on the target webpage, the correspondence between the first executable content and the second executable content is recorded;

[0018] Based on the HTML events occurring in the source webpage, execute the first or third execution content corresponding to the HTML events in the source webpage, and simultaneously generate a synchronous execution instruction based on the call to the execution content, and send the synchronous execution instruction to the target webpage;

[0019] The synchronous execution instruction is received by the target webpage. When it is determined that the instruction it contains is a call to the first execution content, the second execution content is found and executed based on the correspondence.

[0020] In this possible implementation, after an HTML event occurs in the source webpage, the content and type of the event are not determined. Instead, a synchronous execution instruction is directly generated and sent. Upon receiving the instruction, the target webpage determines whether it is an instruction related to the first execution content. If it is, the second execution content corresponding to the first execution content is obtained according to the correspondence and executed. This possible implementation pre-records the correspondence between the first and second execution content, achieving a unified processing method for the first and second execution content within the source webpage.

[0021] In another possible implementation of the first aspect, creating the second execution content on the target webpage further includes the following methods:

[0022] The first execution content is executed in the source webpage, and the program code for the second execution content is generated simultaneously. The program code for the second execution content is then sent to the target webpage as synchronous execution code.

[0023] The synchronous execution code is received and executed by the target webpage.

[0024] In this possible implementation, the execution code of the second execution content is generated by executing the first execution content. The execution code is such as JavaScript code. This possible implementation is also beneficial for protecting the first execution content in the source webpage.

[0025] In one possible implementation of the first aspect, a data support environment is specified for the execution content, that is, the execution content is specified to be executed based on the data of the source webpage, or the execution content is specified to be executed based on the data of the target webpage;

[0026] The execution content includes a second execution content and a third execution content; the data support environment is used to provide data acquisition or storage for the execution of the execution content; the data of the source webpage is data that can be directly accessed or stored by the source webpage, and the data of the target webpage is data that can be directly accessed or stored by the target webpage.

[0027] In this possible implementation, a data support environment is specified for the execution content, enabling the synchronization program to run based on data from different sources, thus increasing the flexibility of the synchronization process.

[0028] In one possible implementation of the first aspect, sending the synchronous execution instruction or the synchronous execution code to the target webpage further includes obtaining data from the source webpage and sending it to the target webpage.

[0029] In this possible implementation, the relevant data of the source webpage is sent at the same time as the synchronous execution instruction, so that the data of the source webpage can be used to execute the second execution content on the target webpage.

[0030] A second aspect of this application provides a method for synchronizing web pages, applied to the synchronization of a source web page and a target web page, the method comprising:

[0031] The target webpage receives synchronous execution instructions from the source webpage and executes the included instructions; the target webpage receives synchronous execution code from the source webpage and executes the included program code.

[0032] In the technical solution provided in the second aspect above, the target webpage is a webpage that is being synchronized and receiving synchronization. For a single synchronization, the target webpage receives and executes a synchronization execution instruction or synchronization execution code from the source webpage. During the synchronization process, it is controlled by the source webpage to achieve the synchronization purpose.

[0033] In one possible implementation of the second aspect, after the target webpage receives the synchronous execution instruction, it further includes judging the content it contains. When it is determined that the instruction it contains is a call to the first execution content, it searches for and executes the corresponding second execution content based on the correspondence.

[0034] In this possible implementation, the correspondence refers to the correspondence between the first executed content and the second executed content. The target webpage determines whether the received synchronous execution instruction contains the first executed content. This determination can be achieved through the instruction's identification information, whether the instruction exists in the stored correspondence table, etc. This possible implementation unifies the handling of monitored HTML events in the source webpage and identifies and processes them in the target webpage, thus achieving different synchronous processing for the same HTML event.

[0035] In one possible implementation of the second aspect, when the execution content is executed on the target webpage, the data support environment pre-specified for the execution content is first obtained; if the specified data support environment is determined to be the source webpage, the execution content is executed based on the data in the source webpage; if the specified data environment is determined to be the target webpage, the execution content is executed based on the data in the target webpage.

[0036] The data support environment includes two types: the source webpage data environment and the target webpage data environment, which are used for the execution of the content based on the data provided by the data support environment.

[0037] This possible implementation describes the execution of content based on data from either end, which enhances the flexibility of the running program in using data during the synchronization process to suit complex synchronization requirements.

[0038] In one possible implementation of the second aspect, when the execution content is executed based on the data of the source webpage, in the target webpage, a method for obtaining source webpage data is invoked according to the data identifier information to obtain the value of the data item identified by the data identifier in the source webpage; wherein, the data identifier is a unique identifier for the source webpage data.

[0039] In this possible implementation, data identification information is established for the data contained in the source webpage, and a general function for retrieving source webpage data is created. The function is called with the data identification information as a parameter to quickly obtain the value corresponding to the data identification information. This possible implementation provides a method for quickly accessing source webpage data, reducing construction costs during content creation while increasing the flexibility and consistency of the program.

[0040] The first aspect of this application provides a webpage synchronization method, and the second aspect provides a corresponding processing method for the target webpage.

[0041] The solution provided in this application, for web pages requiring synchronization, adopts a method of directly converting them into corresponding instructions for rapid processing when they are completely consistent, thus satisfying the synchronization of ordinary static web pages. When they are inconsistent, a method of corresponding processing of first and second execution content is adopted, satisfying the synchronization of complex, dynamic web pages with special synchronization requirements. Furthermore, during the execution of the synchronization program, the scope of data referenced by the program is logically expanded. Therefore, the programs running at both ends of the synchronization are logically equivalent to a single overall program, running simultaneously at both ends, enhancing the flexibility of synchronization processing and making it more suitable for handling complex synchronization logic. Attached Figure Description

[0042] Figure 1 This application provides a schematic diagram of the architecture of a web page synchronization system.

[0043] Figure 2 A schematic diagram illustrating the correspondence between different types of executed content in the source webpage and the target webpage, provided for the purposes of this application;

[0044] Figure 3 An activity diagram illustrating a webpage synchronization implementation method provided in this application embodiment;

[0045] Figure 4 An activity diagram illustrating a webpage synchronization implementation method provided in this application embodiment;

[0046] Figure 5 An activity diagram illustrating a webpage synchronization implementation method provided in this application embodiment;

[0047] Figure 6 An activity diagram illustrating a webpage synchronization implementation method provided in this application embodiment;

[0048] Figure 7 A flowchart illustrating the designation and use of a data support environment provided in this application embodiment;

[0049] Figure 8This application provides a flowchart illustrating the sending and receiving of source webpage data in an embodiment.

[0050] Figure 9 A flowchart illustrating the processing of synchronous execution instructions within a target webpage, provided as an embodiment of this application;

[0051] Figure 10 A flowchart illustrating the process of processing synchronously executed code within a target webpage, provided as an embodiment of this application;

[0052] Figure 11 This application provides a timing diagram for obtaining source webpage data from a target webpage based on data identification information.

[0053] Figure 12 An example of a webpage in webpage synchronization provided in this application embodiment;

[0054] Figure 13 This is an example of a webpage in webpage synchronization provided in an embodiment of this application. Detailed Implementation

[0055] The implementation details in this application are for illustrative purposes only and are not intended to limit the scope of this application.

[0056] In existing scenarios for handling webpage synchronization, neither synchronizing webpage operations nor synchronizing webpage data is suitable for complex, dynamic webpages with special synchronization requirements. Issues arise such as webpage data security problems, chaotic interactions with the server, and poor flexibility in synchronization processing. Therefore, how to accurately solve the synchronization problem of complex webpages, achieve effective data protection during the synchronization process, ensure that redundant and erratic server interactions are not generated, flexibly control the synchronization process according to the webpage creator's wishes, and ensure that simple webpages do not increase development workload, are urgent technical problems to be solved in this field.

[0057] Based on this, the webpage synchronization implementation method provided in this application aims to solve the above-mentioned problems of the prior art and proposes the following solution: For a relatively complex webpage, the webpage creator is the only one who understands the webpage's functions and the webpage synchronization scenario. The method provided in this application allows the webpage creator to consider the application of webpage synchronization while creating the webpage, extending the ordinary webpage program from running in one browser to running jointly on the synchronizing end and the synchronized end. In actual operation, the webpage operated on by the synchronizing end is defined as the source webpage, and the webpage operated on by the synchronized end is defined as the target webpage. When webpage operations occurring in the source webpage execute the exact same content on both the source and target webpages, the operation instructions are passed between them. When the source and target webpages execute different content, this is achieved by running the first content on the source webpage and the second content on the target webpage simultaneously. This improves the flexibility of the synchronization process control and is applicable to both simple and complex webpage synchronization scenarios.

[0058] The technical solutions of the present invention and how they solve the above-mentioned technical problems are described in detail below with specific embodiments. These specific embodiments can be combined with each other, and the same or similar concepts or processes may not be repeated in some embodiments. The embodiments of the present invention will be described below with reference to the accompanying drawings. Obviously, the described embodiments are only a part of the embodiments of this application, and not all of them. Those skilled in the art will understand that with the development of technology and the emergence of new scenarios, the technical solutions provided by the embodiments of this application are also applicable to similar technical problems.

[0059] First, for ease of understanding, this application provides a schematic diagram of the architecture of a web page synchronization system implemented using the method of this application. Please refer to... Figure 1 The synchronization system includes: a source webpage 100, a target webpage 200, and a synchronization server 300. The source webpage 100 and target webpage 200 are defined according to the direction of synchronization, with the source webpage 100 initiating the synchronization. The synchronization server 300 provides synchronization communication services between the source webpage 100 and the target webpage 200. The diagram illustrates the architecture for synchronizing a single HTML event. Additionally, the ellipses in the diagram indicate the possible existence of multiple similar units or data.

[0060] exist Figure 1 The source webpage 100 shown includes: HTML event 11, first execution content 12, third execution content 13, synchronous data generation module 14, webpage data 15, and communication module 16.

[0061] Each synchronization action between the source webpage and the target webpage begins with a change at one end, which corresponds to an HTML event (HTML DOM Event) occurring at that end triggering the synchronization requirement. The HTML events referred to in this application include events of HTML elements and global events. These HTML events have the ability to trigger actions in the browser. In layman's terms, HTML events can be anything that happens on a webpage.

[0062] Synchronization between the source and target web pages can be initiated in ways including but not limited to the following: detecting HTML event 11 through webpage listeners, indicating a change in the source webpage, and initiating synchronization accordingly; or defining and triggering synchronization within HTML event 11 or its execution content. Of these two methods, the former is initiated based on webpage listeners, while the latter is an active initiation.

[0063] Regardless of the method used to initiate webpage synchronization, the goal is to achieve the same or corresponding execution effect on both the source and target webpages for a single HTML event. Therefore, the currently occurring HTML event and the desired execution effect on both webpages are the two key focuses of this synchronization. Analysis shows that, based on HTML event 11 in the source webpage, its corresponding execution content can be divided into two cases according to the synchronization requirements:

[0064] The first method involves executing the exact same content on both the source and target web pages. That is, if a certain process is performed on the source web page, the same process must also be performed on the target web page to achieve synchronization. For example, if an input tag is clicked on the source web page to give it input focus, the same process should be performed on the target web page to give the corresponding input tag input focus.

[0065] The second scenario involves executing certain content on the source webpage, which requires executing corresponding content on the target webpage (including cases where the corresponding content is empty). In this case, the content executed on the source webpage and the target webpage are different.

[0066] Based on the two scenarios in the synchronization requirements above, the execution content in the first scenario is defined as the third execution content 13 on the source webpage and the third execution content 25 on the target webpage, which are either identical or the same. In the second scenario above, the execution program in the source webpage is defined as the first execution content 12, and the corresponding execution program in the target webpage is defined as the second execution content 24.

[0067] In the above source webpage 100, after the HTML event 11 occurs, the first execution content 12 or the third execution content 13 is executed. Based on the execution content in the source webpage 100, the synchronization data generation module 14 generates corresponding synchronization data. According to the synchronization requirements, the synchronization data also includes the webpage data in the webpage data 15. Finally, the communication module 16 sends the data to the synchronization server 300.

[0068] exist Figure 1 The synchronization server 300 shown includes at least a communication module 31, which communicates with the communication module 16 in the source webpage and the communication module 21 in the target webpage to realize data transmission between the source webpage and the target webpage.

[0069] exist Figure 1 The target webpage 200 shown includes: a communication module 21, a synchronous data parsing module 22, a synchronous operation execution module 23, second execution content 24, third execution content 25, and webpage data 26.

[0070] The communication module 21 communicates with the communication module 31 in the synchronization server 300, receiving synchronization data from the synchronization server 300. The synchronization data parsing module 22 parses the included synchronization data, which includes, but is not limited to, instruction data, program data, and webpage data. The instruction data includes instructions such as method names, HTML event names, and webpage operation names. The program data includes Javascript program scripts. The webpage data is data from the source webpage provided to support the execution of this instruction or program, such as data in webpage HTML elements and controls, webpage program variable data, local storage data, local database data, cached data, cookie data, and data stored in the browser where the webpage is located. Additionally, depending on the synchronization operation execution requirements, the synchronization data may also include the location information of the webpage HTML elements, used to locate the HTML elements so that the above instructions or programs can be executed based on those HTML elements. The instructions, programs, and data obtained by the synchronous parsing data module 22 are called and executed by the synchronous operation execution module 23, including executing the second execution content 24 or the third execution content 25. According to the needs of synchronous execution, the web page data of the target web page, i.e., the web page data 26, is called during the execution process.

[0071] It should be noted that in this application, "first", "second" and "third" are only used to distinguish the roles played by the executable program in the webpage synchronization process. In a synchronization process, for different processing in the source webpage and the target webpage, the first executable content is used in the source webpage and the second executable content is used in the target webpage.

[0072] It should also be noted that, in this application, "execution content" refers to the executable parts of a webpage or parts that can cause changes in the webpage's state, including but not limited to webpage programs, webpage events, webpage methods, Javascript-defined functions, HTML-supported behaviors, and browser-supported behaviors. Therefore, the execution content can be simply understood as actions performed on the source or target webpage. Thus, the steps for initiating synchronization by listening to HTML events can be figuratively described as follows: something happens on the source webpage, triggering relevant HTML events on the source webpage; then, based on the listened-to HTML events, this synchronization is initiated, informing the target webpage that it also needs to perform some actions.

[0073] It should be noted that the source webpage and target webpage mentioned in this application can be the same webpage or different webpages with a corresponding relationship. During webpage synchronization, the definitions of source webpage and target webpage are relative. For example, if an HTML event occurs on one webpage and needs to be synchronized, then for this synchronization, that end is the source webpage, and the other end receiving the synchronization data is the target webpage.

[0074] Additionally, refer to Figure 2 In the source webpage 100, there can be multiple instances of the first execution content 12 and the third execution content 13. Generally, one HTML event executes one instance of the first execution content 12 or the third execution content 13, but there are cases where multiple instances of the first execution content 12 or the third execution content 13 are executed, such as when one HTML event calls multiple methods. Additionally, there can also be multiple instances of webpage data 15. Correspondingly, in the target webpage 200, there can also be multiple instances of the second execution content 24, the third execution content 25, and the webpage data 26. Generally, for each instance of the first execution content 12, there is a corresponding instance of the second execution content 24 in the target webpage. However, there are also cases where the corresponding instance of the second execution content 24 is empty, meaning that the first execution content is executed in the source webpage but no processing is performed in the target webpage.

[0075] The following will combine Figure 1 The architecture of the webpage synchronization system shown herein provides a detailed explanation of a webpage synchronization method provided in this application. Please refer to... Figure 3 The webpage synchronization method may include the following steps:

[0076] S301, Listen for HTML event 11 in the source webpage;

[0077] S302, determine the type of content to be executed corresponding to HTML event 11;

[0078] S303, when it is determined that its content is the first execution content 12, execute the first execution content 12;

[0079] S304, when it is determined that its content is the third execution content 13, execute the third execution content 13;

[0080] S305, the synchronization data generation module 14 generates synchronization execution information in the target webpage 200 based on the execution information of the above steps S303 and S304;

[0081] S306, Communication module 16 sends the synchronization execution information generated in step S305 to communication module 31 in the synchronization server;

[0082] S307, in the synchronization server, the communication module 31 receives the synchronization execution information sent by the communication module 16 and sends it to the communication module 21;

[0083] S308, In the target webpage, the communication module 21 receives synchronization execution information;

[0084] S309, In ​​the target webpage, the synchronous data parsing module 22 calculates the execution content on the target webpage based on the received synchronous execution information;

[0085] S310, based on the calculation result of step S309, the synchronous operation execution module 23 calls and executes the second execution content 24;

[0086] S311, based on the calculation result of step S309, the synchronous operation execution module 23 calls and executes the third execution content 25.

[0087] As described above, in this embodiment of the application, step S301 obtains HTML event 11 through a webpage event listener, such as using a JavaScriptHTML DOM event listener, establishing a listener using the addEventListener() method, and triggering and executing synchronization when the HTML event 11 occurs. In a preferred implementation, the listener is established directly on the document because when a webpage is loaded, the browser creates the page's Document Object Model (DOM), where document is the root node of the DOM, and all elements in the webpage are child nodes of document. Therefore, according to the bubbling mechanism of webpage events, this method can achieve listening to all elements in the webpage.

[0088] In step S302 above, the type of execution content corresponding to the HTML event 11 is determined, including but not limited to the following methods: registering its type information when creating or generating the execution content, reading the type information and determining it in step S302; adding identification information to the method name, attribute name, etc. of the execution content, the identification information being used to identify the type of the execution content, and obtaining its type by reading the identification information of the execution content and determining it in step S302.

[0089] The synchronous execution information generated in step S305 above is used in step S309 to calculate the execution content on the target webpage. The synchronous execution information includes, but is not limited to, the identification information of DOM objects or HTML elements, first execution content information, second execution content information, third execution content information, webpage data 15, execution parameter configuration information, etc., which are described in detail as follows: The identification information of DOM objects or HTML elements is used to locate which element or object to execute on in the target webpage; the execution content information, such as HTML event attribute names, program method names, function names, attribute names, program scripts, etc., is used to obtain detailed execution content in the target webpage; when the execution content needs to use the data of the source webpage for execution, the webpage data 15 provides the corresponding source webpage data; the execution configuration parameters are used to configure the relevant information of the execution content when it is executed on the target webpage, such as specifying that the execution content is executed based on the data of the source webpage or the target webpage. In this embodiment, step S305 generates synchronous execution information and provides execution content to the target webpage in the following two ways: generating the execution content of the source webpage into the synchronous execution information, and the target webpage calculates the execution content to be executed on the target webpage based on the execution content in the source webpage, or directly calculating the content to be executed on the target webpage.

[0090] Furthermore, in this embodiment, the execution order of S303 and S305, and S304 and S305, is generally not particularly limited. In specific implementation, they can be executed simultaneously or in a preset order. For example, based on the content to be executed in S303, S305 is executed first to generate synchronous execution information, and then step S303 is executed on the source webpage. Alternatively, S303 is executed first on the source webpage, and then step S305 is executed to generate synchronous execution information. However, there are also situations where the execution order of S303 and S305 needs to be limited. For example, if the generated synchronous execution information requires the use of a certain piece of webpage data from the source webpage 100 during execution in S310, and the required data is webpage data before the execution of S303, considering that the execution of S303 may cause changes to that piece of webpage data on the source webpage, in this case, S305 is limited to be executed before S303. The same applies to S304 and S305, and will not be elaborated further.

[0091] In a specific implementation scenario, preferably, steps S306, S307, and S308 employ the WebSocket communication protocol for communication. Preferably, the data format in step S305 is encapsulated in JSON format, and correspondingly, in step S309, the aforementioned element identifiers, object identifiers, execution content information, webpage data, and configuration information are obtained by parsing the JSON data.

[0092] According to the above implementation methods, the execution of the third execution content is completely identical in the target webpage and the source webpage. It requires no special processing from the creator; only that the related webpage programs and HTML code remain consistent, and that the data used during operation remains consistent, to achieve the same synchronous execution effect. This saves the creator development investment in processing identical parts. The above implementation methods clearly define the construction logic and relationship between the first and second execution content, facilitating creators to accurately construct the synchronization process according to their webpage synchronization needs using the method provided in this embodiment.

[0093] In the specific S305 process of generating synchronous execution information, there are multiple implementation methods, and corresponding processing exists in S309, which will be described in detail below.

[0094] Specifically, on the one hand, please refer to Figure 4 The main implementation steps are as follows:

[0095] S401, Listen for HTML event 11 in the source webpage;

[0096] S402, determine the type of content to be executed corresponding to HTML event 11;

[0097] S403, when S402 determines that the execution content is the first execution content 12, execute the first execution content 12;

[0098] S404, based on the correspondence between the first execution content 12 and the second execution content 24, the second execution content 24 is retrieved from the first execution content 12;

[0099] S405, Generate a synchronous execution instruction for calling the second execution content 24;

[0100] S406, when S402 determines that the execution content is the third execution content 13, execute the third execution content 13;

[0101] S407, Generate a synchronous execution instruction for calling the third execution content 25 (which is the same as the third execution content 13);

[0102] S408, Synchronous data generation module 14 generates synchronous execution instructions based on S405 and S407, and generates synchronous data;

[0103] S409, Communication module 16 sends synchronization data to communication module 31 in the synchronization server;

[0104] S410, in the synchronization server, the communication module 31 receives the synchronization data sent by the communication module 16 and sends it to the communication module 21;

[0105] S411, In the target webpage, the communication module 21 receives the synchronization execution information;

[0106] S412, In the target webpage, the synchronous data parsing module 22 parses the synchronous execution instructions contained in the received synchronous data, namely the instructions related to the second execution content and the third execution content;

[0107] S413, execute the instructions obtained from the above analysis.

[0108] In one of the above embodiments, the correspondence between the first execution content 12 and the second execution content 24 needs to be pre-recorded in the source webpage (it is not necessary to record it in the target webpage), and S404 searches for and obtains the second execution content 24 in the target webpage according to the correspondence.

[0109] The synchronous execution instructions in S405 and S407 mentioned above include command information to be executed on the target webpage. This information is a brief summary of the execution content, such as HTML event attribute names, program method names, function names, and attribute names. The target webpage obtains the detailed execution content directly or through parsing based on this brief information. For example, if button A is clicked on the source webpage, executing the button's onclick event, and this onclick event simultaneously calls the function fun1, requiring the same synchronous operation to be performed on the target webpage, then the synchronous execution instructions generated by the third execution content can be: Method 1, perform a click operation on button A; Method 2, execute the onclick method contained in button A; Method 3, execute the function fun1. None of the above methods transmit detailed execution content; the target webpage obtains the final execution content by searching for the information in the instructions.

[0110] The synchronization data generated in step S408 may also include identification information of DOM objects or HTML elements, web page data 15, execution parameter configuration information, etc. Among them, web page data 15 is used as the web page data of the source web page when executing the second execution content and the third execution content for the target web page.

[0111] Furthermore, the execution order of S403, S404, and S405, and the execution order of S406 and S407 are generally not particularly limited, but there are some limitations under special circumstances. This is the same as the situation of S303 and S305 in the previous embodiment, and will not be repeated here.

[0112] The above implementation method adopts the approach of directly generating synchronous execution instructions for the target webpage after listening for HTML events in the source webpage. This method has a small data transmission volume and high speed. At the same time, the target webpage only contains the necessary execution program content, which is beneficial to protecting the first execution content in the source webpage.

[0113] On the other hand, please refer to Figure 5 The main implementation steps are as follows:

[0114] S501, Listen for HTML event 11 in the source webpage;

[0115] S502, execute the execution content corresponding to the HTML event 11;

[0116] S503, Generate a synchronous execution instruction based on the execution content of the HTML event 11;

[0117] S504 generates synchronization data based on the synchronization execution instructions in S503;

[0118] S505, Communication module 16 sends synchronization data to communication module 31 in the synchronization server;

[0119] S506, in the synchronization server, the synchronization data sent by the communication module 16 is received and sent to the communication module 21;

[0120] S507, In the target webpage, the communication module 21 receives synchronization data;

[0121] S508, In the target webpage, the synchronous data parsing module 22 parses the synchronous execution instructions contained in the received synchronous data, namely the instructions related to the first execution content and the third execution content;

[0122] S509, Obtain the execution content contained in the instruction, and search and determine it in the correspondence;

[0123] S510, when S509 determines that the execution content is the first execution content 12, the corresponding second execution content 24 is obtained according to the correspondence.

[0124] S511, On the target webpage, execute the second execution content 24;

[0125] S512, on the target webpage, execute the third execution content 25.

[0126] In this embodiment, S503 does not judge the execution content corresponding to the HTML event, and adopts a unified processing form for the execution content. In the target webpage, the correspondence between the first execution content 12 and the second execution content 24 needs to be recorded in advance. After receiving the synchronous execution instruction, S509 searches for and executes the corresponding second execution content according to the type of its execution content. When it is confirmed to be the first execution content, it searches for and executes the corresponding second execution content according to the correspondence.

[0127] The synchronization data generated in step S504 may also include identification information of DOM objects or HTML elements, web page data 15, execution parameter configuration information, etc.

[0128] The synchronous execution instructions in this aspect are the same as those in the previous aspect, and will not be repeated here.

[0129] In addition, the execution order of S502 and S503 is generally not particularly restricted, but there are some special cases with restrictions, which are the same as those of S403, S404 and S405 in the previous section, and will not be repeated here.

[0130] The main feature of the above implementation method is that it registers the correspondence between the first and second execution contents in the synchronization system, and unifies the method for generating synchronization execution instructions for the first and third execution contents in the source webpage. Since no special processing of the first execution content is required in the source webpage, this implementation method is more suitable for situations where a source webpage synchronizes multiple different target webpages. For example, program A is executed in the source webpage, and when synchronizing to the first target webpage, program B is executed on that target webpage; when synchronizing to another target webpage, program C is executed on that target webpage. Furthermore, this implementation method, which uses the transmission of synchronization execution instructions, also has the advantage of small data transmission volume.

[0131] In another embodiment of the above two aspects, the method further includes recording the correspondence between the first execution content and the second execution content in the synchronization server 300. The synchronization server 300 receives the first execution content from the source webpage 100, finds the corresponding second execution content according to the correspondence, and sends it to the target webpage 200. This embodiment is beneficial because the source webpage 100 adopts a unified generation method when generating synchronous execution instructions based on the execution content corresponding to HTML event 11, that is, it does not distinguish between the first execution content 12 and the third execution content 13; at the same time, the target webpage 200 processes the synchronous execution instructions in a unified manner, that is, it does not distinguish between the second execution content 24 (or the first execution content 12) and the third execution content 25. In addition, this embodiment does not contain any information about the first execution content or the correspondence information between the first and second execution content in the target webpage, which is beneficial for protecting the relevant content of the first execution content.

[0132] On the other hand, please refer to Figure 6 The main implementation steps are as follows:

[0133] S601, Listen for HTML event 11 in the source webpage;

[0134] S602, determine the type of content to be executed corresponding to HTML event 11;

[0135] S603, when S602 determines that the execution content is the first execution content 12, execute the first execution content 12;

[0136] S604, during the execution of the first execution content 12, the execution code of the second execution content 24 is generated, and the execution code is used as the synchronous execution code;

[0137] S605, when S602 determines that the execution content is the third execution content 13, execute the third execution content 13;

[0138] S606, Generate a synchronous execution instruction for calling the third execution content 25 (which is the same as the third execution content 13);

[0139] S607, Synchronous data generation module 14 generates synchronous data based on the synchronous execution code generated in S604 and / or the synchronous execution instruction generated in S606;

[0140] S608, the communication module 16 sends the synchronization data generated in S607 to the communication module 31 in the synchronization server;

[0141] S609, in the synchronization server, the communication module 31 receives the synchronization data sent by the communication module 16 and sends it to the communication module 21;

[0142] S610, in the target webpage, the communication module 21 receives synchronization data;

[0143] S611, In the target webpage, the synchronous data parsing module 22 parses the synchronous execution instructions and synchronous execution code contained in the received synchronous data;

[0144] S612, In the target webpage, determine whether the content contained is synchronous execution code or synchronous execution instruction;

[0145] S613, when the judgment result of S612 is synchronous execution code, the synchronous execution code is executed;

[0146] S614, when the judgment result of S612 is a synchronous execution instruction, the synchronous instruction is executed.

[0147] In the above implementation method, during the synchronization process, S603 executes the first execution content, and S604 generates program code to be executed on the target webpage. It does not require separate recording of the correspondence between the first and second execution content, providing great flexibility in web application development. Furthermore, step S604 is not limited to the steps described above; it itself has the ability to trigger execution synchronization. By generating code for the second execution content after the first execution content is executed and invoking data communication functions, the synchronized execution code is sent to the target webpage for execution. Therefore, it also provides a method for flexibly defining synchronization during the creation process.

[0148] The synchronization data generated in step S607 may also include identification information of DOM objects or HTML elements, web page data 15, execution parameter configuration information, etc.

[0149] The synchronous execution instructions in this aspect are the same as those in the two aspects mentioned above, and will not be repeated here.

[0150] In addition, the execution order of S605 and S606 is generally not particularly restricted, but there are some special cases with restrictions, which are the same as those for S502 and S503 in the previous section, and will not be repeated here.

[0151] In S613, the synchronous execution code is like Javascript code, and the execution is like calling the eval() function.

[0152] The above implementation method generates synchronized data by combining synchronized execution instructions and synchronized execution code. For the same execution content (third execution content) in the source webpage and the target webpage, the synchronized execution instructions are used. For different execution content in the source webpage and the target webpage, the first execution content is created and the second execution content execution code is generated simultaneously. This method is flexible, highly targeted at handling synchronization issues, and is a WYSIWYG implementation method.

[0153] In one possible implementation, the execution content is executed on the target webpage, and it can be specified that the execution content must be executed based on the webpage data of the source webpage. The execution content includes second execution content and third execution content. For details, please refer to... Figure 7 It includes the following steps:

[0154] S701, in the source webpage 100, specify that the second execution content 24 is executed based on the data of the source webpage, or specify that the second execution content 24 is executed based on the data of the target webpage;

[0155] S702, in the target webpage 200, obtain the data support environment pre-specified for the execution content 24;

[0156] S703, determine the supporting environment for the specified data;

[0157] S704, when S703 determines that it is data from the source webpage, execute the execution content 24 based on the source webpage data 15;

[0158] S705, when S703 determines that it is data of the target webpage, the execution content 24 is executed based on the target webpage data 26;

[0159] The processing of the second execution content 24 in the above steps also applies to the third execution content 25, and will not be repeated here.

[0160] In the above embodiments, the specification of the data support environment includes, but is not limited to, specifying it when defining the execution content, specifying it when sending synchronous execution instructions, and specifying it when sending synchronous execution code.

[0161] In the above embodiments, optionally, in the source webpage 100, the second execution content 24 or the third execution content 25 is specified to be executed based on a portion of the data of the source webpage and another portion of the data of the target webpage. Alternatively, in the source webpage 100, a portion of the execution content of the second execution content 24 or the third execution content 25 is specified to be executed based on the data of the source webpage, while another portion of the execution content is executed based on the data of the target webpage.

[0162] In conjunction with the above embodiments, optionally, the execution content is executed on the target webpage, and the newly generated webpage data is specified to be saved on the target webpage, or the newly generated webpage data is specified to be saved on the source webpage.

[0163] According to the above implementation method, a data support environment is specified for the execution content in the target webpage, so that the second and third execution content in the target webpage can be executed based on the webpage data of the source webpage or the target webpage, which logically expands the scope of data acquisition. This increases the flexibility of program and data processing during synchronization. For example, the target webpage can be specified to use the username and password provided by the source webpage to perform the login operation, or the target webpage can be specified to use its own username and password to perform the login operation.

[0164] In one possible implementation, based on synchronization requirements, webpage data 15 is obtained from the source webpage, and the synchronization data generation module 14 generates synchronization data from the webpage data before sending it. For details, please refer to... Figure 8 This may include the following steps:

[0165] S801, in the source webpage 100, according to the execution requirements of the synchronous execution instruction or synchronous execution code on the target webpage, obtain the webpage data 15 in the source webpage;

[0166] S802, in the source webpage 100, the synchronization data generation module 14 generates synchronization data together with the webpage data 15 in S801;

[0167] S803, in the target webpage 200, read the webpage data 15 of the source webpage;

[0168] S804, In the target webpage 200, a synchronous execution instruction is executed based on the source webpage data 15;

[0169] S805, in the target webpage 200, execute synchronous execution code based on the source webpage data 15.

[0170] In the above S801 process of acquiring webpage data 15, since the execution of the first execution content 12 and the third execution content 13 in the source webpage 100 can cause changes to the webpage data 15, it is necessary to select the time point for acquiring the webpage data 15 according to the synchronization requirements. For example, the webpage data can be acquired before the execution of the execution content in the source webpage, or after the execution of the execution content in the source webpage.

[0171] In conjunction with the above embodiments, optionally, a method for saving new data generated when executing the content on the target webpage is specified, that is, saving the newly generated webpage data on the target webpage, or saving the newly generated webpage data on the source webpage. Saving the newly generated webpage data on the source webpage involves adding the new data, save instructions, etc., to the synchronization data, sending the synchronization data to the source webpage, and having the source webpage perform the save operation.

[0172] The above implementation provides synchronous execution instructions or synchronous execution code to the target webpage 200, and also provides webpage data 15 from the source webpage as required by the synchronization needs, so that the target webpage can execute relevant execution content based on the data. For example, after logging in on the source webpage, the webpage data contained in the source webpage after logging in is provided to the target webpage and displayed on the target webpage, achieving the same synchronization effect as the source webpage.

[0173] In another embodiment of this application, the target webpage receives and executes a synchronization instruction from the source webpage, specifically through the following steps:

[0174] S901, the target webpage 200 receives a synchronous execution instruction from the source webpage 100;

[0175] S902, in the target webpage 200, execute the instructions contained in the synchronous execution instruction.

[0176] The synchronous execution instruction includes brief information that needs to be executed on the target webpage, such as HTML event attributes, program method names, function names, attribute names, etc., which are obtained directly or through parsing by the target webpage. Furthermore, this embodiment requires that the target webpage contain detailed program, HTML code, browser runtime environment, etc., corresponding to the synchronous execution instruction. Preferably, a unified function is created for the generation, parsing, and invocation of the synchronous execution instruction, enabling fast or default processing of the synchronous execution instruction. Thus, the creator only needs to focus on the definition of the synchronous execution instruction, without needing to concern themselves with its actual generation, parsing, and execution process, which helps save development workload and improve the efficiency of creating synchronous instructions.

[0177] In another embodiment of this application, the target webpage receives and executes synchronization code from the source webpage, specifically through the following steps:

[0178] S1001, the target webpage 200 receives synchronous execution code from the source webpage 100;

[0179] S1002, in the target webpage 200, the program code contained in the synchronous execution code is executed.

[0180] In this embodiment, the target webpage 200 receives the synchronous execution code, such as JavaScript code, and executes the synchronous execution code, such as by using the eval() function, in step S1002.

[0181] In another embodiment of this application, when the execution content is executed on the target webpage 200, a pre-specified data support environment is obtained. When the specified data support environment is determined to be the source webpage 100, the execution content is executed based on the webpage data 15 of the source webpage 100. When the specified data support environment is determined to be the target webpage 200, the execution content is executed based on the webpage data 26 of the target webpage 200.

[0182] This possible implementation enhances the flexibility of program data reference during synchronization, allowing the execution to be based on data from either end, thus adapting to complex synchronization requirements.

[0183] Furthermore, this application also provides a method for retrieving source webpage data based on data identification information. Please refer to [link to relevant documentation]. Figure 11 :

[0184] S1101, when the target webpage 200 needs to obtain webpage data from the source webpage 100, it uses the data identification information as a parameter to call the function to obtain the source webpage data. The function sends the source webpage data request and the data identification information to the synchronization server 300.

[0185] S1102, after receiving the source webpage data request sent by the target webpage 200, the synchronization server 300 sends the data request and the data identification information to the source webpage 100;

[0186] S1103, the source webpage 100 receives the data request and the identification information, finds the corresponding webpage data item in the source webpage 100 according to the data identification information, and obtains the data in the data item;

[0187] S1104, Source webpage 100 returns the acquired data to synchronization server 300;

[0188] S1105, After receiving the data sent by the source webpage, the synchronization server 300 returns the data to the target webpage 200;

[0189] S1106, the target webpage 200 receives data returned by the synchronization server 300, which is the data obtained from the source webpage according to the data identification information, and performs relevant execution content based on the obtained data.

[0190] The method for obtaining source webpage data provided in this embodiment enables the target webpage to quickly obtain data from the source webpage's HTML elements and controls, webpage program variable data, local storage data, local database data, cached data, cookie data, and data stored in the browser where the source webpage is located.

[0191] Preferably, S1101, S1102, S1104, and S1105 use the WebSocket communication protocol for communication. For example, a webpage data identifier is sent to the source webpage via WebSocket communication. The source webpage obtains the value of the webpage data identifier in the source webpage based on the webpage data identifier, and returns the value to the target webpage via WebSocket. The webpage data identifier has the same name or a one-to-one mapping relationship between the source webpage and the target webpage, and is used to identify webpage elements, webpage program variables, and webpage runtime environment variables.

[0192] In practice, optionally, a prefix can be added to the variables to identify whether the execution content is executed using web page data from source web page 100 or target web page 200. Before the execution program is executed, the data is uniformly acquired and processed according to the prefix to reduce the number of network requests. In addition, this implementation method makes the synchronization program a program that can run on both ends simultaneously, logically integrating the running environments of the two ends of the synchronization into a single running environment, which is more conducive to handling complex synchronization situations.

[0193] This embodiment provides a method for quickly accessing source webpage data, which unifies the data acquisition method, effectively reduces the difficulty and cost of building a synchronization program, and enhances the program's processing capabilities by increasing the flexibility of data retrieval.

[0194] The following examples illustrate and explain specific application scenarios of this system. Please refer to them. Figure 12 The source webpage 100 and the target webpage 200 mainly contain the following HTML elements: current cumulative quantity span (name: Span1), increase quantity input (type attribute: number, name: Input1), submit button (type attribute: button, name: Button1), and reset input (type attribute: reset, name: Input2). The detailed requirements for the synchronization scenario are as follows: On the source webpage, a number is entered into Input1, and Button1 is clicked to submit to the server; on the server side, the cumulative quantity stored on the server is added to the submitted increase quantity to obtain a new cumulative quantity, which is then returned to the client; the source webpage receives the new cumulative quantity and displays it in Span1; clicking Input2 on the source webpage resets the input in Input1 to empty; the operation process and results on the source webpage are synchronized to the target webpage.

[0195] Analyzing the above synchronization requirements, if the existing method of synchronizing webpage operation commands is used, with a current cumulative count of 1000, when Button1 is clicked on the source webpage, if the number in Input1 is 100, the server returns 1100. Simultaneously, the target webpage performs a synchronization operation, repeatedly executing the submit action on Button1, resulting in the server returning 1200, causing confusion in the synchronization process. According to the implementation principle of this application, the execution content corresponding to the Input1 input and Input2 click events in the source webpage 100 is used as the third execution content, and is executed similarly on the target webpage. The execution content corresponding to the Button1 submit event in the source webpage is used as the first execution content. The submission result is returned to the source webpage and displayed in Span1. The first execution content in the source webpage corresponds to the second execution content in the target webpage. The second execution content is: Button1 performs a click effect (e.g., flashes once to simulate a click effect, but does not execute the server submit action), and Span1 displays the webpage data corresponding to Span1 sent from the source webpage. (Reference) Figure 5 In the corresponding embodiment, the implementation steps for this scenario are as follows:

[0196] Step 1: In the source webpage 100, enter the number 100 in Input1. The input process triggers the onchange event of Input1.

[0197] Step 2: Execute the execution content "input" corresponding to the event, where the type of the execution content is third execution content;

[0198] Step 3: Generate a synchronous execution instruction based on the "input" and collect the data input in Input1 (i.e., web page data), and generate synchronous data by combining the element identifier "Input1", the synchronous execution instruction, and the web page data;

[0199] Step 4: Send the synchronized data to the target webpage 200 via the synchronization server;

[0200] Step 5: Within the target webpage 200, receive and parse the synchronization data, obtain the execution content therein and determine it as the third execution content, and obtain the element identifier and webpage data therein;

[0201] Step 6: Within the target webpage 200, execute the third execution content, that is, execute the "input" instruction based on the webpage data, and display the same input content in Input1;

[0202] The above steps synchronize the input process of the source webpage and the target webpage.

[0203] Step 7: Within the source webpage 100, click the Input2 button to trigger the onreset event of the form containing the button;

[0204] Step 8: Execute the execution content corresponding to the event, "Reset form content", i.e., Form.reset(), and the type of the execution content is the third execution content;

[0205] Step 9: Generate a synchronous execution instruction based on the "Reset form content" instruction, and generate synchronous data by identifying the element "Input2" and the synchronous execution instruction.

[0206] Step 10: Send the synchronized data to the target webpage 200 via the synchronization server;

[0207] Step 11: Within the target webpage 200, receive and parse the synchronization data, obtain the execution content therein, and determine it as the third execution content;

[0208] Step 12: Within the target webpage 200, execute the third execution content, that is, reset the form content of the target webpage;

[0209] The above steps synchronize the process of resetting form content on the source webpage and the target webpage.

[0210] Step 13: Within the source webpage 100, click the Button1 button to trigger its onclick event;

[0211] Step 14: Execute the "click" content corresponding to the event. The type of the execution content is the first execution content. Send a request to the server, which performs cumulative calculation and returns a new cumulative value. The source webpage writes the new cumulative value into Span1, completing the execution of the first execution content.

[0212] Step 15: Generate a synchronous execution instruction based on the "click" and collect data from Span1 (i.e., web page data). Generate synchronous data by combining the element identifiers "Span1" and "Button1", the synchronous execution instruction, and the web page data.

[0213] Step 16: Send the synchronization execution information to the target webpage 200 via the synchronization server;

[0214] Step 17: Within the target webpage 200, receive and parse the synchronous execution information, obtain the execution content therein and determine it as the first execution content, and obtain the webpage data therein;

[0215] Step 18: Within the target webpage 200, find and obtain the second execution content according to the correspondence between the first execution content and the second execution content. The second execution content is: the click effect of Button1 is played (simulating the click effect, without actually performing the click), and the provided data is displayed in Span1;

[0216] Step 17: Within the target webpage 200, execute the second execution content, namely, play the click effect of Button1, and display it in Span1 according to the webpage data provided in the synchronization data;

[0217] The above steps enable the submission of information from the source webpage to the server. The operation process and execution results are synchronized to the target webpage. However, the target webpage does not actually perform the server submission. Therefore, there will be no problem of chaotic interaction with the server during the synchronization process.

[0218] The following is an explanation based on another example scenario, which involves synchronizing web login. Please refer to [link / reference]. Figure 13 The source webpage 100 and the target webpage 200 mainly contain the following HTML elements: username input (type attribute: text, name: Input1), password input (type attribute: password, name: Input2), and login button (type attribute: button, name: Button1). Depending on the synchronization requirements, they can be implemented in the following two ways:

[0219] To implement Solution 1, the user enters a username and password on the source webpage and clicks the button to log in. The target webpage is required to use the same username and password to log in, so as to keep the login results the same.

[0220] To implement Solution 2, users enter their username and password on the source webpage and click the button to log in. This webpage restricts the same user from logging in multiple times at the same time and requires the protection of the username and password on the source webpage during the synchronization process.

[0221] For implementation scheme 1, refer to Figure 5 The corresponding implementation steps are as follows:

[0222] Step 1: Listen for HTML events corresponding to the Input1 input operation in the source webpage, such as onfocus and onchange events;

[0223] Step 2: Based on the HTML event, determine the type of execution content it corresponds to. For example, the execution content corresponding to onfocus is "gain focus" and the execution content corresponding to onchange is "input". According to the synchronization requirements, both are third execution content.

[0224] Step 3: While the source webpage Input1 gains focus and receives input, a synchronous execution instruction is generated to gain focus on the target webpage Input1 and input content. The synchronous execution instruction, the identification information of Input1, and the input content string are then generated into the synchronous data.

[0225] Step 4: Send the synchronized data to the target webpage 200 via the synchronization server;

[0226] Step 5: The target webpage receives and parses the synchronized data to obtain information such as: control identifier Input1, synchronized execution instructions such as focus acquisition instructions or input instructions, and data content used to execute the input, etc.

[0227] Step 6: The target webpage locates the Input1 element based on the control identification information, executes a focus command on the element, or executes an input command on the element and writes the data content for input.

[0228] The above steps achieve the effect of making Input1 focus and perform input on the source webpage, and achieving complete synchronization on the target webpage. Furthermore, the related operations and synchronization of Input2 are basically the same as those of Input1, and will not be repeated here. The following is a brief introduction to the operation and synchronization steps of Button1:

[0229] Step 7: Within the source webpage 100, click Button1 to trigger its onclick event;

[0230] Step 8: Based on the onclick event, determine that the corresponding execution content is "click", and the type of the execution content is the third execution content;

[0231] Step 9: Execute the content corresponding to the onclick in the source webpage. At the same time, generate a synchronous execution instruction for executing onclick on Button1 in the target webpage, and generate configuration data for executing onclick on the target webpage using the webpage data of the source webpage. Generate the synchronous execution instruction, the identification information of Button1, and the configuration data into the synchronous data.

[0232] Step 10: Send the synchronized data to the target webpage 200 via the synchronization server;

[0233] Step 11: The target webpage receives and parses the synchronized data to obtain information such as: control identifier Button1, synchronized execution instruction i.e. onclick, configuration information, etc. The configuration information requires that this execution be based on the data of the source webpage, i.e., restricting the target webpage from using the username and password entered by itself to perform login;

[0234] Step 12: Locate the Button1 element based on the control identification information and execute onclick on this element. However, since the configuration information specifies that this execution is based on the data from the source webpage, the username and password information from Input1 and Input2 are retrieved in the onclick function. (Refer to...) Figure 11 The method for obtaining data from the source webpage automatically retrieves it from the source webpage and uses the current username and password from the source webpage to perform login on the target webpage. In actual implementation, the execution order of onclick in the source and target webpages needs to be considered (to prevent the target webpage from being unable to obtain the corresponding webpage data after the login process on the source webpage has been completed).

[0235] The above steps enable simultaneous login on the target webpage and the source webpage, and the login is completed using the username and password from the source webpage, which meets the synchronization requirements proposed in Solution 1.

[0236] Regarding the second login implementation scheme above, the following analysis will be performed first:

[0237] According to the requirements of this implementation scheme, firstly, it is necessary to protect the username, password, and other information entered on the source webpage; secondly, the system does not allow the same user to log in multiple times simultaneously. Therefore, Input1 and Input2 gain input focus and can be processed according to the method in implementation scheme 1. However, the input of Input1 and Input2, compared to the submission of Button1, requires completely different processing methods on the source and target webpages. That is, the first execution content is executed on the source webpage 100, and the second execution content is executed on the target webpage 200, to achieve the same synchronous display effect based on the above synchronization requirements. (See also...) Figure 5 The method provided in the corresponding embodiment mainly involves the following steps:

[0238] Step 1: Listen for the HTML events corresponding to the Input1 input operation in the source webpage, such as the onchange event;

[0239] Step 2: Based on the HTML event, determine that its corresponding execution content type is the first execution content;

[0240] Step 3: While inputting into the source webpage Input1, retrieve the second execution content based on the corresponding relationship. The second execution content is "execute input using replacement character". Generate a synchronous execution instruction for using replacement character input in the target webpage Input1, which, along with the identification information of Input1 and the number of characters input, is generated into the synchronization data. "Execute input using replacement character" means replacing the input content with a certain character, such as replacing "word" with "####".

[0241] Step 4: Send the synchronized data to the target webpage 200 via the synchronization server;

[0242] Step 5: The target webpage receives and parses the synchronization data to obtain information such as: control identifier Input1, "use replacement character to perform input" synchronization execution instruction, number of characters to be input, etc.

[0243] Step 6: On the target webpage, locate the Input1 element based on the control identification information, and execute the "Use replacement characters to perform input" instruction on the element according to the number of characters to be entered.

[0244] The above steps, entered into Input1 on the source webpage, have a synchronized input effect on the target webpage, but the input content differs, thus protecting the input information on the source webpage. Furthermore, the operations and synchronization of Input2 are basically the same as Input1, and will not be repeated here. The following is a brief introduction to the operations and synchronization steps of Button1:

[0245] Step 7: Within the source webpage 100, click Button1 to trigger its onclick event;

[0246] Step 8: Based on the onclick event, determine that the corresponding execution content is "click", and the type of the execution content is the first execution content;

[0247] Step 9: Execute the execution content corresponding to the onclick in the source webpage, that is, execute login in the source webpage. At the same time, find and obtain the second execution content according to the corresponding relationship. The second execution content is "replace the current webpage content with the given webpage data". Generate a synchronous execution instruction for executing "replace the current webpage content with the given webpage data" in the target webpage, and generate the synchronous execution instruction and the relevant webpage data after login in the source webpage into the synchronous data.

[0248] Step 10: Send the synchronized data to the target webpage 200 via the synchronization server;

[0249] Step 11: The target webpage receives and parses the synchronization data to obtain information such as the synchronization execution instruction of "replacing the current webpage content with the given webpage data", and relevant webpage data after logging into the source webpage.

[0250] Step 12: Based on the relevant webpage data after logging in to the source webpage, execute the instruction "replace the current webpage content with the given webpage data" on the target webpage. This execution replaces the webpage data of the target webpage with the webpage data after logging in to the source webpage.

[0251] The above steps achieve the effect of logging in on the source webpage and displaying the login synchronously on the target webpage, but the target webpage does not send a login request to the server, which meets the synchronization requirements of this implementation scheme.

[0252] The above description is merely a specific implementation of the embodiments of this application, but the protection scope of the embodiments of this application is not limited thereto. Any variations or substitutions that can be easily conceived by those skilled in the art within the technical scope disclosed in the embodiments of this application should be included within the protection scope of the embodiments of this application. Therefore, the protection scope of the embodiments of this application should be determined by the protection scope of the claims.

Claims

1. A method for synchronizing web pages, applied to the synchronization between a source web page containing a login form and a target web page, wherein the login form includes a username input control (input1), a password input control (input2), and a login button (button1), characterized in that, The method includes: Listen for the HTML event corresponding to the Input1 or Input2 input operation on the source webpage. Based on the HTML event, determine the type of the corresponding execution content as the first execution content. While Input1 or Input2 is input on the source webpage, find and obtain the second execution content according to the corresponding relationship. The second execution content is to perform input using replacement characters. Generate a synchronous execution instruction for performing input using replacement characters on the target webpage Input or Input2. Generate the synchronous execution instruction together with the identification information of Input1 or Input2 and the number of characters input into the synchronous data. The execution content of performing input using replacement characters is used to replace the input content with specified characters. The synchronized data is sent to the target webpage via the synchronization server; The target webpage receives and parses the synchronization data to obtain the control identifier of Input1 or Input2, the synchronous execution instruction for input using replacement characters, and the number of characters entered. In the target webpage, the Input1 or Input2 element is located according to the control identifier information, and the synchronous execution instruction for input using replacement characters is executed on the Input1 or Input2 element according to the number of characters entered. Based on the click event of Button1 triggered on the source webpage, the corresponding execution content is click. The type of the execution content is determined to be the first execution content. The execution content corresponding to the click event is executed on the source webpage to perform login on the source webpage. At the same time, the corresponding second execution content is obtained according to the correspondence. The second execution content is to replace the current webpage content with given webpage data. A synchronous execution instruction for replacing the current webpage content with given webpage data is generated on the target webpage. The synchronous execution instruction and the relevant webpage data after login on the source webpage are generated into the synchronous data. The synchronized data is sent to the target webpage via the synchronization server; The target webpage receives and parses the synchronization data to obtain the synchronous execution instruction to replace the current webpage content with the given webpage data and the relevant webpage data after logging into the source webpage; based on the relevant webpage data after logging into the source webpage, the instruction to replace the current webpage content with the given webpage data is executed on the target webpage, and the webpage data of the target webpage is replaced with the webpage data after logging into the source webpage; The first execution content and the second execution content are used to perform different processing on the source webpage and the target webpage according to the responding HTML events during the synchronization process.

2. The method according to claim 1, characterized in that, Also includes: A first execution content is created in the source webpage, and a corresponding second execution content is created in the target webpage. The first execution content and the second execution content are used to perform different processing in the source webpage and the target webpage according to the responding HTML events during the synchronization process.

3. The method according to claim 2, characterized in that, It also includes the following steps: When the first executable content is created on the source webpage and the second executable content is created on the target webpage, the correspondence between the first executable content and the second executable content is recorded; Based on the HTML events that occur in the source webpage, execute the first execution content corresponding to the HTML events in the source webpage, and simultaneously generate a synchronous execution instruction based on the call to the execution content, and send the synchronous execution instruction to the target webpage; The synchronous execution instruction is received by the target webpage. When it is determined that the instruction it contains is a call to the first execution content, the second execution content is found and executed based on the correspondence.

4. The method according to claim 1, characterized in that, Creating the second executable content on the target webpage also includes the following methods: The first execution content is executed in the source webpage, and the program code for the second execution content is generated simultaneously. The program code for the second execution content is then sent to the target webpage as synchronous execution code. The synchronous execution code is received and executed by the target webpage.

5. The method according to any one of claims 1 to 4, characterized in that, Also includes: Specify a data support environment for the execution content, that is, specify that the execution content is executed based on the data of the source webpage, or specify that the execution content is executed based on the data of the target webpage; The execution content includes a second execution content; the data support environment is used to provide data acquisition or storage for the execution of the execution content; the data of the source webpage is data that can be directly accessed or stored by the source webpage, and the data of the target webpage is data that can be directly accessed or stored by the target webpage.

6. The method according to claim 5, characterized in that, Sending the synchronous execution instruction or the synchronous execution code to the target webpage also includes obtaining data from the source webpage and sending it to the target webpage.

7. The method according to claim 1, characterized in that, The target webpage also includes: The target webpage receives synchronous execution instructions from the source webpage and executes the instructions contained therein; the target webpage receives synchronous execution code from the source webpage and executes the program code contained therein.

8. The method according to claim 7, characterized in that, After the target webpage receives the synchronous execution instruction, it further includes, when it determines that the instruction it contains is a call to the first execution content, searching for and executing the corresponding second execution content based on the correspondence.

9. The method according to claim 7, characterized in that, When the target webpage executes the content, it also includes: Obtain a pre-specified data support environment for the execution content; if the specified data support environment is a source webpage, execute the execution content based on the data in the source webpage; if the specified data environment is a target webpage, execute the execution content based on the data in the target webpage. The data support environment includes two types: the source webpage data environment and the target webpage data environment, which are used for the execution of the content based on the data provided by the data support environment.

10. The method according to claim 9, characterized in that, When the execution content is executed based on the data of the source webpage, it also includes: In the target webpage, a method for obtaining source webpage data is invoked based on the data identifier information to obtain the value of the data item identified by the data identifier in the source webpage; wherein, the data identifier is a unique identifier for the source webpage data.

Images