Processing method, device, equipment and readable storage medium for expanding WeChat mini-programs

Abstract

The present application belongs to the field of web page development technology, and the present application provides a processing method, device, computer equipment and computer-readable storage medium for extending WeChat applet. In order to solve the problem of low compatibility when extending Flutter application to WeChat applet, the present application obtains the initial web page request of WeChat applet by presetting WeChat applet component, responds to the user's input event, converts the initial web page request into a web page request based on a preset web framework, and calls the preset Flutter application to process the web page request, obtains a web page drawing instruction, converts the web page drawing instruction into a WeChat component web page drawing instruction of the WeChat applet component, and executes the WeChat component web page drawing instruction based on the WeChat applet component to perform web page rendering corresponding to the initial web page request, which can improve the compatibility between the Flutter application and the WeChat applet end.

Description

Technical Field

[0001] The present application relates to the technical field of web page development, and in particular to a processing method, apparatus, computer equipment, and computer-readable storage medium for expanding WeChat mini-programs. Background Art

[0002] Flutter is a cross-device framework launched by Google that runs on Android, iOS, and the web, and also supports desktop applications. WeChat Mini Programs are a key ecosystem in China, and extending Flutter applications to WeChat Mini Programs is still in the early stages of experimental exploration. The flutter_mp project is a well-known example.

[0003] Traditionally, extending Flutter applications to WeChat mini-programs involves analyzing the Flutter source code, processing it into a tree representation, and then performing a deep traversal to generate the WeChat mini-program wxml template file. The application is then run based on the wxml template file. However, generating the wxml template file from the Flutter source code presents the following compatibility issues: 1) Layout attributes are lost; 2) Some custom and third-party components cannot find alternatives on the WeChat mini-program platform; and 3) Dynamic elements on the page require adaptation using the WeChat mini-program template. However, Flutter's development language is Dart. Using the dart2js tool provided by Dart to compile the Dart source code into JavaScript, the generated JavaScript and the native JavaScript in the WeChat mini-program run in separate environments, requiring simultaneous modifications to achieve interoperability. Modifying the JavaScript source code reduces project maintainability and introduces further stability issues.

[0004] Therefore, in traditional technologies, extending Flutter applications to WeChat mini-programs has the technical problem of low compatibility between Flutter applications and WeChat mini-programs. Summary of the Invention

[0005] This application provides a processing method, apparatus, computer device, and computer-readable storage medium for extending WeChat mini-programs, which can solve the technical problem of low compatibility when extending Flutter applications to WeChat mini-programs in traditional technologies.

[0006] In the first aspect, the present application provides a processing method for extending the WeChat applet, including: based on a preset WeChat applet component provided by the WeChat applet platform, responding to the input event of the user triggering the WeChat applet, obtaining the initial web page request of the WeChat applet; based on a preset web page request conversion method, converting the initial web page request into a web page request based on a preset web framework; according to the web page request, calling a preset Flutter application to process the web page request, and obtaining a web page drawing instruction based on the web framework; based on a preset drawing instruction converter, converting the web page drawing instruction into a WeChat component web page drawing instruction of the WeChat applet component, and based on the WeChat applet component, executing the WeChat component web page drawing instruction to perform web page rendering corresponding to the initial web page request.

[0007] In the second aspect, the present application also provides a processing device for extending the WeChat applet, including: a response unit, which is used to respond to the input event of the user triggering the WeChat applet based on the preset WeChat applet component provided by the WeChat applet platform, and obtain the initial web page request of the WeChat applet; a first conversion unit, which is used to convert the initial web page request into a web page request based on a preset web framework based on a preset web request conversion method; a calling unit, which is used to call a preset Flutter application to process the web page request according to the web page request, and obtain a web page drawing instruction based on the web framework; a second conversion unit, which is used to convert the web page drawing instruction into a WeChat component web page drawing instruction of the WeChat applet component based on a preset drawing instruction converter, and execute the WeChat component web page drawing instruction based on the WeChat applet component to perform web page rendering corresponding to the initial web page request.

[0008] In a third aspect, the present application also provides a computer device comprising a memory and a processor, wherein a computer program is stored in the memory, and when the processor executes the computer program, the steps of the processing method for extending the WeChat applet are implemented.

[0009] In a fourth aspect, the present application also provides a computer-readable storage medium, which stores a computer program. When the computer program is executed by a processor, the processor executes the steps of the processing method for extending the WeChat applet.

[0010] The present application provides a processing method, device, computer equipment and computer-readable storage medium for extending WeChat mini-programs. The present application responds to an input event of a user triggering a WeChat mini-program based on a preset WeChat mini-program component provided by the WeChat mini-program platform, obtains an initial web page request of the WeChat mini-program, converts the initial web page request into a web page request based on a preset web framework based on a preset web page request conversion method, calls a preset Flutter application to process the web page request according to the web page request, obtains a web page drawing instruction based on the web framework, converts the web page drawing instruction into a WeChat component web page drawing instruction of the WeChat mini-program component based on a preset drawing instruction converter, and executes the WeChat component web page drawing instruction based on the WeChat mini-program component to perform web page rendering corresponding to the initial web page request, thereby making full use of the compatibility conversion between the preset WeChat mini-program component and the Web provided by the WeChat mini-program platform, realizing the conversion between the Web and the preset WeChat mini-program component, and supporting the Flutter application with the help of the Web platform, thereby extending the Flutter application to the WeChat mini-program, which can improve the compatibility between the Flutter application and the WeChat mini-program end. BRIEF DESCRIPTION OF THE DRAWINGS

[0011] In order to more clearly illustrate the technical solutions of the embodiments of the present application, the following is a brief introduction to the drawings required for use in the description of the embodiments. Obviously, the drawings described below are some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without any creative work.

[0012] Figure 1 A flowchart of a method for extending a WeChat applet provided in an embodiment of the present application;

[0013] Figure 2 A schematic diagram of an example framework structure of a processing method for extending a WeChat applet provided in an embodiment of the present application;

[0014] Figure 3 A schematic diagram of the first sub-flow of the processing method for extending the WeChat applet provided in an embodiment of the present application;

[0015] Figure 4 A schematic block diagram of a processing device for extending a WeChat applet provided in an embodiment of the present application; and

[0016] Figure 5 A schematic block diagram of a computer device provided in an embodiment of the present application. DETAILED DESCRIPTION

[0017] The following will be combined with the drawings in the embodiments of this application to clearly and completely describe the technical solutions in the embodiments of this application. Obviously, the embodiments described are part of the embodiments of this application, not all of them. Based on the embodiments in this application, all other embodiments obtained by ordinary technicians in this field without making creative efforts are within the scope of protection of this application.

[0018] It will be understood that when used in this specification and the appended claims, the terms “comprises” and “comprising” indicate the presence of described features, integers, steps, operations, elements and / or components, but do not preclude the presence or addition of one or more other features, integers, steps, operations, elements, components and / or groups thereof.

[0019] See also Figure 1 and Figure 2 , Figure 1 A flowchart of a method for extending a WeChat applet provided in an embodiment of the present application is provided. Figure 2 This is a schematic diagram of an example framework structure of a processing method for extending a WeChat applet provided in an embodiment of the present application. Figure 1 and Figure 2 As shown, the method includes the following steps S11-S14:

[0020] S11. Based on a preset WeChat mini-program component provided by the WeChat mini-program platform, respond to an input event of a user triggering the WeChat mini-program to obtain an initial webpage request for the WeChat mini-program.

[0021] Specifically, the WeChat Mini Program platform provides many pre-configured native components, such as the Canvas component, for developers to use when developing WeChat Mini Programs. These pre-configured WeChat Mini Program components are fully compatible with WeChat Mini Programs. Therefore, when a user launches a WeChat Mini Program, they can use the pre-configured WeChat Mini Program components provided by the WeChat Mini Program platform to respond to input events triggered by the user, and receive the initial webpage request for the WeChat Mini Program.

[0022] Furthermore, the preset WeChat mini-program component provided by the WeChat mini-program platform responds to an input event of a user triggering the WeChat mini-program to obtain an initial webpage request of the WeChat mini-program, including:

[0023] Based on the WeChat Mini Program Canvas component, respond to the input event of the WeChat Mini Program triggered by the user and obtain the initial web page request of the WeChat Mini Program Canvas component.

[0024] Specifically, the Canvas component is a component for drawing images on a web page. The WeChat Mini Program provides support for the Canvas component. The Canvas component provided by the WeChat Mini Program can be called the WeChat Mini Program Canvas component. There are differences between the WeChat Mini Program Canvas component and the HTML Canvas component.

[0025] Please continue reading Figure 2 , Figure 2 The schematic diagram of the example framework structure of the processing method for extending the Flutter application to the WeChat applet provided in the embodiment of the present application is as follows: when the user uses the WeChat applet, the user enters the WeChat applet, firstly, based on the WeChat applet Canvas component, listens for events on the WeChat applet Canvas component to respond to the input event of the user triggering the WeChat applet, the input event can be a drawing instruction for drawing a web page corresponding to the display animation web page or a drawing instruction for drawing a web page corresponding to the user input event, and then responds to the input event of the user triggering the WeChat applet, and obtains the initial web page request of the WeChat applet Canvas component, such as Figure 2 As shown, the initial web page request of the WeChat applet Canvas component can be a Canvas.requestAnimationFrame request. It should be noted that in the embodiment of the present application, it is not limited to the WeChat applet Canvas component, as long as it is a component that draws images on a web page and has a corresponding web frame.

[0026] S12: Based on a preset web page request conversion method, convert the initial web page request into a web page request based on a preset web framework.

[0027] Specifically, for the preset WeChat applet component provided by the WeChat applet platform, a preset web page request conversion method is pre-set, and the preset web page request conversion method is used to convert the initial web page request of the WeChat applet into a web page request based on a preset web framework. For example, for Flutter applications, since the Flutter web framework supports Flutter applications, the preset web page request conversion method is based on the preset web page request, which converts the initial web page request into a web page request based on the preset web framework. It can be:

[0028] Based on a preset web page request conversion method, the initial web page request is converted into a Flutter Web web page request based on the Flutter Web framework.

[0029] Specifically, since the technical route of Flutter Web is HTML+CSS+Canvas, and WeChat applet provides support for Canvas components, the preset web page request conversion method can be used to convert the initial web page request based on the WeChat applet Canvas component into a Flutter Web web page request based on the Flutter Web framework, and then use the preset web page request conversion method to convert the initial web page request into a Flutter Web web page request based on the Flutter Web framework, thereby achieving compatibility between the preset WeChat applet component and the Flutter Web framework, especially the compatibility between the WeChat applet Canvas component and the Flutter Web framework. Here, it is mainly the compatibility between the preset WeChat applet component and the FlutterWeb framework, and is not limited to the WeChat applet Canvas component, so as to facilitate the subsequent expansion of the Flutter application to the WeChat applet.

[0030] Furthermore, the converting of the initial web page request into a web page request based on a preset web framework based on a preset web page request conversion method includes:

[0031] The initial web page request is sent to a preset compatible conversion layer, and based on the preset compatible conversion layer, a preset web page request conversion method contained in the preset compatible conversion layer is called to convert the initial web page request into a web page request based on a preset web framework.

[0032] Specifically, for the preset WeChat applet component provided by the WeChat applet platform, a compatible conversion layer can be set between the preset WeChat applet component and the Web framework to enable the WeChat applet to be compatible with the Web framework. For example, a compatible conversion layer can be set between the preset WeChat applet component and the Flutter Web framework to enable the WeChat applet to be compatible with the Flutter Web framework. The initial web page request can then be sent to the preset compatible conversion layer, and then based on the preset compatible conversion layer, the preset web page request conversion method contained in the preset compatible conversion layer is called to convert the initial web page request into a Web web page request based on the preset Web framework, thereby achieving compatibility between the preset WeChat applet component and the Web framework, thereby facilitating the subsequent expansion of the Flutter application to the WeChat applet. For example, for the Flutter Web framework, the initial web page request is converted into a Flutter Web web page request based on the Flutter Web framework, thereby achieving compatibility between the preset WeChat applet component and the Flutter Web framework, thereby facilitating the subsequent expansion of the Flutter application to the WeChat applet.

[0033] For example, for the WeChat Mini Program Canvas component provided by the WeChat Mini Program platform, a compatible conversion layer is set in advance between the WeChat Mini Program Canvas component and the Flutter Web framework to make the WeChat Mini Program compatible with the Flutter Web framework. Since Flutter Web's technical route is HTML+CSS+Canvas (if Flutter Web supports other similar components besides Canvas, a similar processing method as Canvas can also be used), rendering is performed through the Canvas component, and events on the Canvas component are monitored to respond to user input events. At the same time, the WeChat mini-program platform provides a Canvas component, and there is a correspondence between the component properties and drawing commands of the Flutter Web Canvas component and the WeChat mini-program platform's Canvas component. Some of these correspondences are shown in Table 1 and Table 2. Table 1 is a comparison table of Canvas components in the Web platform and the WeChat mini-program platform, and Table 2 is a comparison table of Canvas component event monitoring in the Web platform and the WeChat mini-program platform. Therefore, in the WeChat mini-program, user events can be monitored based on the WeChat mini-program platform's Canvas component, and user events can be converted into web page requests between the WeChat mini-program platform's Canvas component and the Flutter Web Canvas component. Subsequently, the Flutter Web processing logic is called to handle the user events, thereby achieving WeChat mini-program compatibility with the Flutter Web framework.Therefore, after obtaining the initial web page request of the WeChat applet Canvas component, the initial web page request can be converted into a web page request based on the preset web framework based on the preset web request conversion method. For example, the initial web page request is converted into a Flutter Web web page request based on the Flutter Web framework, so that the input event received by the WeChat applet Canvas component is converted into a standard Flutter Web input event, thereby triggering the corresponding event processing logic of Flutter Web. For example, for the drawing instruction of the drawing web page corresponding to the display animation web page, the user enters the WeChat applet and executes Canvas.requestAnimationFrame in the Page.onReady callback to draw the component. After compatible conversion, it is converted into the corresponding Flutter Web web page request based on the Flutter Web framework, and then the page rendering logic of the Flutter Web layer is called. The rendering instruction generated by Flutter Web is converted into the drawing command corresponding to the WeChat applet Canvas component through the compatible conversion layer, and finally the user interface is rendered. For user input events, the input event received by the WeChat applet Canvas component can be converted based on the preset event converter into a standard Flutterweb input event, and the corresponding Flutter Web web page request based on the Flutter Web framework is obtained, and then the corresponding event processing logic of FlutterWeb is triggered.

[0034] Table 1

[0035]

[0036] Table 2

[0037]

[0038] S13. According to the web page request, call a preset Flutter application to process the web page request and obtain a web page drawing instruction based on the web framework.

[0039] Specifically, according to the Web page request, the preset Flutter application is called to process the Web page request. Here, it is mainly for the Web framework to support the Flutter application, and the Web page drawing instruction based on the Web framework is obtained. For example, for the Flutter Web page request, since the Flutter Web framework supports the Flutter application, according to the Flutter Web page request, the preset Flutter application is called to process the Flutter Web page request, and the Flutter Web page drawing instruction based on the Flutter Web framework is obtained. Since the Flutter Web platform supports Flutter applications, Flutter applications are applications based on the Flutter cross-end framework. Flutter is a cross-end framework launched by Google, which can extend the Flutter application to the Flutter Web platform. Therefore, after obtaining the Flutter Web page request, according to the Flutter Web page request, the preset Flutter application corresponding to the Flutter Web page request is called to process the Flutter Web page request, and the Flutter Web page drawing instruction based on the Flutter Web framework is obtained. For example, please continue to refer to Figure 2 For Flutter Web page requests, the drawing instruction Canvas.requestAnimationFrame for displaying the animation web page is converted based on Window.requestAnimationFrame, and then the corresponding drawing logic is called to obtain the corresponding Flutter Web page drawing instruction based on the Flutter Web framework. For user input events, they are converted based on the preset event converter, and the corresponding input event processing is performed to obtain the corresponding Flutter Web page request based on the Flutter Web framework.

[0040] Furthermore, the preset Flutter application includes a custom application based on Flutter and / or a third-party component based on Flutter. The preset Flutter application can include not only the native components contained in the Flutter cross-end framework itself, but also custom applications based on Flutter and third-party components based on Flutter, so as to support Flutter third-party components and extensions, and for custom applications based on Flutter and third-party components based on Flutter, they can be directly compatible with the preset WeChat applet components adopted by WeChat applet, such as WeChat applet Canvas components, without having to find corresponding alternative components in WeChat applet, which further improves the compatibility and flexibility of WeChat applet and improves the operating efficiency of WeChat applet.

[0041] Further, see Figure 3 , Figure 3 The first sub-flow diagram of the processing method for extending the WeChat applet provided in the embodiment of the present application is as follows Figure 3 As shown, in this embodiment, according to the web page request, calling a preset Flutter application to process the web page request and obtaining a web page drawing instruction based on the web framework includes:

[0042] S131. According to the Flutter Web webpage request, call a preset Flutter application to process the Flutter Web webpage request, and obtain the webpage processing logic and webpage rendering rules corresponding to the Flutter Web webpage request;

[0043] S132. Cache the web page processing logic and the web page rendering rules into the main.dart.js js code file to obtain a Flutter Web web page drawing instruction based on the Flutter Web framework.

[0044] Specifically, according to the Flutter Web web page request, in particular, based on a preset asynchronous method, the corresponding preset Flutter application can be called to process the Flutter Web web page request, and the web page processing logic corresponding to the Flutter Web web page request can be obtained. For custom applications based on Flutter and / or third-party components based on Flutter, in particular, custom applications based on Flutter and / or third-party components based on Flutter can be called based on a preset asynchronous method when needed, instead of directly encapsulating custom applications based on Flutter and / or third-party components based on Flutter into the WeChat applet itself. This can reduce the size of the WeChat applet itself and improve the running efficiency of the WeChat applet main program. Then, the web page interface corresponding to the Flutter Web web page request is changed through the web page processing logic to obtain the page rendering rules corresponding to the Flutter Web web page request, and the web page processing logic and the web page rendering rules are cached in the js code file of main.dart.js to obtain the Flutter based on the Flutter Web framework. Web page drawing instructions are provided, so that the WeChat mini-program contains a js runtime environment and can execute the rendering rules and logic processing of the Flutter framework, rendering all Flutter features to the WeChat mini-program. This avoids the problem of low efficiency caused by the isolation of the runtime environment of the js generated by Flutter and the native js in the WeChat mini-program. In other words, there is no problem between the js generated by Flutter and the native js in the WeChat mini-program.

[0045] S14. Based on a preset drawing instruction converter, convert the Web page drawing instruction into a WeChat component web page drawing instruction of the WeChat applet component, and execute the WeChat component web page drawing instruction based on the WeChat applet component to perform web page rendering corresponding to the initial web page request.

[0046] Specifically, based on the preset drawing instruction converter included in the compatible conversion layer, the Web page drawing instruction is converted into the WeChat component web page drawing instruction of the WeChat applet component. For example, the Flutter Web page drawing instruction is converted into the WeChat component web page drawing instruction of the WeChat applet component. Then, based on the WeChat applet component, the WeChat component web page drawing instruction is executed to perform web page rendering corresponding to the initial web page request, thereby extending the Flutter application to the WeChat applet.

[0047] In an embodiment of the present application, a preset WeChat applet component provided by the WeChat applet platform is responded to an input event of a user triggering a WeChat applet, and an initial web page request of the WeChat applet is obtained. Based on a preset web page request conversion method, the initial web page request is converted into a web page request based on a preset web framework. According to the web page request, a preset Flutter application is called to process the web page request, and a web page drawing instruction based on the web framework is obtained. Based on a preset drawing instruction converter, the web page drawing instruction is converted into a WeChat component web page drawing instruction of the WeChat applet component. Based on the WeChat applet component, the WeChat component web page drawing instruction is executed to perform web page rendering corresponding to the initial web page request, thereby making full use of the compatibility conversion between the preset WeChat applet component and the Web provided by the WeChat applet platform, realizing the conversion between the Web and the preset WeChat applet component, and with the help of the Web platform supporting the Flutter application, the Flutter application is extended to the WeChat applet, which can improve the compatibility between Flutter and the WeChat applet end.

[0048] Furthermore, the web page drawing instruction is converted into a WeChat component web page drawing instruction of a WeChat applet component based on a preset drawing instruction converter, and the WeChat component web page drawing instruction is executed based on the WeChat applet component to perform web page rendering corresponding to the initial web page request, including:

[0049] Based on a preset drawing instruction converter, the Flutter Web web page drawing instruction is converted into a Canvas web page drawing instruction of the WeChat applet Canvas component, and based on the js running environment included in the WeChat applet, the Canvas web page drawing instruction is executed to perform web page rendering corresponding to the initial web page request.

[0050] Specifically, since compatibility conversion can be performed between the Canvas component of the WeChat mini-program platform and the Canvas component of Flutter Web, the WeChat mini-program is compatible with the Flutter Web framework, and all rendering rules and logical processing in the output of Flutter Web are in the js code file named main.dart.js. If the WeChat mini-program includes a js runtime environment and the Flutter Web web page drawing instructions are converted into Canvas web page drawing instructions of the WeChat mini-program Canvas component, the js file generated by Flutter Web can be executed and rendered in the WeChat mini-program. That is, the WeChat mini-program includes a js runtime environment that can execute the rendering rules and logical processing of the Flutter framework, thereby achieving compatibility between Flutter Web and WeChat mini-programs. Therefore, not only can the Flutter Web web page drawing instruction be converted into the Canvas web page drawing instruction of the WeChat applet Canvas component based on the preset drawing instruction converter, but also the Canvas web page drawing instruction can be executed based on the js operating environment contained in the WeChat applet to perform the web page rendering corresponding to the initial web page request, so that the Flutter application WeChat applet can directly use the main.dart.js file generated by Flutter Web to render and execute in the Canvas component of the WeChat applet. For custom components and third-party components based on Flutter, there is no need to find alternative components in the WeChat applet, and support for Flutter third-party components and extensions can be achieved. There is no intercommunication problem between Flutter and the native js in the WeChat applet. The user interface is drawn based on the Canvas component, which can dynamically change the page content in the WeChat applet, and can improve the flexibility and convenience of the page display of the WeChat applet, thereby supporting dynamic page layout. For example, please continue to refer to Figure 2 For the drawing instructions corresponding to the animated web page, the user enters the WeChat applet and executes Canvas.requestAnimationFrame in the Page.onReady callback to draw the component. After compatible conversion, the page rendering logic of the Flutter Web layer will be called. The rendering instructions generated by Flutter Web are then converted into the drawing commands corresponding to the WeChat applet Canvas component through the compatible conversion layer, and finally the user interface is rendered. For user input events, the input events received by the WeChat applet Canvas component can be converted based on the preset event converter into standard Flutterweb input events, and then the corresponding event processing logic of Flutter Web is triggered, thereby obtaining the corresponding Flutter Web web page requests based on the FlutterWeb framework.

[0051] In an embodiment of the present application, based on the WeChat mini-program Canvas component, in response to the input event of the user triggering the WeChat mini-program, an initial web page request of the WeChat mini-program Canvas component is obtained, and based on a preset web page request conversion method, the initial web page request is converted into a Flutter Web web page request based on the Flutter Web framework. According to the Flutter Web web page request, a preset Flutter application is called to process the Flutter Web web page request, and a Flutter Web web page drawing instruction based on the Flutter Web framework is obtained. Then, based on a preset drawing instruction converter, the Flutter Web web page drawing instruction is converted into a Canvas web page drawing instruction of the WeChat mini-program Canvas component, and based on the js running environment included in the WeChat mini-program, the Canvas web page drawing instruction is executed to perform web page rendering corresponding to the initial web page request, thereby making full use of the Canvas component provided by the WeChat mini-program platform and the Canvas component adopted by the technical route included in Flutter Web itself, as well as the correlation between the two Canvas components, to realize the conversion between Flutter Web and WeChat mini-program Canvas components, and with the help of the Flutter Web platform to support Flutter applications, the Flutter application is extended to the WeChat mini-program, which can improve the compatibility of Flutter and the WeChat mini-program end.

[0052] It should be noted that the processing methods for extending WeChat mini-programs described in the above embodiments can recombine the technical features contained in different embodiments as needed to obtain a combined implementation plan, but they are all within the scope of protection required by this application.

[0053] See also Figure 4 , Figure 4 A schematic block diagram of a processing device for extending WeChat applet provided in an embodiment of the present application. Corresponding to the processing method for extending WeChat applet described above, an embodiment of the present application also provides a processing device for extending WeChat applet. Figure 4 As shown, the processing device for the extended WeChat applet includes a unit for executing the processing method for the extended WeChat applet described above, and the processing device for the extended WeChat applet can be configured in a computer device. Specifically, please refer to Figure 4 The processing device 40 for extending the WeChat applet includes a response unit 41, a first conversion unit 42, a calling unit 43 and a second conversion unit 44.

[0054] The response unit 41 is configured to respond to an input event of a user triggering a WeChat mini-program based on a preset WeChat mini-program component provided by the WeChat mini-program platform, and obtain an initial webpage request of the WeChat mini-program;

[0055] A first conversion unit 42 is configured to convert the initial web page request into a web page request based on a preset web framework based on a preset web page request conversion method;

[0056] The calling unit 43 is configured to call a preset Flutter application to process the web page request according to the web page request, and obtain a web page drawing instruction based on the web framework;

[0057] The second conversion unit 44 is used to convert the Web page drawing instruction into a WeChat component web page drawing instruction of the WeChat mini-program component based on a preset drawing instruction converter, and execute the WeChat component web page drawing instruction based on the WeChat mini-program component to perform web page rendering corresponding to the initial web page request.

[0058] In one embodiment, the response unit 41 is specifically configured to respond to an input event of a user triggering a WeChat mini-program based on the WeChat mini-program Canvas component, and obtain an initial web page request of the WeChat mini-program Canvas component.

[0059] In one embodiment, the first conversion unit 42 is specifically configured to convert the initial web page request into a Flutter Web web page request based on a Flutter Web framework based on a preset web page request conversion method.

[0060] In one embodiment, the second conversion unit 44 is specifically configured to convert the Flutter Web webpage drawing instruction into a Canvas webpage drawing instruction of the WeChat applet Canvas component based on a preset drawing instruction converter, and execute the Canvas webpage drawing instruction based on the js runtime environment included in the WeChat applet to perform webpage rendering corresponding to the initial webpage request.

[0061] In one embodiment, the calling unit 43 includes:

[0062] The calling subunit is configured to call a preset Flutter application to process the Flutter Web web page request according to the Flutter Web web page request, and obtain the web page processing logic and web page rendering rules corresponding to the Flutter Web web page request;

[0063] The cache subunit is used to cache the web page processing logic and the web page rendering rules into the js code file of main.dart.js to obtain the Flutter Web web page drawing instructions based on the Flutter Web framework.

[0064] In one embodiment, the preset Flutter application includes a custom application based on Flutter and / or a third-party component based on Flutter.

[0065] In one embodiment, the first conversion unit 42 is specifically configured to send the initial web page request to a preset compatible conversion layer, and based on the preset compatible conversion layer, call a preset web page request conversion method contained in the preset compatible conversion layer to convert the initial web page request into a web page request based on a preset web framework.

[0066] It should be noted that technical personnel in the relevant field can clearly understand that the specific implementation process of the processing device and each unit of the above-mentioned extended WeChat applet can refer to the corresponding description in the aforementioned method embodiment. For the convenience and conciseness of the description, it will not be repeated here.

[0067] At the same time, the division and connection methods of the various units in the above-mentioned processing device of the extended WeChat applet are only used for illustration. In other embodiments, the processing device of the extended WeChat applet can be divided into different units as needed, and the various units in the processing device of the extended WeChat applet can also be connected in different orders and methods to complete all or part of the functions of the processing device of the above-mentioned extended WeChat applet.

[0068] The processing device for extending the WeChat applet can be implemented in the form of a computer program. The computer program can be used in Figure 5 Runs on the computer equipment shown.

[0069] See also Figure 5 , Figure 5 1 is a schematic block diagram of a computer device provided in an embodiment of the present application. The computer device 500 may be a computer device such as a desktop computer or a server, or may be a component or part in other devices.

[0070] See Figure 5 The computer device 500 includes a processor 502, a memory and a network interface 505 connected through a system bus 501, wherein the memory may include a non-volatile storage medium 503 and an internal memory 504, and the memory may also be a volatile storage medium.

[0071] The non-volatile storage medium 503 can store an operating system 5031 and a computer program 5032. When the computer program 5032 is executed, the processor 502 can execute the above-mentioned processing method for extending the WeChat applet.

[0072] The processor 502 is used to provide computing and control capabilities to support the operation of the entire computer device 500.

[0073] The internal memory 504 provides an environment for the operation of the computer program 5032 in the non-volatile storage medium 503. When the computer program 5032 is executed by the processor 502, the processor 502 can execute a processing method for extending the WeChat applet as described above.

[0074] The network interface 505 is used to communicate with other devices through the network. Figure 5 The structure shown in the figure is only a block diagram of a part of the structure related to the solution of the present application, and does not constitute a limitation on the computer device 500 to which the solution of the present application is applied. The specific computer device 500 may include more or fewer components than those shown in the figure, or combine certain components, or have a different arrangement of components. For example, in some embodiments, the computer device may only include a memory and a processor. In such an embodiment, the structure and function of the memory and processor are the same as those in the embodiment of the present application. Figure 5 The embodiments shown are consistent and will not be described again here.

[0075] In which, the processor 502 is used to run the computer program 5032 stored in the memory to implement the following steps: based on the preset WeChat applet component provided by the WeChat applet platform, respond to the input event of the user triggering the WeChat applet, and obtain the initial web page request of the WeChat applet; based on the preset web page request conversion method, convert the initial web page request into a web page request based on a preset web framework; according to the web page request, call the preset Flutter application to process the web page request and obtain a web page drawing instruction based on the web framework; based on the preset drawing instruction converter, convert the web page drawing instruction into a WeChat component web page drawing instruction of the WeChat applet component, and based on the WeChat applet component, execute the WeChat component web page drawing instruction to perform web page rendering corresponding to the initial web page request.

[0076] In one embodiment, when the processor 502 implements the preset WeChat mini-program component provided by the WeChat mini-program platform, responds to an input event of a user triggering the WeChat mini-program, and obtains an initial webpage request for the WeChat mini-program, the processor 502 specifically implements the following steps:

[0077] Based on the WeChat Mini Program Canvas component, respond to the input event of the WeChat Mini Program triggered by the user and obtain the initial web page request of the WeChat Mini Program Canvas component.

[0078] In one embodiment, when the processor 502 converts the initial web page request into a web page request based on a preset web framework by implementing the preset web page request conversion method, the processor 502 specifically implements the following steps:

[0079] Based on a preset web page request conversion method, the initial web page request is converted into a Flutter Web web page request based on the Flutter Web framework.

[0080] In one embodiment, when the processor 502 implements the preset drawing instruction converter to convert the web page drawing instruction into a WeChat component web page drawing instruction of the WeChat mini-program component, and executes the WeChat component web page drawing instruction based on the WeChat mini-program component to render the web page corresponding to the initial web page request, the processor 502 specifically implements the following steps:

[0081] Based on a preset drawing instruction converter, the Flutter Web web page drawing instruction is converted into a Canvas web page drawing instruction of the WeChat applet Canvas component, and based on the js running environment included in the WeChat applet, the Canvas web page drawing instruction is executed to perform web page rendering corresponding to the initial web page request.

[0082] In one embodiment, when the processor 502 implements the step of calling a preset Flutter application to process the web page request according to the web page request and obtaining a web page drawing instruction based on a web framework, the processor 502 specifically implements the following steps:

[0083] According to the Flutter Web web page request, a preset Flutter application is called to process the Flutter Web web page request, and the web page processing logic and web page rendering rules corresponding to the Flutter Web web page request are obtained;

[0084] The web page processing logic and the web page rendering rules are cached in the js code file of main.dart.js to obtain the Flutter Web web page drawing instructions based on the Flutter Web framework.

[0085] In one embodiment, when the processor 502 implements the calling of the preset Flutter application to process the web page request, the preset Flutter application includes a custom application based on Flutter and / or a third-party component based on Flutter.

[0086] In one embodiment, when the processor 502 converts the initial web page request into a web page request based on a preset web framework by implementing the preset web page request conversion method, the processor 502 specifically implements the following steps:

[0087] The initial web page request is sent to a preset compatible conversion layer, and based on the preset compatible conversion layer, a preset web page request conversion method contained in the preset compatible conversion layer is called to convert the initial web page request into a web page request based on a preset web framework.

[0088] It should be understood that in the embodiment of the present application, the processor 502 may be a central processing unit (CPU), and the processor 502 may also be other general-purpose processors, digital signal processors (DSP), application-specific integrated circuits (ASIC), field-programmable gate arrays (FPGA) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. Among them, the general-purpose processor may be a microprocessor or the processor may also be any conventional processor, etc.

[0089] Those skilled in the art will appreciate that all or part of the steps in the method of the above-described embodiment can be implemented by a computer program, which can be stored in a computer-readable storage medium. The computer program is executed by at least one processor in the computer system to implement the steps in the method of the above-described embodiment.

[0090] Therefore, the present application also provides a computer-readable storage medium. The computer-readable storage medium may be a non-volatile computer-readable storage medium or a volatile computer-readable storage medium, and the computer-readable storage medium stores a computer program that, when executed by a processor, causes the processor to perform the following steps:

[0091] A computer program product, when running on a computer, enables the computer to execute the steps of the processing method for extending the WeChat mini-program described in the above embodiments.

[0092] The computer-readable storage medium may be an internal storage unit of the aforementioned device, such as a hard disk or memory of the device. The computer-readable storage medium may also be an external storage device of the device, such as a plug-in hard disk equipped on the device, a Smart Media Card (SMC), a Secure Digital (SD) card, a Flash Card, etc. Furthermore, the computer-readable storage medium may include both an internal storage unit of the device and an external storage device.

[0093] Those skilled in the art will clearly understand that, for the convenience and brevity of description, the specific working processes of the above-described equipment, devices and units can refer to the corresponding processes in the aforementioned method embodiments and will not be repeated here.

[0094] The storage medium is a physical, non-transient storage medium, for example, it can be a USB flash drive, a mobile hard disk, a read-only memory (ROM), a magnetic disk or an optical disk, or other physical storage medium that can store computer programs.

[0095] Those skilled in the art will appreciate that the units and algorithm steps of each example described in conjunction with the embodiments disclosed herein can be implemented in electronic hardware, computer software, or a combination of the two. In order to clearly illustrate the interchangeability of hardware and software, the composition and steps of each example have been generally described in terms of function in the above description. Whether these functions are performed in hardware or software depends on the specific application and design constraints of the technical solution. Professional and technical personnel can use different methods to implement the described functions for each specific application, but such implementation should not be considered to be beyond the scope of this application.

[0096] In the several embodiments provided in this 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 merely illustrative. For example, the division of each unit is merely a logical functional division, and other division methods may be used in actual implementation. For example, multiple units or components can be combined or integrated into another system, or some features can be ignored or not implemented.

[0097] The steps in the method of the embodiment of the present application can be adjusted in order, combined, and deleted according to actual needs. The units in the device of the embodiment of the present application can be combined, divided, and deleted according to actual needs. In addition, the functional units in the various embodiments of the present application can be integrated into a processing unit, or each unit can exist physically separately, or two or more units can be integrated into a single unit.

[0098] 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 storage medium. Based on this understanding, the technical solution of the present application is essentially or the part that contributes to the existing technology, or all or part of the technical solution can be embodied in the form of a software product. The computer software product is stored in a storage medium and includes a number of instructions for enabling an electronic device (which can be a personal computer, terminal, or network device, etc.) to perform all or part of the steps of the method described in each embodiment of the present application.

[0099] The above description is merely a specific embodiment of the present application, but the scope of protection of the present application is not limited thereto. Any person skilled in the art can easily conceive of various equivalent modifications or substitutions within the technical scope disclosed in the present application, and such modifications or substitutions should be included in the scope of protection of the present application. Therefore, the scope of protection of the present application should be based on the scope of protection of the claims.

Claims

1. A method for expanding a WeChat applet, characterized in that: include: Based on a preset WeChat mini-program component provided by the WeChat mini-program platform, responding to an input event of a user triggering the WeChat mini-program, obtaining an initial webpage request for the WeChat mini-program; Based on a preset web page request conversion method, converting the initial web page request into a web page request based on a preset web framework; According to the web page request, calling a preset Flutter application to process the web page request, and obtaining a web page drawing instruction based on the web framework; Based on a preset drawing instruction converter, the web page drawing instruction is converted into a WeChat component web page drawing instruction of the WeChat mini-program component, and based on the WeChat mini-program component, the WeChat component web page drawing instruction is executed to render the web page corresponding to the initial web page request; The preset WeChat mini-program component provided by the WeChat mini-program platform responds to an input event of a user triggering the WeChat mini-program to obtain an initial webpage request for the WeChat mini-program, including: Based on the WeChat Mini Program Canvas component, respond to the user's input event that triggers the WeChat Mini Program and obtain the initial web page request of the WeChat Mini Program Canvas component; The converting of the initial web page request into a web page request based on a preset web framework based on a preset web page request conversion method includes: Based on a preset web page request conversion method, convert the initial web page request into a Flutter Web web page request based on the Flutter Web framework; The calling of a preset Flutter application to process the web page request according to the web page request to obtain a web page drawing instruction based on a web framework includes: According to the Flutter Web web page request, a preset Flutter application is called to process the Flutter Web web page request, and the web page processing logic and web page rendering rules corresponding to the Flutter Web web page request are obtained; The web page processing logic and the web page rendering rules are cached in the js code file of main.dart.js to obtain the Flutter Web web page drawing instructions based on the Flutter Web framework.

2. The method for extending a WeChat applet according to claim 1, wherein: The method converts the web page drawing instruction into a WeChat component web page drawing instruction of a WeChat mini-program component based on a preset drawing instruction converter, and executes the WeChat component web page drawing instruction based on the WeChat mini-program component to render the web page corresponding to the initial web page request, including: Based on a preset drawing instruction converter, the Flutter Web web page drawing instruction is converted into a Canvas web page drawing instruction of the WeChat applet Canvas component, and based on the js running environment included in the WeChat applet, the Canvas web page drawing instruction is executed to perform web page rendering corresponding to the initial web page request.

3. The method for extending a WeChat applet according to claim 1, wherein: The preset Flutter application includes a Flutter-based custom application and / or a Flutter-based third-party component.

4. The method for extending a WeChat applet according to claim 1, wherein: The converting of the initial web page request into a web page request based on a preset web framework based on a preset web page request conversion method includes: The initial web page request is sent to a preset compatible conversion layer, and based on the preset compatible conversion layer, a preset web page request conversion method contained in the preset compatible conversion layer is called to convert the initial web page request into a web page request based on a preset web framework.

5. A processing device for expanding WeChat applet, characterized in that: include: A response unit, configured to respond to an input event triggered by a user of a WeChat mini-program based on a preset WeChat mini-program component provided by the WeChat mini-program platform, and obtain an initial webpage request for the WeChat mini-program; A first conversion unit is configured to convert the initial web page request into a web page request based on a preset web framework based on a preset web page request conversion method; A calling unit is configured to call a preset Flutter application to process the web page request according to the web page request, and obtain a web page drawing instruction based on the web framework; A second conversion unit is configured to convert the web page drawing instruction into a WeChat component web page drawing instruction of the WeChat mini-program component based on a preset drawing instruction converter, and execute the WeChat component web page drawing instruction based on the WeChat mini-program component to render the web page corresponding to the initial web page request; The response unit is specifically configured to respond to an input event triggered by a user of the WeChat mini-program Canvas component based on the WeChat mini-program Canvas component, and obtain an initial webpage request of the WeChat mini-program Canvas component; The first conversion unit is specifically configured to convert the initial web page request into a Flutter Web web page request based on a Flutter Web framework based on a preset web page request conversion method; The calling unit includes: The calling subunit is configured to call a preset Flutter application to process the Flutter Web web page request according to the Flutter Web web page request, and obtain the web page processing logic and web page rendering rules corresponding to the Flutter Web web page request; The cache subunit is used to cache the web page processing logic and the web page rendering rules into the js code file of main.dart.js to obtain the Flutter Web web page drawing instructions based on the Flutter Web framework.

6. A computer device, characterized in that: The computer device includes a memory and a processor connected to the memory; the memory is used to store a computer program; and the processor is used to run the computer program to perform the steps of the method according to any one of claims 1 to 4.

7. A computer-readable storage medium, characterized in that The storage medium stores a computer program, and when the computer program is executed by a processor, the steps of the method according to any one of claims 1 to 4 can be implemented.

Images