Web worker communication method and device, equipment and storage medium
Through the Web Worker communication method based on function calls, the communication between the main thread and the Worker thread is simplified, the problem of cumbersome use of existing methods is solved, and the communication efficiency and code readability are improved.
Patent Information
- Application Number
- CN202411570285.2
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-11-05
- Publication Date
- 2025-02-11
AI Technical Summary
The existing Web Worker communication methods are cumbersome and not clear enough, which makes code modification and testing difficult.
A Web Worker communication method based on function calls is proposed. The steps of generating call requests, calling proxy objects of worker threads, sending call requests, listening to postMessage of worker threads, and obtaining function execution results are simplified. communication.
It improves the simplicity and efficiency of Web Worker communication, reduces the complexity and coupling of the code, and allows the main thread to call methods in the Worker thread like calling local functions.
Smart Images
Figure CN119415291A_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the field of computer technology, and in particular to a web worker communication method, device, equipment and storage medium. Background Art
[0002] Web Worker technology allows the creation of Worker threads in web browsers to perform tasks without blocking the main thread, which breaks through the limitation of single thread of web. The application background of this technology is mainly to improve the performance and responsiveness of web applications, especially when dealing with complex calculations or high latency tasks. By executing these tasks in background threads, the main thread can remain smooth and continue to respond to user operations, thus providing a better user experience.
[0003] Currently, Web Worker technology has been widely used in various scenarios, including but not limited to offline data processing and caching, large-scale data computing, image processing, and media encoding and decoding. Developers can create Worker threads to handle these tasks, while the main thread can focus on UI interaction and page rendering. Web Workers communicate with the main thread through the postMessage method and onmessage event listener to achieve data transmission and return of processing results.
[0004] Although Web Workers provide powerful multi-threading capabilities, there are also shortcomings in their use. First, traditional Web Worker usage involves communicating between threads by listening to message events and calling postMessage methods. The message processing function contains all processing logic, which does not meet the requirements of the single responsibility design pattern, that is, a class or function should have only one reason to change it. In addition, the calling relationship of postMessage is not direct enough, and developers cannot quickly obtain the input and output calling results and processes from the code level, which leads to logical coupling problems. Logical coupling means that the dependencies between different parts of the code are too close, which makes it more difficult to modify and test the code. Therefore, this method is considered to be cumbersome and unclear to use. Summary of the invention
[0005] The main purpose of the embodiments of the present application is to propose a web worker communication method, device, equipment and storage medium based on function calls, aiming to improve the simplicity of the web worker communication method.
[0006] To achieve the above-mentioned purpose, a first aspect of an embodiment of the present application proposes a web worker communication method, the method comprising:
[0007] Generate a call request to a worker thread, wherein the call request is used to request to call the worker thread to perform data processing;
[0008] According to the calling request, calling the proxy object corresponding to the worker thread, wherein the proxy object corresponding to the worker thread is obtained by wrapping the worker object of the worker thread through a wrapProxy function, and the wrapProxy function includes an apply function;
[0009] Sending the call request to the worker thread through the apply function, wherein the call request is carried in postMessage;
[0010] Monitor the postMessage of the worker thread through the proxy object;
[0011] Get the function execution result parsed by the proxy object from the postMessage of the worker thread.
[0012] In some embodiments, before the step of calling the proxy object corresponding to the worker thread according to the calling request, the method further includes:
[0013] Create a main.js file, which stores the main thread code;
[0014] The file path of the worker.js of the worker thread is passed into the newWorker function through the main.js file to generate a worker object of the worker thread;
[0015] The worker object of the worker thread is wrapped by the wrapProxy function to obtain the proxy object of the worker thread.
[0016] In some embodiments, wrapping the worker object of the worker thread by the wrapProxy function to obtain the proxy object of the worker thread includes:
[0017] Obtain the worker object of the worker thread through the wrapProxy function;
[0018] The worker object of the worker thread is passed into the target function of the wrapProxy function, and the apply function of the wrapProxy function is rewritten to obtain the proxy object of the worker thread.
[0019] In some embodiments, the class template of the worker object is a class template defining a postMessage function.
[0020] To achieve the above object, a second aspect of an embodiment of the present application proposes a web worker communication method, the method comprising:
[0021] Receive a call request sent by the main thread, where the call request is used to request to call a worker thread to process data;
[0022] Calling the export function, packaging the first worker thread through the export function, and obtaining the first monitoring object corresponding to the first worker thread;
[0023] Monitoring the call request through the first monitoring object;
[0024] In a case where the call request contains the name of the first function of the first worker thread, executing the first function to obtain a function execution result of the first function;
[0025] The function execution result is sent to the main thread through the first monitoring object, wherein the execution result is carried in postMessage.
[0026] In some embodiments, monitoring the call request through the first monitoring object includes:
[0027] Obtaining the global object and object interface of the first worker thread through the export function of the first monitoring object;
[0028] Monitoring the call request through the global object;
[0029] In the case where the call request contains the name of the first function of the first worker thread, before executing the first function, the method further includes:
[0030] The name of the first function is bound to the object interface.
[0031] To achieve the above-mentioned purpose, a third aspect of an embodiment of the present application provides a web worker communication device, the device comprising:
[0032] A generating module, used to generate a calling request to a worker thread, wherein the calling request is used to request to call the worker thread to perform data processing;
[0033] A calling proxy object module, used to call the proxy object corresponding to the worker thread according to the calling request, wherein the proxy object corresponding to the worker thread is obtained by wrapping the worker object of the worker thread through a wrapProxy function, and the wrapProxy function includes an apply function;
[0034] A calling request sending module, used for sending the calling request to the worker thread through the apply function, wherein the calling request is carried in postMessage;
[0035] A proxy object monitoring module, used to monitor the postMessage of the worker thread through the proxy object;
[0036] The function execution result acquisition module is used to obtain the function execution result parsed by the proxy object from the postMessage of the worker thread.
[0037] To achieve the above-mentioned purpose, a fourth aspect of an embodiment of the present application provides a web worker communication device, the device comprising:
[0038] A receiving module is used to receive a call request sent by the main thread, wherein the call request is used to request to call a worker thread to perform data processing;
[0039] Calling an export function module, which is used to call the export function, packaging the first worker thread through the export function, and obtaining a first monitoring object corresponding to the first worker thread;
[0040] A first monitoring object module, used for monitoring the call request through the first monitoring object;
[0041] an execution module, configured to execute the first function and obtain a function execution result of the first function when monitoring that the call request includes the name of the first function of the first worker thread;
[0042] The function execution result sending module is used to send the function execution result to the main thread through the first monitoring object, wherein the execution result is carried in postMessage.
[0043] To achieve the above objectives, the fifth aspect of an embodiment of the present application proposes an electronic device, which includes a memory and a processor, the memory stores a computer program, and the processor implements the methods described in the first and second aspects when executing the computer program.
[0044] To achieve the above objectives, the fourth aspect of an embodiment of the present application proposes a computer-readable storage medium, which stores a computer program. When the computer program is executed by a processor, it implements the methods described in the first and second aspects above.
[0045] The web worker communication method, device, equipment and storage medium proposed in the present application, after generating a call request to a worker thread, calls the proxy object corresponding to the worker thread according to the call request, wherein the proxy object corresponding to the worker thread is obtained by wrapping the worker object of the worker thread through the wrapProxy function, and the wrapProxy function includes an apply function; the call request is sent to the worker thread through the apply function, wherein the call request is carried in postMessage; the postMessage of the worker thread is monitored through the proxy object; and the function execution result parsed by the proxy object from the postMessage of the worker thread is obtained. It can be seen that the main thread can send tasks to the worker thread through the proxy object and receive the results processed by the worker thread, thereby solving the problem that the existing web worker communication method is cumbersome and unclear to use, and improving the communication efficiency of the webworker communication method. BRIEF DESCRIPTION OF THE DRAWINGS
[0046] Figure 1 is a flow chart of a web worker communication method provided by an embodiment of the present application;
[0047] Figure 2 yes Figure 1 Flow chart of step S102 in FIG.
[0048] Figure 3 yes Figure 1 Flow chart of step S203 in FIG.
[0049] Figure 4 is a flowchart of another web worker communication method provided by an embodiment of the present application;
[0050] Figure 5 yes Figure 5 Flow chart of step S403 in FIG.
[0051] Figure 6 It is a structural diagram of a web worker communication device provided in an embodiment of the present application;
[0052] Figure 7is a structural diagram of another web worker communication device provided in an embodiment of the present application;
[0053] Figure 8 It is a schematic diagram of the hardware structure of the electronic device provided in the embodiment of the present application. DETAILED DESCRIPTION
[0054] In order to make the purpose, technical solution and advantages of the present application more clearly understood, the present application is further described in detail below in conjunction with the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are only used to explain the present application and are not used to limit the present application.
[0055] It should be noted that, although the functional modules are divided in the device schematic diagram and the logical order is shown in the flowchart, in some cases, the steps shown or described may be performed in a different order than the module division in the device or the order in the flowchart. The terms "first", "second", etc. in the specification, claims and the above drawings are used to distinguish similar objects, and are not necessarily used to describe a specific order or sequence.
[0056] Unless otherwise defined, all technical and scientific terms used herein have the same meaning as those commonly understood by those skilled in the art to which this application belongs. The terms used herein are only for the purpose of describing the embodiments of this application and are not intended to limit this application.
[0057] First, some nouns involved in this application are analyzed:
[0058] The definition of the main thread is that in the operating system, the main thread usually refers to the first thread in a process, that is, the first thread created when the process starts. It is the entry point of the process and is responsible for executing the main logic of the program. During the life cycle of the program, the main thread is usually responsible for the interaction between the main logic of the program and the user interface.
[0059] The purpose of the main thread: to process user input and interface updates; to coordinate the execution of other threads; to serve as the entry point of the program and execute the logic of the main program. The characteristics of the main thread: there is usually only one main thread; in some operating systems, the termination of the main thread will cause the termination of the entire program.
[0060] Worker threads, also called child threads, are auxiliary threads used to perform background tasks to avoid blocking the main thread. Worker threads are usually used to perform time-consuming calculations or I / O operations to keep the user interface responsive. Purpose of Worker threads: perform time-consuming computing tasks such as image processing, data analysis, etc.; perform I / O operations such as file reading and writing, network requests, etc.; process tasks in parallel to improve the execution efficiency of the program. Features of Worker threads: there can be multiple Worker threads to achieve parallel processing; usually do not interact directly with the user interface; need to communicate with the main thread to update the interface or return calculation results.
[0061] Web development level: In web development, the main thread usually refers to the thread that executes JavaScript code in the browser. This thread is responsible for parsing HTML, CSS, executing JavaScript, handling user interactions, etc. Since JavaScript is single-threaded, the main thread handles both UI rendering and JavaScript execution, so executing long-running JavaScript code may cause the page to respond slowly or freeze.
[0062] Web development level: Web Workers is a browser technology introduced by HTML5 that allows JavaScript scripts to create multiple threads to perform tasks in the background without freezing the user interface. Worker threads can perform complex calculations or handle long-running tasks without affecting the responsiveness of the main thread. Worker threads communicate with the main thread through message passing, using the postMessage method to send messages and listening to the onmessage event to receive messages.
[0063] Communication refers to the process of transmitting and exchanging information, which involves the flow of information between two or more entities (such as people, computers, devices, etc.). Web Worker communication mainly relies on message passing mechanisms, allowing the main thread and Worker threads to exchange data and instructions. Through these mechanisms, Web Workers achieve effective communication between the main thread and Worker threads, making multi-threaded programming possible in the browser, improving the performance and responsiveness of front-end applications.
[0064] The apply function is a method in JavaScript that belongs to the Function object. The apply method allows calling a function with a given this value and the arguments provided in the form of an array (or array-like object).
[0065] The wrapProxy function is related to JavaScript's Proxy object, which is used to create a proxy for an object, thereby implementing interception and customization of basic operations. In JavaScript, the Proxy object is used to define custom behaviors for basic operations (such as property lookup, assignment, enumeration, function call, etc.). The Proxy object can be seen as a proxy for an object, which encapsulates all operations on the original object and can perform customized behaviors before and after the operation is executed.
[0066] The export function is used to receive the global object self of the worker thread and export the exposed object api.
[0067] In programming languages, the export keyword is used to export members in a module (such as variables, functions, classes, etc.) so that they can be imported and used in other modules. The specific usage and meaning depends on the specific programming language and module system. In JavaScript's ES6 module system, export is used to export members in a module so that other files can import them.
[0068] The postMessage function is an important method for implementing cross-source communication in Web API. It allows scripts from different sources to communicate effectively in an asynchronous manner, and can implement cross-text document, multi-window, and cross-domain message delivery. It is mostly used for data communication between windows, which also makes it an effective solution for cross-domain communication.
[0069] postMessage is a browser API for securely passing messages between different contexts (such as different browser windows, different iframes, different worker threads, etc.). This API is particularly useful because it allows cross-origin communication, that is, pages from different domains can communicate with each other, which is not possible in traditional AJAX requests. At the same time, postMessage provides a secure communication mechanism because it allows the receiver to check the source of the message, ensuring that only messages from trusted sources are processed. In addition, postMessage is an important tool for implementing cross-origin communication in modern Web development.
[0070] In Web development, new Worker() is a constructor used to create a new Web Worker thread, i.e., the new Worker function in the embodiment of the present application. Web Workers allow you to run scripts in background threads without affecting the performance of the page. This is achieved by separating time-consuming computing tasks from the main thread (such as the UI thread). The newWorker() constructor is used to create a new Worker instance. This instance represents a script running in the background, which can communicate with the main thread through messaging, but will not block the rendering of the UI.
[0071] The main.js file is usually the main JavaScript file, which is responsible for handling the main logic and user interface interaction of the web page. It interacts directly with the HTML document, handles user input, controls DOM elements, initiates network requests, responds to user events, etc. In a web application, main.js can be regarded as the control center, responsible for coordinating the behavior and appearance of the page.
[0072] The worker.js file is a Web Worker script that is used to execute tasks in a background thread without interfering with the running of the main thread. Web Workers can be used to perform computationally intensive or long-running tasks such as data processing, mathematical calculations, file processing, etc., which can avoid blocking the main thread and improve the responsiveness and performance of the page.
[0073] The difference between the main.js file and the worker.js file is that main.js interacts directly with the user interface, while worker.js runs in the background and does not interact directly with the user interface. The connection between the two is that main.js can send messages to worker.js through the postMessage method, and worker.js can also send messages to main.js through postMessage. This communication mechanism allows the two scripts to work together, with main.js responsible for the interface and user interaction and worker.js responsible for background calculations and data processing.
[0074] main.js and worker.js are common file types in Web development. They handle foreground and background tasks respectively, communicate through the Web Workers API, and jointly improve the performance and user experience of Web applications.
[0075] The Web and Node.js represent two different areas of JavaScript applications, one on the client side and one on the server side, which together form the foundation of modern Web development.
[0076] The web side usually refers to the front-end part of the website, which is the part that users interact with directly. It mainly runs in the user's browser and is responsible for displaying content, processing user input, and sending requests to the server.
[0077] Node.js is a JavaScript runtime based on the Chrome V8 JavaScript engine, which allows developers to run JavaScript code on the server side. Node.js uses a non-blocking I / O model and event-driven architecture, which makes it very suitable for handling a large number of concurrent connections and I / O-intensive applications.
[0078] Based on this, the embodiments of the present application provide a web worker communication method and device, an electronic device and a storage medium, aiming to improve the efficiency of web worker communication, which is specifically illustrated by the following embodiments. First, the web worker communication method in the embodiments of the present application is described.
[0079] The web worker communication method provided in the embodiment of the present application relates to the field of computer technology. The web worker communication method provided in the embodiment of the present application can be applied to a terminal, can be applied to a server side, or can be software running in a terminal or a server side. In some embodiments, the terminal can be a smart phone, a tablet computer, a laptop computer, a desktop computer, etc.; the server side can be configured as an independent physical server, or can be configured as a server cluster or a distributed system composed of multiple physical servers, or can be configured as a cloud server that provides basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communications, middleware services, domain name services, security services, CDN, and big data and artificial intelligence platforms; the software can be an application that implements the web worker communication method, etc., but is not limited to the above forms.
[0080] The present application can be used in many general or special computer system environments or configurations. For example: personal computers, server computers, handheld or portable devices, tablet devices, multiprocessor systems, microprocessor-based systems, set-top boxes, programmable consumer electronics, network PCs, minicomputers, mainframe computers, distributed computing environments including any of the above systems or devices, etc. The present application can be described in the general context of computer-executable instructions executed by a computer, such as program modules. Generally, program modules include routines, programs, objects, components, data structures, etc. that perform specific tasks or implement specific abstract data types. The present application can also be practiced in distributed computing environments, in which tasks are performed by remote processing devices connected through a communication network. In a distributed computing environment, program modules can be located in local and remote computer storage media including storage devices.
[0081] It should be noted that in each specific implementation of the present application, when it comes to the need to perform relevant processing based on data related to user identity or characteristics such as user information, user behavior data, user historical data, and user location information, the user's permission or consent will be obtained first, and the collection, use, and processing of these data will comply with relevant laws, regulations, and standards. In addition, when the embodiment of the present application needs to obtain the user's sensitive personal information, the user's separate permission or consent will be obtained through a pop-up window or by jumping to a confirmation page. After clearly obtaining the user's separate permission or consent, the necessary user-related data for the normal operation of the embodiment of the present application will be obtained.
[0082] An embodiment of a web worker communication method provided by the present application is as follows:
[0083] Figure 1 is an optional flowchart of the web worker communication method provided in the embodiment of the present application. In addition, the relationship between the various steps of the web worker communication method embodiment is shown in FIG. Figure 1 Sure. Figure 1 The method may include but is not limited to steps S101 to S106.
[0084] Step S101, generating a call request for a worker thread, wherein the call request is used to request to call the worker thread to perform data processing;
[0085] Step S102, calling the proxy object corresponding to the worker thread according to the calling request, wherein the proxy object corresponding to the worker thread is obtained by wrapping the worker object of the worker thread through a wrapProxy function, and the wrapProxy function includes an apply function;
[0086] Step S103, sending the call request to the worker thread through the apply function, wherein the call request is carried in postMessage;
[0087] Step S104, monitoring the postMessage of the worker thread through the proxy object;
[0088] Step S105, obtaining the function execution result parsed by the proxy object from the postMessage of the worker thread.
[0089] Steps S101 to S105 shown in the embodiment of the present application, after generating a call request to a worker thread, call the proxy object corresponding to the worker thread according to the call request, wherein the proxy object corresponding to the worker thread is obtained by wrapping the worker object of the worker thread through the wrapProxy function, and the wrapProxy function includes an apply function; the call request is sent to the worker thread through the apply function, wherein the call request is carried in postMessage; the postMessage of the worker thread is monitored through the proxy object; and the function execution result parsed by the proxy object from the postMessage of the worker thread is obtained. It can be seen that the main thread can send tasks to the worker thread through the proxy object and receive the results processed by the worker thread, thereby solving the problem that the existing web worker communication method is cumbersome and unclear to use, and improving the communication efficiency of the webworker communication method.
[0090] It should be noted that the creation of a worker object depends on the worker object class template, and this application does not limit the specific type of the worker object class template.
[0091] In the embodiment of the present application, the class template of the worker object is defined as a class template with a postMessage function.
[0092] In the case of the web side, the worker object is created according to the first type of template, and the first type of template is the worker class of the web side;
[0093] In the case of nodejs, the worker object is created according to the second type of template;
[0094] Wherein, both the first type of template and the second type of template define a class of the postMessage function.
[0095] Due to cross-end differences, the worker classes on both the nodejs and web ends are different, that is, the class templates for creating worker objects on both ends are different. By comparing and analyzing the web end and nodejs, it is found that both ends have a reusable key function postMessage. In this way, the class template of the worker object is changed to a class template that defines the postMessage function. This general design method can make the communication method of function calls compatible with both the nodejs and web ends.
[0096] In step S101 of some embodiments, a call request is created, which includes the function name and function input parameters called by the main thread, and may also include data or tasks that need to be processed by the worker thread.
[0097] It should be noted that the call request can be a message or instruction sent by the main thread to the worker thread. This message contains the function name and function input parameters called by the main thread. The worker thread can be a background thread running in the browser that can execute tasks without blocking the main thread. It communicates with the main thread through postMessage.
[0098] In step S102 of some embodiments, a proxy object corresponding to the worker thread is used to represent the worker thread, so that the main thread can communicate with the worker thread by calling the proxy object. Among them, it is necessary to create a wrapProxy function, which receives the proxy object of "the worker object generated after the main thread creates the worker thread", and this proxy object can proxy the communication of the worker thread. The apply function is part of the wrapProxy function, which allows calling functions in the worker thread.
[0099] It should be noted that in JavaScript, a proxy object can be a proxy for creating an object, so as to perform custom operations when accessing the properties or methods of the object. In an embodiment of the present application, the proxy object is used to encapsulate the communication logic of the worker thread. In addition, it should be noted that for each worker thread created by the main thread, the main thread will create a proxy object corresponding to it, so that the main thread can call a worker thread by calling the proxy object of the worker thread.
[0100] The wrapProxy function can be a custom function used to create a proxy object for the worker thread. This proxy object can encapsulate the communication logic of the worker object, making the communication between the main thread and the worker thread more convenient and intuitive. The wrapProxy function can be a general function used to call the main thread.
[0101] See also Figure 2 In some embodiments, before step S102, the following steps may be performed, but are not limited to, steps S201 to S203:
[0102] Step S201, creating a main.js file, wherein the main.js file stores the main thread code;
[0103] Step S202, passing the file path of the worker.js of the worker thread into the new Worker function through the main.js file to generate a worker object of the worker thread;
[0104] Step S203, wrapping the worker object of the worker thread through the wrapProxy function to obtain the proxy object of the worker thread.
[0105] In step S201 of some embodiments, a JavaScript file named main.js is created, which will contain the code of the main thread.
[0106] In step S202 of some embodiments, in the main.js file, the new worker function is called to pass in the file path of the worker.js of the worker thread, and an object representing the worker thread, called a worker object, is returned.
[0107] In step S203 of some embodiments, the created wrapProxy function is called, wrapProxy(worker) is executed, the worker object is wrapped, and a Proxy object is generated. That is, the wrapProxy function is used to create a proxy object, which will proxy the communication and method calls of the worker object.
[0108] It should be noted that the main.js file can be the JavaScript file of the main thread, which is used to control the logic and interface of the page. The worker.js file, i.e. worker.js, can be the JavaScript file of the worker thread, which contains the code to be executed in the background. The new Worker function can be part of the Web Workers API, which is used to create a new worker thread. The worker object can be an object created by the new Worker function, which represents the worker thread.
[0109] In the steps S201 to S203 shown in the embodiment of the present application, a main.js file is created, and the main.js file stores the main thread code; the file path of the worker.js of the worker thread is passed into the new Worker function through the main.js file to generate the worker object of the worker thread; the worker object of the worker thread is wrapped by the wrapProxy function to obtain the proxy object of the worker thread. That is, the main thread simplifies the interaction with the worker thread by using new Worker to create the worker object of the worker thread in the main.js file, and using the wrapProxy function to obtain the proxy object. In this way, the main thread can call the function in the worker thread like calling a local function, without having to directly deal with the complexity of postMessage and onmessage. This mode can improve the readability and maintainability of the code, while allowing efficient communication between the main thread and the worker thread, thereby improving the performance and responsiveness of the application.
[0110] See also Figure 3 In some embodiments, step S203 may include but is not limited to steps S301 to S302:
[0111] Step S301, obtaining the worker object of the worker thread through the wrapProxy function;
[0112] Step S302, passing the worker object of the worker thread into the target function of the wrapProxy function, and rewriting the apply function of the wrapProxy function to obtain the proxy object of the worker thread.
[0113] In step S301 of some embodiments, inside the wrapProxy function, a worker object that has been created by new Worker is obtained, and this worker object represents a worker thread.
[0114] In step S302 of some embodiments, in the wrapProxy function, the worker object is passed as a parameter to the target function. The target function here is a function defined inside the wrapProxy function, which is used to process the worker object. In the wrapProxy function, the apply function is rewritten so that the apply function can process function calls to the worker object. That is, when the main thread tries to call a function in the worker thread, it actually calls the apply function. In other words, when a function of the wrapper object proxy (proxy object) is called, the apply function will be called.
[0115] It should be noted that the target function can be a function that processes a worker object. Among them, target can usually be a proxied object, that is, a worker object. In the wrapProxy function, the apply function can be used to intercept function calls. In the embodiment of the present application, the apply function is rewritten so that when the main thread calls a function in the worker thread, it can send a message to the worker thread through postMessage and process the returned result.
[0116] In the steps S301 to S302 shown in the embodiment of the present application, the worker object of the worker thread is obtained through the wrapProxy function; the worker object of the worker thread is passed into the target function of the wrapProxy function, and the apply function of the wrapProxy function is rewritten to obtain the proxy object of the worker thread. That is, the wrapProxy function creates a proxy object so that the main thread can call the method in the worker thread like calling a local function. This proxy object handles all the complex logic related to postMessage internally, making the main thread code more concise and easy to understand. Specifically, when the main thread tries to call the method in the worker thread, it actually calls the apply function rewritten in the wrapProxy function. This apply function sends the call request to the worker thread through postMessage and listens to the response of the worker thread. Once the worker thread processes the request and returns the result, i.e., the function execution result, through postMessage, the proxy object receives these messages, parses them into a format that the main thread can understand, and then returns them to the main thread. In this way, the main thread can handle the function execution result of the worker thread like the result of the local function call.
[0117] In step S103 of some embodiments, the apply function is used to send the call request to the worker thread. This request is usually sent via postMessage.
[0118] It should be noted that apply can be part of the wrapProxy function, which is used to call the function in the worker thread. It allows calling the function in the worker thread like calling a normal function.
[0119] In step S104 of some embodiments, the proxy object monitors the messages sent back by the worker thread, which are also sent via postMessage.
[0120] It should be noted that postMessage can be a Web API used to pass messages between the main thread and the worker thread.
[0121] In step S105 of some embodiments, the results returned by the worker thread after processing the request are obtained. These results are sent via postMessage of the worker thread, and then parsed by the proxy object and returned to the main thread.
[0122] Another web worker communication method embodiment provided by the present application is as follows:
[0123] In the above-mentioned embodiment, a web worker communication method is provided. In addition, the present application also provides another web worker communication method, which cooperates with the web worker communication method and is described below in conjunction with the accompanying drawings.
[0124] See also Figure 1 , Figure 1 This is an optional flowchart of the web worker communication method provided in the embodiment of the present application. Please refer to Figure 4 , Figure 4 This is another optional flowchart of the web worker communication method provided in an embodiment of the present application.
[0125] Since this embodiment cooperates with the method embodiment provided above, please refer to the corresponding description of the method embodiment above when reading the content of this embodiment.
[0126] The web worker communication method provided in the embodiment of the present application is applied to a first worker thread, and the first worker thread can be any worker thread among the worker threads created by the main thread.
[0127] Figure 4 The method may include but is not limited to steps S401 to S405:
[0128] Step S401, receiving a call request sent by a main thread, wherein the call request is used to request to call a worker thread to perform data processing;
[0129] Step S402, calling the export function, packaging the first worker thread through the export function, and obtaining the first monitoring object corresponding to the first worker thread;
[0130] Step S403, monitoring the call request through the first monitoring object;
[0131] Step S404, when the call request contains the name of the first function of the first worker thread, executing the first function to obtain a function execution result of the first function;
[0132] Step S405: Send the function execution result to the main thread through the first monitoring object, wherein the execution result is carried in postMessage.
[0133] In step S401 of some embodiments, the worker thread receives a call request from the main thread. The request may include the function name and function input parameters called by the main thread, and may also include data or tasks that need to be processed by the worker thread.
[0134] In step S402 of some embodiments, in the worker thread, the export function is used to package the first worker thread. At the same time, the export function returns a monitoring object, namely the first monitoring object, so as to be able to monitor and respond to the call request of the main thread. That is, a worker.js file is created to put the sub-thread code, and an object of functions and attribute values exposed by the sub-thread is defined, which is named object interface (workerApi). If the object interface contains the function that the main thread needs to call. Then introduce the created export function, execute export(selft, workerApi), and get the first monitoring object.
[0135] It should be noted that the export function can be a function defined in the worker thread, which is used to wrap the worker thread so that it can listen to and respond to the call request of the main thread. The export function can be a general function for the child thread to call.
[0136] In step S403 of some embodiments, a first monitoring object is used to monitor the call request sent by the main thread.
[0137] It should be noted that the first monitoring object can be the object returned by the export function, which is responsible for monitoring the call request of the main thread and triggering the corresponding operation when the request arrives. The first monitoring object can be a new object generated by the global object after the export function is called, which is packaged by the export function. In addition, it should be noted that for a worker thread, there is only one corresponding monitoring object.
[0138] In step S404 of some embodiments, when the monitoring object receives a call request containing a specific function name (the name of the first function of the first worker thread), the worker thread will execute the corresponding function. After executing the function, the worker thread will obtain the execution result of the function.
[0139] It should be noted that the first function may be a function defined in a worker thread, and is used to process tasks or data sent by the main thread.
[0140] Steps S401 to S405 shown in the embodiment of the present application are as follows: receiving a call request sent by the main thread, the call request is used to request calling a worker thread for data processing; calling the export function, packaging the first worker thread through the export function, and obtaining the first listening object corresponding to the first worker thread; monitoring the call request through the first listening object; in the case of monitoring the name of the first function of the first worker thread contained in the call request, executing the first function to obtain the function execution result of the first function; sending the function execution result to the main thread through the first listening object, wherein the execution result is carried in postMessage. That is, when the main thread sends a call request through postMessage, the listening object of the worker thread will receive this request and execute the corresponding function according to the function name in the request. After execution, the worker thread sends the result back to the main thread through postMessage, and the main thread can receive and process these results. In this way, the communication between the main thread and the worker thread becomes simple and the efficiency is improved.
[0141] See also Figure 5 In some embodiments, step S403 may include but is not limited to steps S501 to S502:
[0142] Step S501, obtaining the global object and object interface of the first worker thread through the export function of the first monitoring object;
[0143] Step S502, monitoring the call request through the global object;
[0144] In some embodiments, before step S404, the steps may include but are not limited to step S503:
[0145] Step S503: Bind the name of the first function to the object interface.
[0146] In step S501 of some embodiments, in the worker thread, the export function of the first listening object is used to obtain the global object (usually self) and object interface of the first worker thread, which define the functions and properties that the worker thread can expose to the main thread.
[0147] In step S502 of some embodiments, a listener is set using the global object of the first worker thread to listen to the call request sent by the main thread.
[0148] In step S503 of some embodiments, before executing the first function, the first function name is bound to the object interface, which means that the first function in the worker thread can be called by the main thread.
[0149] It should be noted that the export function can also be used to obtain the global object and object interface of the worker thread. In Web Workers, the global object can be self, which represents the global context of the worker thread and can access all variables and functions in the worker thread.
[0150] The object interface may be an interface that defines the functions and properties that the worker thread can expose to the main thread. Through this interface, the main thread can call specific functions in the worker thread.
[0151] In the steps S501 to S503 shown in the embodiment of the present application, the global object and object interface of the first worker thread are obtained through the export function of the first monitoring object; the call request is monitored through the global object; when the call request contains the name of the first function of the first worker thread, before the execution of the first function, the method further includes: binding the name of the first function to the object interface. That is, when the main thread needs the worker thread to execute a function, it will send a call request containing the function name. After the global object of the worker thread monitors this request, it obtains the object interface through the export function, and binds the function name to the object interface before executing the function. In this way, when the request is processed, the worker thread knows which function to execute and can perform the corresponding operation. After the execution is completed, the worker thread can send the result back to the main thread through postMessage. In this way, the call request sent by the main thread is monitored by the global object of the worker thread, and then the worker thread binds the function name to the object interface so that these functions can be called by the main thread. This design makes the communication and function call between the main thread and the worker thread flexible and efficient.
[0152] In step S405 of some embodiments, the execution result of the function is sent back to the main thread through the first monitoring object, wherein the execution result of the function is sent back to the main thread through the postMessage method.
[0153] It should be noted that postMessage can be a method in the Web Workers API, which is used to pass messages between the main thread and the worker thread.
[0154] An embodiment of a web worker communication device provided by the present application is as follows:
[0155] In the above-mentioned embodiment, a web worker communication method is provided. Correspondingly, the present application also provides a device for implementing message communication based on web worker, which is described below in conjunction with the accompanying drawings.
[0156] See also Figure 6 , which shows a schematic diagram of an embodiment of a web worker communication device provided by the present application.
[0157] Since the device embodiment corresponds to the method embodiment provided above, please refer to the corresponding description of the method embodiment above when reading the content of this embodiment. The device embodiment described below is only illustrative.
[0158] The present application provides a web worker communication device, including:
[0159] A generating module 601 is used to generate a calling request for a worker thread, wherein the calling request is used to request to call the worker thread to perform data processing;
[0160] A calling proxy object module 602 is used to call the proxy object corresponding to the worker thread according to the calling request, wherein the proxy object corresponding to the worker thread is obtained by wrapping the worker object of the worker thread through a wrapProxy function, and the wrapProxy function includes an apply function;
[0161] A call request sending module 603 is used to send the call request to the worker thread through the apply function, wherein the call request is carried in postMessage;
[0162] A proxy object monitoring module 604, used to monitor the postMessage of the worker thread through the proxy object;
[0163] The function execution result acquisition module 605 is used to acquire the function execution result parsed by the proxy object from the postMessage of the worker thread.
[0164] In some embodiments, the calling proxy object module 602 includes:
[0165] Create a main.js file, which stores the main thread code;
[0166] The file path of the worker.js of the worker thread is passed into the newWorker function through the main.js file to generate a worker object of the worker thread;
[0167] The worker object of the worker thread is wrapped by the wrapProxy function to obtain the proxy object of the worker thread.
[0168] In some embodiments, wrapping the worker object of the worker thread by the wrapProxy function to obtain the proxy object of the worker thread includes:
[0169] Obtain the worker object of the worker thread through the wrapProxy function;
[0170] The worker object of the worker thread is passed into the target function of the wrapProxy function, and the apply function of the wrapProxy function is rewritten to obtain the proxy object of the worker thread.
[0171] In some embodiments, the web worker communication device includes:
[0172] The class template of the worker object is a class template that defines a postMessage function.
[0173] See also Figure 7 , which shows a schematic diagram of another web worker communication device embodiment provided by the present application.
[0174] Since the another web worker communication device embodiment provided in this application corresponds to the another web worker communication method embodiment provided above, please refer to the corresponding description of the another web worker communication method embodiment provided above when reading the content of this embodiment. The device embodiment described below is only illustrative.
[0175] The present application provides another web worker communication device, including:
[0176] The receiving module 701 is used to receive a call request sent by the main thread, where the call request is used to request to call a worker thread to perform data processing;
[0177] Calling the export function module 702, which is used to call the export function, and wrap the first worker thread through the export function to obtain the first monitoring object corresponding to the first worker thread;
[0178] A first monitoring object module 703, configured to monitor the call request through the first monitoring object;
[0179] An execution module 704 is used to execute the first function and obtain a function execution result of the first function when monitoring that the call request includes the name of the first function of the first worker thread;
[0180] The function execution result sending module 705 is used to send the function execution result to the main thread through the first monitoring object, wherein the execution result is carried in postMessage.
[0181] In some embodiments, the first monitoring object module 703 includes:
[0182] Obtaining the global object and object interface of the first worker thread through the export function of the first monitoring object;
[0183] Monitoring the call request through the global object;
[0184] In the case where the call request contains the name of the first function of the first worker thread, before executing the first function, the method further includes:
[0185] The name of the first function is bound to the object interface.
[0186] The embodiment of the present application also provides an electronic device, which can be any intelligent terminal including a tablet computer, a car computer, etc. The electronic device includes a memory and a processor, the memory stores a computer program, and the processor implements the above-mentioned web worker communication method when executing the computer program:
[0187] Generate a call request to a worker thread, wherein the call request is used to request to call the worker thread to perform data processing;
[0188] According to the calling request, calling the proxy object corresponding to the worker thread, wherein the proxy object corresponding to the worker thread is obtained by wrapping the worker object of the worker thread through a wrapProxy function, and the wrapProxy function includes an apply function;
[0189] Sending the call request to the worker thread through the apply function, wherein the call request is carried in postMessage;
[0190] Monitor the postMessage of the worker thread through the proxy object;
[0191] Get the function execution result parsed by the proxy object from the postMessage of the worker thread.
[0192] In some embodiments, before the step of calling the proxy object corresponding to the worker thread according to the calling request, the method further includes:
[0193] Create a main.js file, which stores the main thread code;
[0194] The file path of the worker.js of the worker thread is passed into the newWorker function through the main.js file to generate a worker object of the worker thread;
[0195] The worker object of the worker thread is wrapped by the wrapProxy function to obtain the proxy object of the worker thread.
[0196] In some embodiments, wrapping the worker object of the worker thread by the wrapProxy function to obtain the proxy object of the worker thread includes:
[0197] Obtain the worker object of the worker thread through the wrapProxy function;
[0198] The worker object of the worker thread is passed into the target function of the wrapProxy function, and the apply function of the wrapProxy function is rewritten to obtain the proxy object of the worker thread.
[0199] In some embodiments, the class template of the worker object is a class template defining a postMessage function.
[0200] The electronic device includes a memory and a processor, the memory stores a computer program, and the processor implements the above-mentioned another web worker communication method when executing the computer program:
[0201] Receive a call request sent by the main thread, where the call request is used to request to call a worker thread to process data;
[0202] Calling the export function, packaging the first worker thread through the export function, and obtaining the first monitoring object corresponding to the first worker thread;
[0203] Monitoring the call request through the first monitoring object;
[0204] In a case where the call request contains the name of the first function of the first worker thread, executing the first function to obtain a function execution result of the first function;
[0205] The function execution result is sent to the main thread through the first monitoring object, wherein the execution result is carried in postMessage.
[0206] In some embodiments, monitoring the call request through the first monitoring object includes:
[0207] Obtaining the global object and object interface of the first worker thread through the export function of the first monitoring object;
[0208] Monitoring the call request through the global object;
[0209] In the case where the call request contains the name of the first function of the first worker thread, before executing the first function, the method further includes:
[0210] The name of the first function is bound to the object interface.
[0211] See also Figure 8 , Figure 8 The hardware structure of an electronic device of another embodiment is illustrated, and the electronic device includes:
[0212] The processor 801 may be implemented by a general-purpose CPU (Central Processing Unit), a microprocessor, an application-specific integrated circuit (Application Specific Integrated Circuit, ASIC), or one or more integrated circuits, and is used to execute relevant programs to implement the technical solutions provided in the embodiments of the present application;
[0213] The memory 802 can be implemented in the form of a read-only memory (ROM), a static storage device, a dynamic storage device, or a random access memory (RAM). The memory 802 can store an operating system and other applications. When the technical solution provided in the embodiment of this specification is implemented by software or firmware, the relevant program code is stored in the memory 802, and the processor 801 calls and executes the webworker communication method of the embodiment of this application;
[0214] Input / output interface 803, used to implement information input and output;
[0215] The communication interface 804 is used to realize the communication interaction between the device and other devices. The communication can be realized through a wired manner (such as USB, network cable, etc.) or a wireless manner (such as mobile network, WI FI, Bluetooth, etc.);
[0216] A bus 805 that transmits information between the various components of the device (e.g., the processor 801, the memory 802, the input / output interface 803, and the communication interface 804);
[0217] The processor 801 , the memory 802 , the input / output interface 803 and the communication interface 804 are connected to each other in communication within the device via a bus 805 .
[0218] An embodiment of the present application also provides a computer-readable storage medium, which stores a computer program, and when the computer program is executed by a processor, the above-mentioned web worker communication method is implemented.
[0219] The memory, as a non-transient computer-readable storage medium, can be used to store non-transient software programs and non-transient computer executable programs. In addition, the memory may include a high-speed random access memory, and may also include a non-transient memory, such as at least one disk storage device, a flash memory device, or other non-transient solid-state storage device. In some embodiments, the memory may optionally include a memory remotely disposed relative to the processor, and these remote memories may be connected to the processor via a network. Examples of the above-mentioned network include, but are not limited to, the Internet, an intranet, a local area network, a mobile communication network, and combinations thereof.
[0220] The web worker communication method, web worker communication device, electronic device and storage medium provided by the embodiment of the present application, after generating a call request to a worker thread, calls the proxy object corresponding to the worker thread according to the call request, wherein the proxy object corresponding to the worker thread is obtained by wrapping the worker object of the worker thread through the wrapProxy function, and the wrapProxy function includes an apply function; the call request is sent to the worker thread through the apply function, wherein the call request is carried in postMessage; the postMessage of the worker thread is monitored through the proxy object; and the function execution result parsed by the proxy object from the postMessage of the worker thread is obtained. It can be seen that the main thread can send tasks to the worker thread through the proxy object and receive the results processed by the worker thread, thereby solving the problem that the existing web worker communication method is cumbersome and unclear to use, and improving the communication efficiency of the web worker communication method.
[0221] The embodiments described in the embodiments of the present application are intended to more clearly illustrate the technical solutions of the embodiments of the present application and do not constitute a limitation on the technical solutions provided in the embodiments of the present application. Those skilled in the art will appreciate that with the evolution of technology and the emergence of new application scenarios, the technical solutions provided in the embodiments of the present application are also applicable to similar technical problems.
[0222] Those skilled in the art will appreciate that the technical solutions shown in the figures do not constitute a limitation on the embodiments of the present application, and may include more or fewer steps than shown in the figures, or a combination of certain steps, or different steps.
[0223] The device embodiments described above are merely illustrative, and the units described as separate components may or may not be physically separated, that is, they may be located in one place or distributed on multiple network units. Some or all of the modules may be selected according to actual needs to achieve the purpose of the solution of this embodiment.
[0224] Those skilled in the art will appreciate that all or some of the steps in the methods disclosed above, and the functional modules / units in the systems and devices may be implemented as software, firmware, hardware, or a suitable combination thereof.
[0225] The terms "first", "second", "third", "fourth", etc. (if any) in the specification of the present application and the above-mentioned drawings are used to distinguish similar objects, and are not necessarily used to describe a specific order or sequence. It should be understood that the data used in this way can be interchangeable where appropriate, so that the embodiments of the present application described herein can be implemented in an order other than those illustrated or described herein. In addition, the terms "including" and "having" and any of their variations are intended to cover non-exclusive inclusions, for example, a process, method, system, product or device comprising a series of steps or units is not necessarily limited to those steps or units clearly listed, but may include other steps or units that are not clearly listed or inherent to these processes, methods, products or devices.
[0226] It should be understood that in the present application, "at least one (item)" means one or more, and "plurality" means two or more. "And / or" is used to describe the association relationship of associated objects, indicating that three relationships may exist. For example, "A and / or B" can mean: only A exists, only B exists, and A and B exist at the same time, where A and B can be singular or plural. The character " / " generally indicates that the objects associated before and after are in an "or" relationship. "At least one of the following" or similar expressions refers to any combination of these items, including any combination of single or plural items. For example, at least one of a, b or c can mean: a, b, c, "a and b", "a and c", "b and c", or "a and b and c", where a, b, c can be single or multiple.
[0227] In the several embodiments provided in the present application, it should be understood that the disclosed devices and methods can be implemented in other ways. For example, the device embodiments described above are only schematic. For example, the division of the above units is only a logical function division. There may be other division methods in actual implementation, such as multiple units or components can be combined or integrated into another system, or some features can be ignored or not executed. Another point is that the mutual coupling or direct coupling or communication connection shown or discussed can be through some interfaces, indirect coupling or communication connection of devices or units, which can be electrical, mechanical or other forms.
[0228] The units described above as separate components may or may not be physically separated, and the components shown as units may or may not be physical units, that is, they may be located in one place or distributed on multiple network units. Some or all of the units may be selected according to actual needs to achieve the purpose of the solution of this embodiment.
[0229] In addition, each functional unit in each embodiment of the present application may be integrated into one processing unit, or each unit may exist physically separately, or two or more units may be integrated into one unit. The above-mentioned integrated unit may be implemented in the form of hardware or in the form of software functional units.
[0230] If the integrated unit is implemented in the form of a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of the present application, or the part that contributes to the prior art, or all or part of the technical solution can be embodied in the form of a software product, and the computer software product is stored in a storage medium, including multiple instructions to enable a computer device (which can be a personal computer, server, or network device, etc.) to execute all or part of the steps of the methods of various embodiments of the present application. The aforementioned storage medium includes: U disk, mobile hard disk, read-only memory (Read-Only Memory, referred to as ROM), random access memory (Random Access Memory, referred to as RAM), disk or optical disk and other media that can store programs.
[0231] The preferred embodiments of the present invention are described above with reference to the accompanying drawings, but the scope of the rights of the present invention is not limited thereto. Any modification, equivalent substitution and improvement made by a person skilled in the art without departing from the scope and essence of the present invention should be within the scope of the rights of the present invention.
Claims
1. A web worker communication method, applied to the main thread, characterized in that: The method comprises: Generate a call request to a worker thread, wherein the call request is used to request to call the worker thread to perform data processing; According to the calling request, calling the proxy object corresponding to the worker thread, wherein the proxy object corresponding to the worker thread is obtained by wrapping the worker object of the worker thread through the wrapProxy function, and the wrapProxy function includes an apply function; Sending the call request to the worker thread through the apply function, wherein the call request is carried in postMessage; Monitor the postMessage of the worker thread through the proxy object; Get the function execution result parsed by the proxy object from the postMessage of the worker thread.
2. The method according to claim 1, characterized in that Before the step of calling the proxy object corresponding to the worker thread according to the calling request, the method further includes: Create a main.js file, which stores the main thread code; The file path of the worker.js of the worker thread is passed into the new Worker function through the main.js file to generate a worker object of the worker thread; The worker object of the worker thread is wrapped by the wrapProxy function to obtain the proxy object of the worker thread.
3. The method according to claim 2, characterized in that The wrapping of the worker object of the worker thread by the wrapProxy function to obtain the proxy object of the worker thread includes: Obtain the worker object of the worker thread through the wrapProxy function; The worker object of the worker thread is passed into the target function of the wrapProxy function, and the apply function of the wrapProxy function is rewritten to obtain the proxy object of the worker thread.
4. According to the method of claim 1, the class template of the worker object is a class template defining a postMessage function.
5. A web worker communication method, applied to a first worker thread, characterized in that: The method comprises: Receive a call request sent by the main thread, where the call request is used to request to call a worker thread to process data; Calling the export function, packaging the first worker thread through the export function, and obtaining the first monitoring object corresponding to the first worker thread; Monitoring the call request through the first monitoring object; In a case where the call request contains the name of the first function of the first worker thread, executing the first function to obtain a function execution result of the first function; The function execution result is sent to the main thread through the first monitoring object, wherein the execution result is carried in postMessage.
6. The method according to claim 5, characterized in that The monitoring the call request through the first monitoring object includes: Obtaining the global object and object interface of the first worker thread through the export function of the first monitoring object; Monitoring the call request through the global object; In the case where the call request contains the name of the first function of the first worker thread, before executing the first function, the method further includes: The name of the first function is bound to the object interface.
7. A web worker communication device, characterized in that: The device comprises: A generating module, used to generate a calling request to a worker thread, wherein the calling request is used to request to call the worker thread to perform data processing; A calling proxy object module, used to call the proxy object corresponding to the worker thread according to the calling request, wherein the proxy object corresponding to the worker thread is obtained by wrapping the worker object of the worker thread through a wrapProxy function, and the wrapProxy function includes an apply function; A calling request sending module, used for sending the calling request to the worker thread through the apply function, wherein the calling request is carried in postMessage; A proxy object monitoring module, used to monitor the postMessage of the worker thread through the proxy object; The function execution result acquisition module is used to obtain the function execution result parsed by the proxy object from the postMessage of the worker thread.
8. A web worker communication device, characterized in that: The device comprises: A receiving module is used to receive a call request sent by the main thread, wherein the call request is used to request to call a worker thread to perform data processing; Calling an export function module, which is used to call the export function, packaging the first worker thread through the export function, and obtaining a first monitoring object corresponding to the first worker thread; A first monitoring object module, used for monitoring the call request through the first monitoring object; an execution module, configured to execute the first function and obtain a function execution result of the first function when monitoring that the call request includes the name of the first function of the first worker thread; The function execution result sending module is used to send the function execution result to the main thread through the first monitoring object, wherein the execution result is carried in postMessage.
9. An electronic device, characterized in that: The electronic device includes a memory and a processor, the memory stores a computer program, and the processor implements the webworker communication method described in any one of claims 1 to 6 when executing the computer program.
10. A computer-readable storage medium storing a computer program, characterized in that: When the computer program is executed by a processor, the web worker communication method according to any one of claims 1 to 6 is implemented.