Data processing method and device, electronic equipment and storage medium
By leveraging the mapping relationship between browser web pages and subprocesses in the BS architecture, component information can be quickly embedded, solving the problems of poor user operation smoothness and experience, and achieving efficient data processing and multi-process control.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- ZHEJIANG DAHUA TECH CO LTD
- Filing Date
- 2023-02-28
- Publication Date
- 2026-07-24
AI Technical Summary
In existing technologies, when applications are deployed on a B/S architecture, the user experience is poor, and there is a lack of efficient data processing methods.
By mapping browser web pages to subprocesses, component information can be embedded into browser web pages using the target subprocess, reducing additional settings and interactions, improving embedding efficiency, and enabling multi-process control.
It improves component embedding efficiency, ensures normal browser webpage usage, saves processing resources, and enhances user experience.
Smart Images
Figure CN116361582B_ABST
Abstract
Description
Technical Field
[0001] This application relates to the field of computer technology, and in particular to a data processing method, apparatus, electronic device, and storage medium. Background Technology
[0002] The BS (Browser / Server) architecture is a browser-to-server structure and represents the current development trend of application systems. However, most applications are currently deployed on the CS (Client / Server) architecture. Therefore, how to efficiently deploy applications on the BS architecture has become a pressing technical problem to be solved for the widespread adoption of BS frameworks.
[0003] In related technologies, a launch request sent by a browser can be received, and the launch page information of the target application requested by the launch request can be returned to the browser. Then, a response request sent by the browser based on the launch page information can be received, and the response page information of the target application requested by the response request can be returned to the browser, so that the browser can display the response page corresponding to the response page information. However, since the migrated application runs on a server, this will create a cross-machine network connection, resulting in poor user operation smoothness and experience.
[0004] Therefore, a highly efficient data processing method is urgently needed in related technologies. Summary of the Invention
[0005] Therefore, it is necessary to provide a data processing method, apparatus, electronic device, and storage medium that can improve the efficiency of component embedding in order to address the above-mentioned technical problems.
[0006] Firstly, this application provides a data processing method. The method includes:
[0007] Get information about components called by the browser webpage;
[0008] Based on the mapping relationship between browser web pages and subprocesses, the target subprocess corresponding to the browser web page is determined; the mapping relationship is pre-established through the main process.
[0009] The target component corresponding to the component information is embedded into the browser webpage using the target subprocess.
[0010] The data processing method provided in this application can quickly and accurately determine the target subprocess for executing the business logic of the browser webpage based on the mapping relationship between browser webpages and subprocesses. The target subprocess can then embed the target components called by the browser webpage into the browser webpage. This process eliminates the need for additional settings for the access method of the target components and the interaction method between the browser and the client, thereby saving processing resources and improving embedding efficiency. Furthermore, the client's main process can pre-set the mapping relationship between multiple browser webpages and multiple subprocesses. This not only allows for quick determination of the subprocess corresponding to the browser webpage, improving processing efficiency, but also enables multi-process control. The crash of one subprocess will not affect the operation of other subprocesses, thus ensuring the normal use of other browser webpages.
[0011] Optionally, in one embodiment of this application, obtaining the component information invoked by the browser webpage includes:
[0012] Receive the registration information from the browser webpage;
[0013] Based on the registration information, a first communication connection is established between the browser webpage and the main process;
[0014] The component information invoked by the browser webpage is obtained based on the first communication connection.
[0015] Optionally, in one embodiment of this application, the mapping relationship between the browser webpage and the subprocess is constructed in the following manner:
[0016] In response to the registration information of the browser webpage, a first communication connection is established between the browser webpage and the main process;
[0017] Based on the registration information, a subprocess corresponding to the browser webpage is created using the main process;
[0018] Establish a second communication connection between the child process and the main process;
[0019] Based on the first communication connection and the second communication connection, the mapping relationship between the browser webpage and the subprocess is determined.
[0020] Optionally, in one embodiment of this application, before embedding the target component corresponding to the component information into the browser webpage using the target subprocess, the following steps are included:
[0021] The main process obtains the component information through the first communication connection and sends the component information to the target subprocess through the second communication connection.
[0022] Optionally, in one embodiment of this application, the step of embedding the target component corresponding to the component information into the browser webpage using the target subprocess includes:
[0023] Determine the target component corresponding to the component information;
[0024] The target subprocess accesses the target component through a preset interface;
[0025] The target component is embedded into the browser webpage.
[0026] Optionally, in one embodiment of this application, embedding the accessed target component into the browser webpage includes:
[0027] Create the embedded container corresponding to the target component;
[0028] The embedding container is embedded into the browser webpage.
[0029] Optionally, in one embodiment of this application, before embedding the embedding container into the browser webpage, the following steps are included:
[0030] Obtain the association between the target element of the browser webpage and the embedded container;
[0031] Obtain the position and size information of the target element;
[0032] Based on the association relationship and the position information of the target element, determine the position information of the embedded container; and / or, based on the association relationship and the size information of the target element, determine the size information of the embedded container.
[0033] Optionally, in one embodiment of this application, embedding the embedding container into the browser webpage includes:
[0034] The size and position information of the browser webpage are obtained through the system interface;
[0035] Based on the size information and the location information, the embedding container is embedded into the browser webpage.
[0036] Optionally, in one embodiment of this application, the method further includes:
[0037] If the target subprocess is found to have disconnected from the communication connection, the main process deletes the mapping relationship between the browser webpage and the target subprocess and returns an exception alert.
[0038] Secondly, embodiments of this application also provide a data processing method, which is applied to a browser and includes:
[0039] Send the component information to be invoked to the client;
[0040] The target component corresponding to the component information is displayed on the browser webpage; the target component is a target subprocess embedded in the browser webpage, and the target subprocess is determined by the mapping relationship between the browser webpage and the subprocess, which is pre-established by the main process of the client.
[0041] Thirdly, embodiments of this application also provide a data processing apparatus. The apparatus includes:
[0042] The component information acquisition module is used to obtain component information called by the browser webpage;
[0043] The target subprocess determination module is used to determine the target subprocess corresponding to the browser webpage based on the mapping relationship between the browser webpage and the subprocess; the mapping relationship is pre-established by the main process;
[0044] An embedding module is used to embed the target component corresponding to the component information into the browser webpage using the target subprocess.
[0045] Fourthly, embodiments of this application also provide an electronic device, including a memory and a processor, wherein the memory stores a computer program, and the processor executes the computer program to implement the steps of the methods described in the above embodiments.
[0046] Fifthly, embodiments of this application also provide a computer-readable storage medium having a computer program stored thereon, wherein the computer program, when executed by a processor, implements the steps of the methods described in the above embodiments.
[0047] Sixthly, embodiments of this application also provide a computer program product, including a computer program that, when executed by a processor, implements the steps of the methods described in the various embodiments above. Attached Figure Description
[0048] Figure 1 A schematic flowchart illustrating a data processing method provided in one embodiment of this application;
[0049] Figure 2 A schematic diagram of an embedded container and a browser webpage provided in one embodiment of this application;
[0050] Figure 3 This is a schematic diagram illustrating the workflow between the various entities in a data processing method provided in one embodiment of this application.
[0051] Figure 4 This is a schematic diagram illustrating the workflow between the various entities in a data processing method provided in another embodiment of this application.
[0052] Figure 5 This is a schematic diagram of the module structure of a data processing apparatus provided in one embodiment of the present application;
[0053] Figure 6 This is a schematic diagram of the module structure of the electronic device provided in the embodiments of this application;
[0054] Figure 7 This is a conceptual partial view of the computer program product provided in the embodiments of this application. Detailed Implementation
[0055] To make the objectives, technical solutions, and advantages of this application clearer, the following detailed description is provided in conjunction with the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are merely illustrative and not intended to limit the scope of this application.
[0056] Various exemplary embodiments, features, and aspects of this application will now be described in detail with reference to the accompanying drawings. The same reference numerals in the drawings denote elements that have the same or similar functions. Although various aspects of the embodiments are shown in the drawings, they are not necessarily drawn to scale unless specifically indicated otherwise.
[0057] The term "exemplary" as used herein means "serving as an example, embodiment, or illustration." Any embodiment illustrated herein as "exemplary" is not necessarily to be construed as superior to or better than other embodiments. The terms "first," "second," etc., used in the specification, claims, and accompanying drawings are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such terms are interchangeable where appropriate, and this is merely a way of distinguishing objects with the same properties in the embodiments of this application.
[0058] It should be understood that in this application, "at least one (item)" means one or more, and "more than" means two or more. "And / or" is used to describe the relationship between related objects, indicating that three relationships can exist. For example, "A and / or B" can represent three cases: only A exists, only B exists, and both A and B exist simultaneously, where A and B can be singular or plural. The character " / " generally indicates that the preceding and following related objects are in an "or" relationship. "At least one (item) of the following" or similar expressions refer to any combination of these items, including any combination of single or plural items. For example, at least one (item) of a, b, or c can represent: a, b, c, "a and b", "a and c", "b and c", or "a and b and c", where a, b, and c can be single or multiple.
[0059] Furthermore, to better illustrate this application, numerous specific details are provided in the following detailed embodiments. Those skilled in the art should understand that this application can be implemented even without certain specific details. In some instances, methods and means well-known to those skilled in the art have not been described in detail, in order to highlight the main points of this application.
[0060] The data processing method described in this application will be described in detail below with reference to the accompanying drawings. Although this application provides method operation steps as shown in the following embodiments or drawings, more or fewer operation steps may be included in the method based on conventional or non-inventive effort. For steps that do not have a logically necessary causal relationship, the execution order of these steps is not limited to the execution order provided in the embodiments of this application. During data processing or when the device executes the method, it may be executed in the order shown in the embodiments or drawings, or in parallel (e.g., in a parallel processor or multi-threaded processing environment).
[0061] Specifically, one embodiment of the data processing method provided in this application is as follows: Figure 1 As shown, the method may include:
[0062] S101: Obtain information about components invoked by the browser webpage.
[0063] The data processing method provided in this application embodiment can be applied to a client. To meet the diverse application needs of users, various applications (Apps) can be installed on the client. These applications can include system applications, desktop applications, driver applications, network applications, IoT applications, etc. More specifically, the application can be a standalone application or a functional module embedded in the application. The functional module can be a mini-program of the application or a quick app, etc. The client can include a terminal device capable of receiving and processing input events. Specifically, the client can be a mobile smartphone, a computer (including laptops and desktop computers), a tablet computer, a personal digital assistant (PDA), or a smart wearable device, etc. The smart wearable device can be a smartwatch, a smart bracelet, etc. The browser webpage can be displayed through any electronic device with a display device, such as the corresponding window or interface displayed on the client, for users to browse, operate, and obtain corresponding webpage services.
[0064] In this embodiment, during use, the browser webpage can, in addition to traditional webpage display, call or embed client-provided components such as "weather," "screenshot," "download," and "translation" components to achieve diverse functions. For example, when using the browser webpage, the user may need to use the client-provided "video playback" component to play multiple videos. These components can be independently running systems or functional modules built by the enterprise. In simpler terms, a component is a collection of closely related tasks required to achieve a specific goal. The browser webpage can send the required component information to the client through the communication connection between the browser and the client. The component information may include component identification information, interface information, etc. The identification information may be the component name, or a unique identifier or number corresponding to the component name. The interface information may include the access method, interface type, etc. The interface type can be determined according to the component type. For example, if the component is a Qt plugin, the interface type may be a Qt application interface; if the component is a Dynamic Link Library (DLL) component, the interface type may be a DLL interface. Of course, in other embodiments of this application, the component information may also include component embedding position, component size, display / hidden state, etc. The display / hidden state can be used to determine whether the window corresponding to the component is displayed or hidden. In this application embodiment, the component information can be obtained through the communication connection between the browser and the client. The communication connection can be established during browser startup or use. For example, when the browser starts, a communication connection between the browser and the client can be established based on the browser's startup operation. In one embodiment of this application, the startup operation may include, for example, a double-click operation on the browser icon, or a click on the browser icon's open control, or an operation of entering a command line command to open the browser; of course, it may also include starting the browser by clicking the client's connection. Those skilled in the art will understand that any operation used to open the browser can be considered as the browser startup operation described in this application embodiment, and other implementation methods of the browser startup operation will not be elaborated here. Of course, in other embodiments of this application, a communication connection between the browser webpage and the client can also be established when the browser webpage registers. Specifically, in one embodiment of this application, obtaining the component information called by the browser webpage includes:
[0065] S201: Receive the registration information from the browser webpage;
[0066] S203: Based on the registration information, establish a first communication connection between the browser webpage and the main process;
[0067] S205: Obtain component information called by the browser webpage based on the first communication connection.
[0068] In this embodiment, the registration information may include the browser webpage's type information, version information, and identification information. The identification information may be the browser's version number or other information used to identify the version. In one embodiment, the navigator.userAgent method can be used to obtain the browser webpage's registration information; for example, the obtained registration information may be Firefox 11+, Opera 12.10+, etc. In other embodiments, the registration information may also include a connection request sent by the browser based on a cross-domain communication protocol. After receiving the connection request, the client can establish a first communication connection between the browser webpage and the main process based on the cross-domain communication protocol, for example, establishing a first communication channel between the browser webpage and the main process. The cross-domain communication protocol may include WebSocket, JSONP, CORS, etc. In one embodiment, the WebSocket protocol is a full-duplex communication network technology. In the WebSocket protocol, the communicating parties only need to perform a handshake action to quickly establish a communication channel between them, allowing direct data transmission. Current mainstream browsers (such as Chrome, Firefox 11, Safari, 360 Security Browser, UC Browser, Cheetah Browser, Maxthon Browser, etc.) all support the WebSocket protocol. In one embodiment of this application, after receiving the connection request, the client can select a corresponding target port from multiple preset ports for binding, thereby establishing a communication connection between the browser and the client. In one embodiment of this application, the main process can be the client's main process, specifically used to launch and run multiple browser web pages, such as executing the business logic of the target browser. In one embodiment of this application, after establishing the first communication connection, component information called by the browser web page can be obtained based on the first communication connection.
[0069] S103: Based on the mapping relationship between browser web pages and subprocesses, determine the target subprocess corresponding to the browser web page; the mapping relationship is pre-established by the main process.
[0070] In this embodiment, the subprocess can be used to execute the browser's business logic, i.e., to run the browser webpage. The subprocess can be a program with independent functions running on a data set; that is, the subprocess can be an independent unit for resource allocation and scheduling by the operating system. In one embodiment, the main process can create corresponding subprocesses during the browser webpage registration, startup, or running process. That is, the main process can also manage subprocesses, where the creation and destruction of subprocesses are controlled by the main process. In practical applications, different subprocesses can be used to execute the business logic of different browsers. Therefore, in one embodiment, to improve the component calling efficiency or control embedding efficiency of the browser webpage, the main process can pre-establish a mapping relationship between subprocesses and browser webpages, thereby quickly determining the target subprocess for executing the browser webpage's related business services for subsequent component embedding. Specifically, the mapping relationship between the browser webpage and the subprocess is constructed as follows:
[0071] S301: In response to the registration information of the browser webpage, establish a first communication connection between the browser webpage and the main process;
[0072] S303: Based on the registration information, create a subprocess corresponding to the browser webpage using the main process;
[0073] S305: Establish a second communication connection between the child process and the main process;
[0074] S307: Based on the first communication connection and the second communication connection, determine the mapping relationship between the browser webpage and the subprocess.
[0075] In this embodiment, the establishment method of the first communication connection can refer to the first communication connection method in the above embodiments, and will not be repeated here. In one embodiment of this application, after establishing the first communication connection between the browser webpage and the main process, the registration information can be obtained based on the first communication channel. Then, a child process corresponding to the browser webpage can be created based on the registration information. In one embodiment of this application, a process creation function can be used to create a child process for the browser webpage. Specifically, the applicable process creation function varies depending on the client's operating system. For example, for a Linux operating system, the process creation function can be the fork function; while for a Windows operating system, the process creation function can be the CreateProcess function.
[0076] In this embodiment, after creating the child process, a second communication connection can be established between the child process and the main process. Specifically, the second communication connection between the child process and the main process can be constructed based on various communication mechanisms. These communication mechanisms may include, for example, socket communication protocols, pipe communication mechanisms, TCP / IP communication protocols, etc., and are not limited herein. In one embodiment, during the creation of the child process, the identification information of the browser webpage can be set as the identification information of the child process. For example, the identification information of the browser webpage, such as a key value, can be written into the command line. This allows the child process to be mapped to the browser webpage, establishing a mapping relationship between the child process and the browser webpage, and quickly and easily determining the target child process corresponding to the browser webpage. The mapping relationship can include a one-to-one correspondence between the child process and the browser webpage, with one child process executing one browser webpage. Thus, when multiple browser webpages exist, each browser webpage has a corresponding child process for its normal operation. The crash or destruction of one child process will not affect the normal operation of other child processes, and therefore will not affect the normal use of other browser webpages. In one embodiment of this application, the mapping relationship may take various forms, such as a mapping relationship table, a mapping relationship model, a mapping relationship function, etc. For example, in one example, the mapping relationship table between the subprocess and the browser webpage is shown in Table 1 below.
[0077] Table 1. Mapping relationship between subprocesses and browser web pages
[0078] Child process 2 Browser webpage 2 Child process 3 Browser webpage 3
[0079] It is understood that, in one embodiment of this application, the method further includes: when the main process determines that the target subprocess has disconnected the communication connection, deleting the mapping relationship between the browser webpage and the target subprocess, and returning an exception reminder message.
[0080] In this embodiment, if the target subprocess encounters an anomaly, such as abnormal termination, the main process can delete the mapping relationship between the target subprocess and the browser webpage, and send an anomaly alert message to the browser. Alternatively, after the main process recreates a new subprocess for the browser webpage, the mapping relationship between the browser webpage and the new subprocess can be re-established according to the mapping relationship construction method described in the above embodiment.
[0081] Furthermore, in one embodiment of this application, after establishing the first communication connection and the second communication connection, the browser webpage and the subprocess can perform data transmission and processing to complete the interaction. For example, the component information to be embedded by the browser can be sent to the subprocess so that the subprocess can perform subsequent embedding work after receiving the component information. Specifically, in one embodiment of this application, before embedding the target component corresponding to the component information into the browser webpage using the target subprocess, the following steps are included:
[0082] S401: The main process obtains the component information through the first communication connection and sends the component information to the target subprocess through the second communication connection.
[0083] In this embodiment, the client's main process acts as a data relay station, sending component information obtained through the first communication connection to the target subprocess corresponding to the browser webpage via the second communication connection, thereby enabling data interaction between the browser webpage and the target subprocess. Compared to the existing method of interaction via a server, this eliminates the need for cross-machine transmission of component information, saving processing resources, improving interaction efficiency, and enhancing the user experience. It should be noted that in one embodiment of this application, after establishing the first and second communication connections, the client can return a notification message to the browser to notify it.
[0084] S105: The target component corresponding to the component information is embedded into the browser webpage using the target subprocess.
[0085] In this embodiment of the application, after determining the target subprocess, the target subprocess can determine the target component corresponding to the component information and embed the target component into the browser webpage. Specifically, embedding the target component corresponding to the component information into the browser webpage using the target subprocess includes:
[0086] S501: Determine the target component corresponding to the component information;
[0087] S503: The target subprocess accesses the target component through a preset interface;
[0088] S505: Embed the accessed target component into the browser webpage.
[0089] In this embodiment, the target subprocess can parse the acquired component information to determine the corresponding target component and the interface information of the target component, such as access method and access type. In one embodiment, the target component can be a control, which can be a component with a user interface (visual component), such as a button, list box, edit box, or static text in a dialog box. Preferably, the control can also include a plugin. Then, the target subprocess can determine, based on the interface information, to select a corresponding preset interface from multiple candidate preset interfaces to access the target component. The candidate preset interface can be an Application Programming Interface (API), such as a Java API implemented in Java or a native API implemented in C / C++. In one embodiment, the target subprocess can embed the target component into the browser webpage using an embedding container. Specifically, embedding the accessed target component into the browser webpage includes:
[0090] S601: Create the embedded container corresponding to the target component;
[0091] S603: Embed the embedding container into the browser webpage.
[0092] In this embodiment, the embedded container is essentially a control that can be embedded into the browser webpage and has no business functionality itself. Preferably, the embedded container can be a container control, such as, but not limited to, QWidget, QFrame, QScrollArea, QGroupBox, QTabWidget, QToolBox, QStackedWidget, QDockWidget, etc. The embedded container can load the corresponding target component and convert the target component into an internal component or control. After determining the embedded container, the target subprocess can complete the embedding of the target component by setting the embedded container as a child window of the browser webpage. For example, if the client's operating system is Windows, the target subprocess can call the SetParent interface to set the embedded container as a child window of the browser webpage. Of course, if the client's operating system is another type of operating system, the target subprocess can combine the browser window handle and call the Qt QWidget::windowHandle->setParent() interface to achieve this. In this way, the target component can truly become part of the browser webpage.
[0093] The data processing method provided in this application can quickly and accurately determine the target subprocess for executing the business logic of the browser webpage based on the mapping relationship between browser webpages and subprocesses. The target subprocess can then embed the target components called by the browser webpage into the browser webpage. This process eliminates the need for additional settings for the access method of the target components and the interaction method between the browser and the client, thereby saving processing resources and improving embedding efficiency. Furthermore, the client's main process can pre-set the mapping relationship between multiple browser webpages and multiple subprocesses. This not only allows for quick determination of the subprocess corresponding to the browser webpage, improving processing efficiency, but also enables multi-process control. The crash of one subprocess will not affect the operation of other subprocesses, thus ensuring the normal use of other browser webpages.
[0094] In practical applications, to enrich the display effect of the browser webpage and enhance the interactivity between the webpage and the user, the embedding position and window size of the target component can be set. Specifically, in one embodiment of the application, embedding the embedding container into the browser webpage includes:
[0095] S701: Obtain the size and location information of the browser webpage through the system interface;
[0096] S703: Based on the size information and the position information, embed the embedding container into the browser webpage.
[0097] In this embodiment, the client can obtain the window handle sent by the browser, for example, through the FindWindow function, GetSafeHwnd function, etc. After obtaining the window handle, the client can call the system interface according to the window handle to obtain the position information, size information, etc. of the browser webpage, and can also obtain the browser's position information and size information, etc. The position information of the browser webpage can include the position coordinates of the browser webpage, for example, it can include the position coordinates of the top left corner, bottom left corner, top right corner, bottom right corner, etc., such as the position coordinates of the top left corner being p(x, y). The size information of the browser webpage can include the height information, width information, etc., for example, the width is w0, and the height is h1. In one embodiment of this application, after determining the position information and size information of the browser webpage, the browser can set the embedding position and size of the embedding container accordingly, and send the embedding position and size to the client. After receiving the embedding position and size, the client can adjust the size of the embedding container and embed it into the browser webpage according to the embedding position. For example, in one example, as Figure 2As shown, the outermost border represents the window size of browser A, p0(x0, y0) is the top-left corner of browser A, the middle border represents the window size of browser webpage B, p1(x1, y1) is the top-left corner of browser webpage B, and the innermost border represents the area of the embedded container C, p2(x2, y2) is the top-left corner of the embedded container C. Browser webpage B and the embedded container C can establish a coordinate system with p0 as the origin, with a horizontal difference X1 = x1 - x0 and a vertical difference Y1 = y1 - y0. Browser webpage B can set the embedding position of the embedded container C to P3(x3, y3), with a width of w2 and a height of h2. The client can determine the coordinates of the top-left corner p2 of the embedded container C as x2 = x3 + x1 and y2 = y3 + y1, and can call the QWidget::move interface to move the embedded container to the set position.
[0098] In one embodiment of this application, the size and position of the embedded container are controlled by the browser webpage sending messages to the client. To prevent third-party access from being unaware of these details, the browser webpage can solve this problem by binding the embedded container based on webpage elements. Specifically, in one embodiment of this application, before embedding the embedded container into the browser webpage, the following steps may be included:
[0099] S801: Obtain the association between the target element of the browser webpage and the embedded container;
[0100] S803: Obtain the position and size information of the target element;
[0101] S805: Determine the position information of the embedded container based on the association relationship and the position information of the target element.
[0102] and / or
[0103] S807: Determine the size information of the embedded container based on the association relationship and the size information of the target element.
[0104] In this embodiment, the browser webpage can be a page organized based on a certain webpage structure, including multiple target elements. The type of the target element can be a Document Object Model (DOM). The DOM allows accessing and modifying the content and structure of a document in a platform- and language-independent manner. In one example, the target element can be a node in the DOM tree corresponding to the webpage. In one embodiment, the browser webpage can call a JavaScript interface to obtain the DOM object. After obtaining the target element, an association relationship can be established between the target element and the embedding container based on the target element's identification information and the embedding container's identification information; that is, the target element is "bound" to the embedding container. In one embodiment, before sending the component information to the client, the browser webpage can set the HTML... The attribute values of the tag, the component name, and can be based on the HTML. The attribute values of the tag determine the corresponding target element and its identification information. This identification information can then be encapsulated into the component information. Upon receiving the component information, the client can parse the target element's identification information, create a corresponding embedding container, and establish an association between the target element and the target component. In one embodiment of this application, the browser can monitor whether a triggering event occurs on the browser webpage. These triggering events may include, for example, tag size changes, mouse wheel events, browser webpage zooming events, and changes in the size of the DOM object itself. After detecting a triggering event on the browser webpage, the browser can recalculate the target element's position and size information and send these information to the client. Then, the target subprocess can determine the embedding container's position information and / or its size information based on the association and the target element's position information. Specifically, the target subprocess can call an interface to set the position and size of the embedding container.
[0105] In one embodiment of this application, to improve the interaction efficiency between the browser webpage and the client, increase component embedding efficiency, and avoid cumbersome embedding steps, multiple first standard interfaces can be pre-encapsulated within the client to achieve different functions. Specifically, in one embodiment of this application, the first standard interfaces may include, but are not limited to: component initialization interface, uncomponent initialization interface, component embedding webpage creation interface, component embedding webpage destruction interface, component size adjustment interface, component display or hiding adjustment interface, component information receiving interface, component information sending interface, etc. Thus, the client can select different first standard interfaces according to actual application needs to meet different functional requirements. Of course, in other embodiments of this application, multiple second standard interfaces can also be pre-encapsulated within the browser to achieve different functional selections. Specifically, the second standard interfaces may include, but are not limited to: component creation interface, component positioning interface, component display / hiding interface, component command sending interface, component destruction interface, message sending interface, message receiving interface, etc. The message sending interface can send webpage messages from the browser to the client through a first communication connection. The message receiving interface can receive messages returned by the client through the first communication connection. In one embodiment of this application, the browser webpage can use the information carried by the interface call instruction to run the interface function corresponding to the target interface specified by the information, thereby realizing the corresponding function.
[0106] This application also provides a data processing method based on the browser, such as... Figure 3 As shown, the method may include:
[0107] S901: Send the component information to be invoked to the client;
[0108] S903: Display the target component corresponding to the component information on the browser webpage; the target component is a target subprocess embedded in the browser webpage, the target subprocess is determined by the mapping relationship between the browser webpage and the subprocess, and the mapping relationship is pre-established by the main process of the client.
[0109] The solution to the problem provided in this application is similar to the solution described in the above method. Therefore, please refer to the limitations of the data processing method in the above text, which will not be repeated here.
[0110] The interaction process between the browser and the client is described below using a preferred embodiment. Figure 3 As shown, the client and the browser can establish a communication connection through the following steps. The client includes a main process and a child process, and the browser includes a front-end component. The client first calls an interface to initialize the front-end component (step 1). After receiving the initialization instruction, the front-end component can generate unique identification information such as a key (step 2.1), and send a connection request (WebSocket connection) to the main process via a local fixed URL (step 2.2) and send registration information to register the front-end component (step 2.3). Step 3: The main process registers the front-end component information; Step 4: Creates the child process corresponding to the front-end component (front-end component information can be passed in during creation); Step 5: Initializes the child process, where step 5 may include step 5.1: The child process sends a connection request (socket connection) to the main process via a local fixed URL; Step 5.2: Sends child process registration information to register the child process. After receiving the registration information, the main process can establish a communication connection between the main process and the child process, and bind the front-end component and the child process (step 6). The main process can then send a notification to the front-end component to inform it that the initialization is complete and commands can be issued (step 7). The front-end component can also send a notification to the user to inform it that commands can be issued (step 8). At this point, the communication connection between the front-end component and the child process is established.
[0111] Afterwards, the user client can call the interface to complete the creation of the browser-embedded control. Specifically, such as... Figure 4 As shown, the client can call the interface to create a control (step 9), and the front-end component can send the control creation message to the main process (step 10). The main process, acting as a data transmission intermediary, can directly pass through the message, sending the control creation message to the corresponding child process (step 11). After receiving the control creation message, the child process can parse the protocol, create the control, embed it into the browser webpage (step 12), and then return a creation completion message to the main process (step 13). The main process can still directly pass through the message, sending the creation completion message to the front-end component (step 14), and the front-end component can notify the client that the control creation is complete (step 15).
[0112] It should be understood that although the steps in the flowcharts of the embodiments described above are shown sequentially according to the arrows, these steps are not necessarily executed in the order indicated by the arrows. Unless explicitly stated herein, there is no strict order restriction on the execution of these steps, and they can be executed in other orders. Moreover, at least some steps in the flowcharts of the embodiments described above may include multiple steps or multiple stages. These steps or stages are not necessarily completed at the same time, but can be executed at different times. The execution order of these steps or stages is not necessarily sequential, but can be performed alternately or in turn with other steps or at least some of the steps or stages of other steps.
[0113] Based on the same inventive concept, this application also provides a data processing apparatus for implementing the data processing method described above. The solution provided by this apparatus is similar to the implementation scheme described in the above method; therefore, the specific limitations in one or more data processing apparatus embodiments provided below can be found in the limitations of the data processing method described above, and will not be repeated here.
[0114] In one embodiment, such as Figure 5 As shown, a data processing apparatus 500 is provided, the apparatus 500 comprising:
[0115] The component information acquisition module 501 is used to acquire component information called by the browser webpage;
[0116] The target subprocess determination module 503 is used to determine the target subprocess corresponding to the browser webpage based on the mapping relationship between the browser webpage and the subprocess; the mapping relationship is pre-established by the main process.
[0117] The embedding module 505 is used to embed the target component corresponding to the component information into the browser webpage using the target subprocess.
[0118] Optionally, in one embodiment of this application, obtaining the component information invoked by the browser webpage includes:
[0119] Receive the registration information from the browser webpage;
[0120] Based on the registration information, a first communication connection is established between the browser webpage and the main process;
[0121] The component information invoked by the browser webpage is obtained based on the first communication connection.
[0122] Optionally, in one embodiment of this application, the mapping relationship between the browser webpage and the subprocess is constructed in the following manner:
[0123] In response to the registration information of the browser webpage, a first communication connection is established between the browser webpage and the main process;
[0124] Based on the registration information, a subprocess corresponding to the browser webpage is created using the main process;
[0125] Establish a second communication connection between the child process and the main process;
[0126] Based on the first communication connection and the second communication connection, the mapping relationship between the browser webpage and the subprocess is determined.
[0127] Optionally, in one embodiment of this application, before embedding the target component corresponding to the component information into the browser webpage using the target subprocess, the following steps are included:
[0128] The main process obtains the component information through the first communication connection and sends the component information to the target subprocess through the second communication connection.
[0129] Optionally, in one embodiment of this application, the step of embedding the target component corresponding to the component information into the browser webpage using the target subprocess includes:
[0130] Determine the target component corresponding to the component information;
[0131] The target subprocess accesses the target component through a preset interface;
[0132] The target component is embedded into the browser webpage.
[0133] Optionally, in one embodiment of this application, embedding the accessed target component into the browser webpage includes:
[0134] Create the embedded container corresponding to the target component;
[0135] The embedding container is embedded into the browser webpage.
[0136] Optionally, in one embodiment of this application, before embedding the embedding container into the browser webpage, the following steps are included:
[0137] Obtain the association between the target element of the browser webpage and the embedded container;
[0138] Obtain the position and size information of the target element;
[0139] Based on the association relationship and the position information of the target element, determine the position information of the embedded container; and / or, based on the association relationship and the size information of the target element, determine the size information of the embedded container.
[0140] Optionally, in one embodiment of this application, embedding the embedding container into the browser webpage includes:
[0141] The size and position information of the browser webpage are obtained through the system interface;
[0142] Based on the size information and the location information, the embedding container is embedded into the browser webpage.
[0143] Optionally, in one embodiment of this application, the apparatus further includes:
[0144] If the target subprocess is found to have disconnected from the communication connection, the main process deletes the mapping relationship between the browser webpage and the target subprocess and returns an exception alert.
[0145] Each module in the aforementioned data processing device can be implemented entirely or partially through software, hardware, or a combination thereof. These modules can be embedded in or independent of the processor in a computer device, or stored in the memory of a computer device as software, so that the processor can call and execute the operations corresponding to each module.
[0146] like Figure 6 As shown, embodiments of this application also provide an electronic device 600, which includes: a processor and a memory for storing processor-executable instructions; wherein the processor is configured to implement the above-described method when executing the instructions. The electronic device 600 includes a memory 601, a processor 603, a bus 605, and a communication interface 607. The memory 601, processor 603, and communication interface 607 communicate via the bus 605. The bus 605 may be a peripheral component interconnect (PCI) bus or an extended industry standard architecture (EISA) bus, etc. The bus can be divided into an address bus, a data bus, a control bus, etc. For ease of illustration, Figure 6 The bus is represented by a single thick line, but this does not imply that there is only one bus or one type of bus. Communication interface 607 is used for external communication. Processor 603 can be a central processing unit (CPU). Memory 601 can include volatile memory, such as random access memory (RAM). Memory 601 can also include non-volatile memory, such as read-only memory (ROM), flash memory, HDD, or SSD. Memory 601 stores executable code, which processor 603 executes to perform the methods described in the foregoing embodiments.
[0147] Embodiments of this application provide a non-volatile computer-readable storage medium storing computer program instructions thereon, which, when executed by a processor, implement the above-described method.
[0148] Embodiments of this application provide a computer program product including computer-readable code, or a non-volatile computer-readable storage medium carrying computer-readable code, wherein when the computer-readable code is run in a processor of an electronic device, the processor in the electronic device performs the above-described method.
[0149] In some embodiments, the disclosed method may be implemented as computer program instructions encoded in a machine-readable format on a computer-readable storage medium or on other non-transitory media or articles of art. Figure 7 A conceptual partial view schematically illustrates an example computer program product arranged according to at least some embodiments shown herein, the example computer program product including a computer program for executing computer processes on a computing device. In one embodiment, the example computer program product 700 is provided using a signal carrying medium 701. The signal carrying medium 701 may include one or more program instructions 702 that, when executed by one or more processors, can provide the above-described instructions for... Figure 1 The described function or part of the function. In addition... Figure 7 The program instruction 702 in the document also describes example instructions.
[0150] In some examples, the signal-bearing medium 701 may include a computer-readable medium 703, such as, but not limited to, a hard disk drive, a compact disc (CD), a digital video optical disc (DVD), a digital magnetic tape, a memory, read-only memory (ROM), or random access memory (RAM), etc. In some embodiments, the signal-bearing medium 701 may include a computer-recordable medium 704, such as, but not limited to, a memory, a read / write (R / W) CD, a R / W DVD, etc. In some embodiments, the signal-bearing medium 701 may include a communication medium 705, such as, but not limited to, digital and / or analog communication media (e.g., fiber optic cables, waveguides, wired communication links, wireless communication links, etc.). Therefore, for example, the signal-bearing medium 701 may be conveyed by a wireless communication medium 705 (e.g., a wireless communication medium conforming to the IEEE 802.11 standard or other transmission protocols). One or more program instructions 702 may be, for example, computer-executable instructions or logical implementation instructions. In some examples, such as for... Figure 6 The computing device of the described electronic device can be configured to provide various operations, functions, or actions in response to program instructions 702 transmitted to the computing device via one or more of a computer-readable medium 703, a computer-recordable medium 704, and / or a communication medium 705. It should be understood that the arrangements described herein are merely for illustrative purposes. Therefore, those skilled in the art will understand that other arrangements and other elements (e.g., machines, interfaces, functions, sequences, and functional groups, etc.) can be used instead, and some elements can be omitted depending on the desired result. Furthermore, many of the described elements are functional entities that can be implemented as discrete or distributed components, or in any suitable combination and location with other components. The flowcharts and block diagrams in the accompanying drawings illustrate the architecture, functions, and operations of possible implementations of apparatus, systems, and computer program products according to various embodiments of this application. In this regard, each block in a flowchart or block diagram may represent a module, segment, or portion of an instruction containing one or more executable instructions for implementing a specified logical function. In some alternative implementations, the functions marked in the blocks may occur in a different order than those marked in the drawings. For example, two consecutive boxes can actually be executed in essentially parallel order, and sometimes they can be executed in reverse order, depending on the functionality involved.
[0151] It should also be noted that each block in the block diagram and / or flowchart, as well as combinations of blocks in the block diagram and / or flowchart, can be implemented using hardware (such as circuits or ASICs (Application Specific Integrated Circuits)) that performs the corresponding function or action, or using a combination of hardware and software, such as firmware.
[0152] Although the invention has been described herein in conjunction with various embodiments, those skilled in the art will understand and implement other variations of the disclosed embodiments by reviewing the accompanying drawings, disclosure, and appended claims in carrying out the claimed invention. A single processor or other unit may implement several of the functions listed in the claims. While certain measures are recited in mutually different dependent claims, this does not mean that these measures cannot be combined to produce good results.
[0153] The various embodiments of this application have been described above. These descriptions are exemplary and not exhaustive, nor are they limited to the disclosed embodiments. Many modifications and variations will be apparent to those skilled in the art without departing from the scope and spirit of the described embodiments. The terminology used herein is chosen to best explain the principles, practical application, or improvement of the technology in the market, or to enable others skilled in the art to understand the embodiments disclosed herein.
Claims
1. A data processing method, characterized in that, The method is applied to the client and includes: Get information about components called by the browser webpage; Based on the mapping relationship between browser web pages and subprocesses, the target subprocess corresponding to the browser web page is determined; the mapping relationship is pre-established through the main process. The target component corresponding to the component information is embedded into the browser webpage using the target subprocess; The mapping relationship between the browser webpage and the subprocess is constructed in the following manner: In response to the registration information of the browser webpage, a first communication connection is established between the browser webpage and the main process; the registration information includes a connection request sent by the browser based on a cross-domain communication protocol; Based on the registration information, a subprocess corresponding to the browser webpage is created using the main process; Establish a second communication connection between the child process and the main process; Based on the first communication connection and the second communication connection, the mapping relationship between the browser webpage and the subprocess is determined.
2. The method according to claim 1, characterized in that, The process of obtaining component information invoked by the browser webpage includes: Receive the registration information from the browser webpage; Based on the registration information, a first communication connection is established between the browser webpage and the main process; The component information invoked by the browser webpage is obtained based on the first communication connection.
3. The method according to claim 1, characterized in that, Before embedding the target component corresponding to the component information into the browser webpage using the target subprocess, the process includes: The main process obtains the component information through the first communication connection and sends the component information to the target subprocess through the second communication connection.
4. The method according to claim 1, characterized in that, The step of embedding the target component corresponding to the component information into the browser webpage using the target subprocess includes: Determine the target component corresponding to the component information; The target subprocess accesses the target component through a preset interface; The target component is embedded into the browser webpage.
5. The method according to claim 4, characterized in that, The step of embedding the accessed target component into the browser webpage includes: Create the embedded container corresponding to the target component; The embedding container is embedded into the browser webpage.
6. The method according to claim 5, characterized in that, Before embedding the embedding container into the browser webpage, the following steps are included: Obtain the association between the target element of the browser webpage and the embedded container; Obtain the position and size information of the target element; Based on the association relationship and the position information of the target element, determine the position information of the embedded container; and / or, based on the association relationship and the size information of the target element, determine the size information of the embedded container.
7. The method according to claim 5, characterized in that, The step of embedding the embedding container into the browser webpage includes: The size and position information of the browser webpage are obtained through the system interface; Based on the size information and the location information, the embedding container is embedded into the browser webpage.
8. The method according to claim 1, characterized in that, The method further includes: If the target subprocess is found to have disconnected from the communication connection, the main process deletes the mapping relationship between the browser webpage and the target subprocess and returns an exception alert.
9. A data processing method, characterized in that, The method is applied to the browser side, and the method includes: Send the component information to be invoked to the client; The target component corresponding to the component information is displayed on the browser webpage; the target component is a target subprocess embedded in the browser webpage, and the target subprocess is determined by the mapping relationship between the browser webpage and the subprocess, and the mapping relationship is pre-established by the main process of the client. The mapping relationship between the browser webpage and the subprocess is constructed in the following manner: In response to the registration information of the browser webpage, a first communication connection is established between the browser webpage and the main process; the registration information includes a connection request sent by the browser based on a cross-domain communication protocol; Based on the registration information, a subprocess corresponding to the browser webpage is created using the main process; Establish a second communication connection between the child process and the main process; Based on the first communication connection and the second communication connection, the mapping relationship between the browser webpage and the subprocess is determined.
10. A data processing apparatus, characterized in that, The device is applied to a client and includes: The component information acquisition module is used to obtain component information called by the browser webpage; The target subprocess determination module is used to determine the target subprocess corresponding to the browser webpage based on the mapping relationship between the browser webpage and the subprocess; the mapping relationship is pre-established by the main process; An embedding module is used to embed the target component corresponding to the component information into the browser webpage using the target subprocess; The mapping relationship between the browser webpage and the subprocess is constructed in the following manner: In response to the registration information of the browser webpage, a first communication connection is established between the browser webpage and the main process; the registration information includes a connection request sent by the browser based on a cross-domain communication protocol; Based on the registration information, a subprocess corresponding to the browser webpage is created using the main process; Establish a second communication connection between the child process and the main process; Based on the first communication connection and the second communication connection, the mapping relationship between the browser webpage and the subprocess is determined.
11. An electronic device comprising a memory and a processor, wherein the memory stores a computer program, characterized in that, When the processor executes the computer program, it implements the steps of the method according to any one of claims 1 to 9.
12. A computer-readable storage medium having a computer program stored thereon, characterized in that, When the computer program is executed by a processor, it implements the steps of the method according to any one of claims 1 to 9.
13. A computer program product, comprising a computer program, characterized in that, When the computer program is executed by a processor, it implements the steps of the method according to any one of claims 1 to 9.