Component application method based on electron application

Abstract

The application discloses a component application method based on an Electron application, comprising the following steps: loading each component in a resource directory of the Electron application; obtaining a method object corresponding to an exported method of a main process of each component; and mounting the method object on a preset object of the Electron application, so that the Electron application can call the method object.

Description

Technical Field

[0001] This application relates to the field of Electron client development technology, and in particular to a component application method based on Electron applications. Background Technology

[0002] Electron is a framework for building desktop applications using Javascript, HTML, and CSS. It embeds the Chromium browser engine and a Node.js environment, offering cross-platform compatibility and allowing developers to quickly implement native client applications using web development technologies. Currently, many desktop applications are built on the Electron framework to adapt to domestic operating systems. As application scenarios become increasingly diverse, it's necessary to break down different modules of the application into different components to facilitate business decoupling and on-demand combination.

[0003] Currently, Electron applications do not provide a universal solution for integrating components (or plugins). Some developers have proposed directly importing all components, which leads to problems such as strong coupling between the application and plugins and bloated applications.

[0004] How to introduce different components into Electron applications to customize product development for users who require different component modules, thereby improving component reusability, reducing coupling between Electron applications and components, and increasing the efficiency of component application, is a technical problem that needs to be solved. Summary of the Invention

[0005] The purpose of this application is to provide a component application method based on Electron applications to solve the problem of low efficiency in component application of Electron applications.

[0006] To solve the above-mentioned technical problems, this specification is implemented as follows:

[0007] Firstly, a component application method based on Electron applications is provided, including:

[0008] Load the components from the Electron application's resource directory;

[0009] Retrieve the method objects exported by the main process of each component;

[0010] The method object is attached to a preset object of the Electron application so that the Electron application can call it.

[0011] Optionally, the components in the resource directory of the Electron application include:

[0012] Introduce the main process script code for loading components into the main process code of the Electron application;

[0013] Based on the code in the main process script used to load the component, the main process of the Electron application is triggered to scan the corresponding resource file paths in the resource directory;

[0014] The main process of the Electron application scans and loads the components under the resource file path.

[0015] Optionally, the step of loading the components under the resource file path through scanning by the main process of the Electron application includes:

[0016] By scanning the main process of the Electron application, the relevant code and configuration files of each component under the resource file path are found;

[0017] Based on the configuration file, the target components that need to be loaded are determined by the main process of the Electron application;

[0018] The main process of the Electron application stores the relevant code and configuration files of the target component.

[0019] Optionally, the code and configuration files for a component can be packaged into an asar package.

[0020] The step of scanning the main process of the Electron application to find the relevant code and configuration files of each component under the resource file path includes:

[0021] By scanning the main process of the Electron application, the asar package under the resource file path is located to find the relevant code and configuration files of the corresponding components.

[0022] Optionally, the component's configuration file includes the component name, component ID, and the relative path to the component's main process entry point code.

[0023] The process of determining the target components to be loaded based on the configuration file through the main process of the Electron application includes:

[0024] By determining whether the configuration file in the target asar package carries the component name, it can be determined whether the target asar package is the asar package of the component;

[0025] If so, the component ID in the configuration file of the target asar package is matched with the preset trusted component ID list;

[0026] If a match is found, the component corresponding to the target asar package will be identified as the target component to be loaded.

[0027] Optionally, obtaining the method objects exported by the main process of each component includes:

[0028] Based on the relative path of the main process entry code of the component in the configuration file, the main process entry code of the target component is executed through the main process of the Electron application, so as to export the method object corresponding to the target component through the main process of the target component.

[0029] Optionally, attaching the method object to a preset object of the Electron application includes:

[0030] Using the component name of the target component as the key and the method object exported by the main process of the target component as the value, the method object exported by the main process of the Electron application is mounted onto the preset object of the Electron application through the main process of the Electron application.

[0031] Optionally, it also includes:

[0032] When the Electron application launches a new window, load the preload scripts for each component;

[0033] During the rendering process, the preload scripts of each loaded component are invoked.

[0034] Optionally, loading the preload scripts for each component when the Electron application launches a new window includes:

[0035] Incorporate preload script code for loading components into the preload script code of the Electron application;

[0036] When the Electron application launches a new window, the preloading script of the Electron application is triggered to load the preloading scripts of each component based on the code of the preloading script used to load the components.

[0037] Optionally, the invocation of preloading scripts based on the loaded components during the rendering process includes:

[0038] During the rendering process, the method objects carried in the preload scripts of the loaded components are called through the rendering process of the Electron application.

[0039] In this embodiment, by loading the components in the resource directory of the Electron application, obtaining the method objects exported by the main process of each component, and attaching the method objects to the preset objects of the Electron application for the Electron application to call, the existing components in the resource directory of the Electron application can be used to decouple and combine component functions without modifying too much code. This meets the needs of different users to achieve free and customized product development, improves component reusability, reduces the coupling between the Electron application and the components, and improves the efficiency of component application. Attached Figure Description

[0040] The accompanying drawings, which are included to provide a further understanding of this application and form part of this application, illustrate exemplary embodiments and are used to explain this application, but do not constitute an undue limitation of this application. In the drawings:

[0041] Figure 1 This is a flowchart illustrating the component application method based on an Electron application according to an embodiment of this application.

[0042] Figure 2 This is a schematic diagram of the corresponding functions of the Electron application in an embodiment of this application.

[0043] Figure 3 This is a schematic diagram of the application architecture of the Electron application and its corresponding components according to an embodiment of this application.

[0044] Figure 4 This is a schematic diagram of the overall process of the component application method based on an Electron application according to an embodiment of this application.

[0045] Figure 5 This is a structural block diagram of a component application device based on an Electron application according to an embodiment of this application. Detailed Implementation

[0046] The technical solutions of the embodiments of this application will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of this application, not all embodiments. Based on the embodiments of this application, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of this application. The drawing numbers in this application are only used to distinguish the various steps in the solution and are not used to limit the execution order of the various steps. The specific execution order is subject to the description in the specification.

[0047] To address the problems existing in the prior art, this application provides a component application method based on an Electron application, assuming a development scenario involving the integration of multiple components within the Electron framework. Figure 1 As shown, it includes steps 12 to 16.

[0048] Step 12: Load the components from the Electron application's resource directory.

[0049] The components (i.e. application components) in the embodiments of this application refer to an independent functional unit in an Electron application, which typically includes code, styles and configuration information related to the interface or business logic. The purpose of the component design is to promote the maintainability and reusability of the code.

[0050] The Electron application loading component can be provided as a JavaScript utility library, including main process functionality. Specifically, loading components in the Electron application's resource directory includes: including main process script code for loading components in the Electron application's main process code; triggering the Electron application's main process to scan the corresponding resource file paths in the resource directory based on the main process script code for loading components; and loading the components under the resource file paths through the scan by the Electron application's main process.

[0051] In this embodiment, code for loading components can be introduced at the beginning of the Electron application's main process code. By modifying the main process code, the Electron application's main process can automatically scan the Electron application's resource directory for available components after startup, based on the introduced code. By scanning the corresponding resource file paths in the resource directory, the corresponding components can be found and loaded.

[0052] Loading components mainly involves obtaining data related to each component under the corresponding resource file path to facilitate subsequent component calls. Specifically, loading each component under the resource file path through scanning by the main process of the Electron application includes: searching for the relevant code and configuration files of each component under the resource file path through scanning by the main process of the Electron application; determining the target component to be loaded based on the configuration file through the main process of the Electron application; and storing the relevant code and configuration files of the target component through the main process of the Electron application.

[0053] The Electron application's main process scans the resource file paths in the resource directory to find existing components. Once a component is found, it reads the component's related code and configuration files. The related code includes the component's main process code, preloading code, rendering process code, etc. The component's configuration file contains configuration information that can be recognized by the Electron application's main process so that the Electron application's main process can automatically identify loadable components.

[0054] Optionally, the relevant code and configuration files of a component are packaged into an asar package. The step of scanning the resource file path by the main process of the Electron application to find the relevant code and configuration files of each component includes: scanning the resource file path by the main process of the Electron application to find the asar package to find the relevant code and configuration files of the corresponding component.

[0055] The components in this application embodiment are provided in the form of an asar package. Each component in this application embodiment can be considered an independent Electron application. Since Electron applications can load and read asar packages, components can be packaged into asar packages. During packaging, the main process code, preloading code, rendering process code, and configuration files of a component are packaged together into an asar package. Using a package filename other than that of the Electron application, the code within the asar package can be read and executed in the Electron application.

[0056] When packaging components, the following points should be noted. First, in order to reduce the size of the component's asar package, it is not necessary to package the third-party libraries that the component depends on during development. Only the component's main process code, preloading code, rendering process code, and configuration files need to be packaged into the asar package.

[0057] For binary files, node-addon files can usually be packaged into an asar file for direct use. For exe and dll files, the following three strategies can be used: 1. Package the binary file into an asar file and extract it to the asar unpacking directory. The final component package consists of a single file and a single folder. 2. Package the binary file into an asar file, and then copy the binary file to another location on the system for the Electron application to use at runtime. The component package consists of a single file. 3. Do not package the binary file into an asar file. Download the binary file from the network to another location on the system at runtime. This method is similar to the second one, but the component package size is smaller, and an internet connection is required for normal execution.

[0058] In addition, although the component's asar package provides some source code protection, it is still possible for someone to crack it using asar unpacking tools. Therefore, when packaging the component, the source code can be further obfuscated and the asar package can be encrypted to increase the difficulty of cracking.

[0059] By packaging component data into an .asar file, the component can be deployed as a single .asar file, ensuring that the core code of the component is not stolen or tampered with. This reduces the size of the component package and facilitates distribution. Furthermore, it conforms to the operating specifications of Electron applications, makes it easy to configure environment variables, and reduces conflicts caused by different system environments.

[0060] In response, the main process of an Electron application can automatically scan the various asar packages under the resource file path during scanning, automatically identify loadable components, parse the asar packages, and obtain the relevant code and configuration files of the loadable components.

[0061] In addition, to prevent disguised components from attacking Electron applications and to ensure the security of component calls, the components that need to be loaded can be verified after obtaining the component configuration file.

[0062] The component's configuration file includes the component name, component ID, and the relative path of the component's main process entry code. The step of determining the target component to be loaded based on the configuration file, through the main process of the Electron application, includes: determining whether the target asar package is a component's asar package by judging whether the configuration file in the target asar package carries the component name; if so, matching the component ID in the target asar package's configuration file with a preset trusted component ID list; if the match is successful, determining the component corresponding to the target asar package as the target component to be loaded.

[0063] This application embodiment specifies the component configuration information, which needs to be configured in a configuration file such as package.json. The component configuration information is as follows:

[0064] { ...,

[0065] “componentMeta”: {

[0066] "name": "Component Name"

[0067] "description": Component description,

[0068] "version": "Component version number"

[0069] "id": Component ID

[0070] "main": "Relative path to the main process entry point code of the component"

[0071] "preload": Relative path to the entry point code of the component preloading script

[0072] }, ...

[0073] }

[0074] Here, componentMeta is the name of the component's configuration file, and the relative path of the component's preloading script entry code will be described in the examples below.

[0075] As described above, Electron applications can load and read asar packages. In this embodiment, after obtaining an asar package, the main process of the Electron application needs to parse the asar package to obtain the corresponding configuration file. Then, it determines whether the asar package is a component's asar package by checking if the configuration file records the component name. If so, it needs to verify the component ID in the configuration file corresponding to the asar package. During verification, it can be matched against a pre-set list of trusted component IDs. If a match is successful, it means that the component in the asar package is a trusted component ID; if no match is found, it means that the component in the asar package may be a fake component, and the main process of the Electron application will not load the asar package.

[0076] For trusted component IDs, the main process code entry path of the component in the configuration file is parsed out and stored in memory along with the component's configuration file.

[0077] Only components with trusted component IDs can be loaded by the application. In this embodiment, the component IDs need to be kept confidential, and additional verification methods can be added if necessary. The main process of the Electron application can set the list of trusted component IDs by calling the setTrustIds(ids) method. The above method of loading components has the advantage of high security, as only components with trusted IDs will be loaded and executed, ensuring the security of the application.

[0078] Regarding component development specifications, if there are multiple components in a project, these components may use the same Application Programming Interface (API) name or listen on the same Inter-Process Communication (IPC) channel. To avoid these problems, component development should pay attention to namespace issues and use API names and IPC channels that are different from those of other components.

[0079] Once the component is developed, you can provide interface definitions or development documentation in languages ​​such as TypeScript, allowing developers to easily integrate the component.

[0080] Step 14: Obtain the method objects exported by the main process of each component.

[0081] After loading the corresponding component through step 12, the method objects under the component are further obtained from the loaded component. Specifically, obtaining the method objects exported by the main process of each component includes: based on the relative path of the main process entry code of the component in the configuration file, executing the main process entry code of the target component through the main process of the Electron application, so as to export the method objects corresponding to the target component through the main process of the target component.

[0082] The Electron application's main process executes the component's main process entry code based on the relative path of the component's main process entry code. This allows the component's main process to export the corresponding component's method objects and provide them to the Electron application's main process.

[0083] Step 16: Attach the method object to a preset object of the Electron application so that the Electron application can call it.

[0084] After obtaining the method object of the corresponding component through step 14, it is further mounted onto the object of the Electron application, that is, stored in the Electron application, so that the main process of the Electron application can call the method object of the mounted component from the object.

[0085] Optionally, the step of attaching the method object to a preset object of the Electron application includes: using the component name of the target component as the key and the method object exported by the main process of the target component as the value, and attaching the method object exported by the main process of the Electron application to the preset object of the Electron application through the main process of the Electron application.

[0086] The Electron application's main process can store the method objects exported by the component's main process as key-value pairs, with the component name as the key and the component's method object as the value, onto an Electron application object. This object storing the component key-value pairs is a non-exposed object, and different component method objects can be implemented by defining variables. Different keys represent different components, and different values ​​represent different method objects; the same key can correspond to multiple different values. Therefore, by using different key-value pairs, method objects from multiple components that need to be loaded can be attached to the Electron application object for the Electron application to call.

[0087] To meet different user needs, Electron applications can select the required components from the mounted components to create customized products.

[0088] The mounted components are existing components in the Electron application's resource directory. Therefore, component functionality can be decoupled and combined, as well as customized, without requiring much code modification. This improves component reusability, reduces coupling between the Electron application and the components, and increases the efficiency of component application.

[0089] To improve the security of component calls in the rendering process of an Electron application, in one embodiment, the method further includes: loading preloaded scripts for each component when the Electron application starts a new window; and making calls based on the loaded preloaded scripts for each component during the rendering process.

[0090] Specifically, when the Electron application launches a new window, loading the preloading scripts of each component includes: introducing code for loading the preloading scripts of the components into the preloading script code of the Electron application; and, when the Electron application launches a new window, triggering the Electron application's preloading script to load the preloading scripts of each component based on the code for loading the preloading scripts of the components.

[0091] In this embodiment, preloading script code for loading components can be introduced at the beginning of the Electron application's preloading script code. By modifying the preloading script code, after the Electron application launches a new window in response to user input from the desktop client, the Electron application's preloading script, based on the introduced code, first obtains the list of loaded / mounted components through the Electron application's main process, and then loads and executes the preloading scripts corresponding to each component in the list. The preloading script carries the paths to method objects that can be called by the rendering process. The method objects under this path can be exposed to the rendering process's API for the rendering process to call.

[0092] The invocation based on the preloaded scripts of each loaded component during the rendering process includes: invoking the method objects carried in the preloaded scripts of each loaded component through the rendering process of the Electron application.

[0093] In this embodiment, the Electron application's rendering process can only call component interfaces through the APIs exposed by the component's preload script, in order to invoke the functionality of the corresponding method object of the component. That is, the rendering process can only call component methods loaded in the component's preload script. The component's preload script environment and the rendering process's page environment are isolated contexts. This means that calling external capabilities only in the component's preload script is a safer practice, avoiding the problem that the rendering process directly calling the component's method object might affect the rendering process's global variables.

[0094] The following is combined Figure 2 The functions of the main process and preloaded scripts involved in the component application method based on Electron applications in the embodiments of this application are described.

[0095] The main process of Electron application 1000 provides the following functions:

[0096] Set the list of trusted component IDs (101) using setTrustIds(ids);

[0097] Automatically scan and load components in the specified resource directory of the Electron application using loadComponents(resourcePath) (102).

[0098] Get the information of the loaded components, namely the relevant code and configuration files, through listComponents() (103).

[0099] Determine whether the specified component has been loaded using hasComponent(name): (104);

[0100] Get the method object exported by the main process of the specified loaded component by using getComponentExport(name) (105).

[0101] Electron application 1000's preloading script 1400 provides the following functionality:

[0102] The component's preload script is automatically loaded and executed during initialization, without the need for export (108).

[0103] The listComponents() method retrieves information about the loaded components. The preload script method object of the loaded components in the rendering process is mounted under the window.componentInterface.listComponents() path (106).

[0104] The `hasComponent(name)` function is used to determine whether the specified component has been loaded (107).

[0105] This application embodiment achieves the function of calling the capabilities of third-party components by introducing the main process and preload script of the component into the main process and preload script of the Electron application, respectively.

[0106] The interaction relationships between the main process 1200, preloaded script 1400, and rendering process 1600 of Electron application 1000, and the main process and preloaded scripts of different components 3000 are as follows: Figure 3 As shown, Figure 3 This is a schematic diagram of the application architecture of the Electron application and its corresponding components according to an embodiment of this application.

[0107] For example, components A, B, and C in component 3000 are components in the resource directory of the Electron application. The main process 1200 of the Electron application 1000 can load components A, B, and C, obtain the methods exported by the main process of each component, and then store the method objects of component A, component B, and component C in the Electron application 1000. When the main process of the Electron application 1000 calls a component, it can call the method object of any component from the stored method objects of component A, component B, and component C.

[0108] The preloading script 1400 of the Electron application 1000 can load the preloading scripts of each component when the Electron application starts a new window, thereby providing the rendering process 1600 with the interfaces exposed by the preloading scripts of component A, component B, and component C. The rendering process of the Electron application 1000 can call the method objects of any component through the interfaces exposed by the preloading scripts of each component.

[0109] Figure 4 This is a schematic diagram of the overall flow of the component application method based on an Electron application according to an embodiment of this application, as shown below. Figure 4 As shown, it mainly includes the main process and the rendering process. The main process involves calling the method objects of the components, while the rendering process involves calling the method objects of the component's preloaded scripts. Specifically, it includes the following steps:

[0110] Step 1: Include the main process script that loads components at the beginning of the main process code of the Electron application;

[0111] Step 2: Call the setTrustIds(ids) method to set the list of trusted component IDs;

[0112] Step 3: Call loadComponents(resourcePath) to automatically load components;

[0113] Step 3.1: Scan the resource file path to find the file for the asar package until it is not found, then skip to step 4;

[0114] Step 3.2: After locating the asar file, read the package.json configuration file within the asar file;

[0115] Step 3.3: Parse the package.json configuration file to determine if the configuration file contains a componentMeta object;

[0116] Step 3.4: If no componentMeta object is found, skip to step 3.1 to find the next asar file;

[0117] Step 3.5: If a componentMeta object exists, check the component ID, i.e., whether componentMeta.id is a trusted component ID;

[0118] Step 3.6: If componentMeta.id is empty or not in the preset trusted component ID list, skip to step 3.1 to find the next asar file;

[0119] Step 3.7: If it is a trusted component ID, then parse out the main process code entry path and the preload code entry path of the component, and store them in memory along with the component information of componentMeta;

[0120] Step 4: Execute the main process entry code of each component one by one, and mount the method objects exported by the main process of the component to the object in the Electron application with the component name as the key;

[0121] Step 5: Execute other main process logic;

[0122] Step 6: When a new window is launched, the Electron application sets up a preload script, which must start with an import of the preload script for loading components;

[0123] Step 7: The Electron application's preloading script retrieves a list of loaded component information from the main process;

[0124] Step 8: Load and execute the preloading scripts corresponding to each component one by one;

[0125] Step 9: In the rendering process code, call the APIs exposed to the rendering process by the preloading scripts of each component, thereby enabling the calling of the internal capabilities of the components.

[0126] The main process in this application embodiment provides the ability to automatically detect and load components and the main process export method for mounting components, and the rendering process provides the ability to dynamically load component preload entry files in the preload script.

[0127] In this embodiment, by loading the components in the resource directory of the Electron application, obtaining the method objects exported by the main process of each component, and attaching the method objects to the preset objects of the Electron application for the Electron application to call, the existing components in the resource directory of the Electron application can be used to decouple and combine component functions without modifying too much code. This meets the needs of different users to achieve free and customized product development, improves component reusability, reduces the coupling between the Electron application and the components, and improves the efficiency of component application.

[0128] Optionally, such as Figure 5As shown in the figure, this application embodiment also provides a component application device 2000 based on Electron application, including a processor 2400 and a memory 2200. The memory 2200 stores a program or instructions that can run on the processor 2400. When the program or instructions are executed by the processor 2400, they implement the various steps of the above-described component application method embodiment based on Electron application and achieve the same technical effect. To avoid repetition, they will not be described again here.

[0129] This application also provides a readable storage medium storing a program or instructions. When executed by a processor, the program or instructions implement the various processes of any of the above-described Electron-based component application method embodiments, achieving the same technical effects. To avoid repetition, further details are omitted here. The readable storage medium includes computer-readable storage media, such as read-only memory (ROM), random access memory (RAM), magnetic disks, or optical disks.

[0130] This application also provides a computer program product, which includes a non-transitory computer-readable storage medium storing a computer program. The computer program is operable to cause a computer to execute and implement the various processes of any of the above-described embodiments of the component application method based on an Electron application, and can achieve the same technical effect. To avoid repetition, it will not be described again here.

[0131] It should be noted that, in this document, the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or apparatus. Unless otherwise specified, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes that element.

[0132] Through the above description of the embodiments, those skilled in the art can clearly understand that the methods of the above embodiments can be implemented by means of software plus necessary general-purpose hardware platforms. Of course, they can also be implemented by hardware, but in many cases the former is a better implementation method. Based on this understanding, the technical solution of this application, in essence, or the part that contributes to the prior art, can be embodied in the form of a software product. This computer software product is stored in a storage medium (such as ROM / RAM, magnetic disk, optical disk) and includes several instructions to cause a terminal (which may be a mobile phone, computer, server, air conditioner, or network device, etc.) to execute the methods described in the various embodiments of this application.

[0133] The embodiments of this application have been described above with reference to the accompanying drawings. However, this application is not limited to the specific embodiments described above. The specific embodiments described above are merely illustrative and not restrictive. Those skilled in the art can make many other forms under the guidance of this application without departing from the spirit and scope of the claims, and all of these forms are within the protection scope of this application.

Claims

1. A component application method based on Electron applications, characterized in that, include: Load the components in the resource directory of the Electron application. Package the relevant code and configuration file of one of the components into an asar package. Find the relevant code and configuration file of the corresponding component by searching the asar package under the corresponding resource file path in the resource directory. Based on the configuration file, determine the target component to be loaded and store the relevant code and configuration file of the target component. Retrieve the method objects exported by the main process of each component; The method object is attached to a preset object of the Electron application so that the Electron application can call it; The component's configuration file includes the component name and component ID. Determining the target component to be loaded based on the configuration file includes: determining whether the target asar package is the asar package of the component by judging whether the configuration file in the target asar package carries the component name; if so, matching the component ID in the configuration file of the target asar package with a preset trusted component ID list; if the match is successful, the component corresponding to the target asar package is determined as the target component to be loaded.

2. The method according to claim 1, characterized in that, The components in the resource directory of the loaded Electron application include: Introduce the main process script code for loading components into the main process code of the Electron application; Based on the code in the main process script used to load the component, the main process of the Electron application is triggered to scan the corresponding resource file paths in the resource directory; The main process of the Electron application scans and loads the components under the resource file path.

3. The method according to claim 2, characterized in that, The step of scanning and loading the components under the resource file path through the main process of the Electron application includes: By scanning the main process of the Electron application, the relevant code and configuration files of each component under the resource file path are found; Based on the configuration file, the target components that need to be loaded are determined by the main process of the Electron application; The main process of the Electron application stores the relevant code and configuration files of the target component.

4. The method according to claim 3, characterized in that, The step of scanning the main process of the Electron application to find the relevant code and configuration files of each component under the resource file path includes: By scanning the main process of the Electron application, the asar package under the resource file path is located to find the relevant code and configuration files of the corresponding components.

5. The method according to claim 4, characterized in that, The component's configuration file also includes the relative path to the component's main process entry point code.

6. The method according to claim 5, characterized in that, The method object exported by the main process of each component is obtained, including: Based on the relative path of the main process entry code of the component in the configuration file, the main process entry code of the target component is executed through the main process of the Electron application, so as to export the method object corresponding to the target component through the main process of the target component.

7. The method according to claim 5, characterized in that, The step of attaching the method object to the preset object of the Electron application includes: Using the component name of the target component as the key and the method object exported by the main process of the target component as the value, the method object exported by the main process of the Electron application is mounted onto the preset object of the Electron application through the main process of the Electron application.

8. The method according to any one of claims 1 to 7, characterized in that, Also includes: When the Electron application launches a new window, load the preload scripts for each component; During the rendering process, the preload scripts of each loaded component are invoked.

9. The method according to claim 8, characterized in that, When the Electron application launches a new window, the preloading scripts for each component are loaded, including: Incorporate preload script code for loading components into the preload script code of the Electron application; When the Electron application launches a new window, the preloading script of the Electron application is triggered to load the preloading scripts of each component based on the code of the preloading script used to load the components.

10. The method according to claim 8, characterized in that, The rendering process involves calling pre-loading scripts based on the loaded components, including: During the rendering process, the method objects carried in the preload scripts of the loaded components are called through the rendering process of the Electron application.

11. A component application device based on an Electron application, characterized in that, include: The loading module loads various components from the resource directory of the Electron application. The relevant code and configuration file of one of the components are packaged into an asar package. The loading module finds the relevant code and configuration file of the corresponding component by searching the asar package under the corresponding resource file path in the resource directory, determines the target component to be loaded based on the configuration file, and stores the relevant code and configuration file of the target component. Get the module, and get the method objects exported by the main process of each component; The mounting module mounts the method object to a preset object of the Electron application for the Electron application to call. The component's configuration file includes the component name and component ID. The loading module is specifically used to: determine whether the target asar package is the asar package of the component by judging whether the configuration file in the target asar package carries the component name; if so, match the component ID in the configuration file of the target asar package with a preset trusted component ID list; if the match is successful, determine the component corresponding to the target asar package as the target component to be loaded.

12. A component application device based on an Electron application, characterized in that, It includes a processor and a memory, the memory storing a program or instructions that can run on the processor, the program or instructions being executed by the processor to implement the steps of the method as described in any one of claims 1-10.

13. A readable storage medium, characterized in that, The readable storage medium stores a program or instructions that, when executed by a processor, implement the steps of the method as described in any one of claims 1-10.

Images