A page display method and device of an applet

Abstract

The application relates to the field of Fintech, and discloses a page display method and device of an applet. A terminal acquires a program code file of a target applet based on a received starting instruction of the target applet. The terminal acquires a page rendering file and a page logic file corresponding to the target applet from a CDN server according to the program code file. The terminal displays a page of the target applet through execution of each logic unit in the page logic file and rendering of each node in the page rendering file. In this way, a management station configures information of each page of the applet and integrates the information into a page rendering file and a logic execution file, and then publishes the page rendering file and the logic execution file to each CDN server. As a result, the terminal can acquire the page rendering file and the logic execution file from a nearest CDN server, and then dynamically renders the page, so that the style of the page of the applet can be modified in real time without the need of a business personnel to audit the program code file of the applet with an updated page style.

Description

Technical Field

[0001] This application relates to the field of financial technology (Fintech), and more particularly to a method and apparatus for displaying pages in a mini-program. Background Technology

[0002] With the development of computer technology, more and more technologies (such as big data, cloud computing, or blockchain) are being applied in the financial sector, and the traditional financial industry is gradually transforming into fintech. For example, as the user base of applications such as WeChat and Alipay continues to expand, more and more merchants are launching their own mini-programs on WeChat and Alipay, allowing users to conduct desired consumption and business transactions without downloading the relevant applications. Banks are no exception; for example, banks can market their financial products to users through WeChat mini-programs.

[0003] In particular, when the functions of a WeChat mini-program marketing campaign page are relatively simple, technical personnel need to frequently modify the mini-program to enrich its functions, which can easily lead to repetitive development work. In addition, after each modification, the WeChat mini-program needs to be manually reviewed by WeChat before it can be released to the online environment and used by users, which obviously has the disadvantage of being time-consuming.

[0004] Therefore, there is an urgent need for a mini-program release solution that has low development costs and does not require approval from business personnel. Summary of the Invention

[0005] This application provides a method and apparatus for displaying pages in a mini-program, which allows the new page to be quickly applied to the user's terminal without requiring approval from business personnel after the style of the mini-program has been updated.

[0006] In a first aspect, embodiments of this application provide a method for displaying a mini-program page. The method includes: a terminal obtaining the program code file of the target mini-program based on a received launch instruction for the target mini-program; the terminal obtaining a page rendering file and a page logic file corresponding to the target mini-program from a content delivery network (CDN) server according to the program code file; and the terminal displaying the page of the target mini-program by executing each logic unit in the page logic file and rendering each node in the page rendering file.

[0007] In the above scheme, once a user launches a mini-program on their terminal, the terminal can obtain the mini-program's code file. Based on this code file, the terminal can retrieve the corresponding page rendering file and page logic file from the CDN server. Finally, the terminal displays the mini-program's page by executing the logical units in the page logic file and rendering the nodes in the page rendering file. This method configures the information for each page of the mini-program through the management console, integrates it into page rendering files and logic execution files, and then publishes them to various CDN servers. This allows the terminal to obtain the page rendering files and logic execution files from the nearest CDN server, enabling dynamic page rendering. This achieves the goal of real-time modification of the mini-program's page style without requiring business personnel to review the mini-program's code file for updated page styles.

[0008] In one possible implementation, the page rendering file is published on the CDN server after configuring the styles of each page of the target mini-program in the management console and packaging the style configuration information of each page; the page logic file is published on the CDN server after configuring the logic of each page of the target mini-program in the management console and packaging the logic configuration information of each page.

[0009] In the above solution, for a mini-program to be released, information about each page of the mini-program can be pre-configured in the management console, including information on page style configuration and page logic configuration. After configuring the style and logic information of all pages in the mini-program, the style configuration information of each page can be packaged into a page rendering file and published on the CDN server, and the logic configuration information of each page can be packaged into a page logic file and published on the CDN server. This allows the terminal to obtain these two files from the corresponding CDN server based on the program code file of the mini-program after receiving the user's launch command for the mini-program, so that the terminal can realize real-time rendering of the mini-program page based on these two files.

[0010] In one possible implementation method, the terminal renders each node in the page rendering file, including: for any page, the terminal obtains a node array of the page from the page rendering file; for any node in the node array, the terminal parses and renders the node using preset components in the program code file.

[0011] In the above solution, on the one hand, by configuring page style and page logic information in the management console, page rendering files and page logic files that can be published on the CDN server are formed. This allows technicians to update the style of the mini-program's pages simply by reconfiguring the relevant page style and / or page logic information in the management console and republishing it to the CDN server. On the other hand, after the terminal obtains the page rendering file and page logic file of the mini-program from the relevant CDN server based on the mini-program's program code file, for each mini-program page to be displayed, the terminal can obtain the node array of the page from the obtained page rendering file. After obtaining the node array, for any node in the node array, the terminal can parse and render the node using the components pre-set in the corresponding program code file of the mini-program, so that the correct mini-program page will be displayed on the terminal's screen.

[0012] In one possible implementation, for any node in the node array, the terminal parses and renders the node using preset components in the program code file, including: the terminal traversing the node array; if the terminal determines that the current node in the node array is a page node, it sets the page title using the page component in each component; if the terminal determines that the current node is an image node with an image size set, it updates the image size of the corresponding element of the current node using the image component in each component.

[0013] In the above solution, during the process of the terminal parsing and rendering any node in the node array through the pre-set components in the corresponding program code file of the mini-program, it can specifically include the terminal traversing all nodes in the node array. A traversed node can be defined as the current node. If the terminal determines that the current node is a page node, the page title can be set through the page component in each component. If the terminal determines that the current node is an image node with set image dimensions, the image component in each component can update the image dimensions of the corresponding element of the current node. Based on this method, each node in the node array can be correctly rendered on the terminal's display interface, enabling the terminal to correctly display the mini-program's page.

[0014] In one possible implementation, if the terminal determines that the current node is not a page node, it iterates through each style attribute of the current node; if the terminal determines that the current CSS property style affects the position layout of the element corresponding to the current node, and the layout unit is a pure number, it supplements the unit of the attribute value corresponding to the current CSS property style and appends it to the style attribute of the element; the current CSS property style is any CSS property style of any style attribute among the various style attributes of the current node.

[0015] The above solution describes some necessary operations that need to be performed when the current node being traversed is not a page node during the process of traversing the node array in the terminal. These operations include traversing the style attributes of the current node. If the terminal determines that the CSS attribute style being traversed will affect the position and layout of the element corresponding to the current node, and the layout unit is a pure number, then the terminal can supplement the unit of the attribute value corresponding to the current CSS attribute style and append it to the style attribute of the element corresponding to the current node. This can ensure the correctness of the mini-program page during the display process.

[0016] In one possible implementation method, the terminal executes each logical unit in the page logic file, including: for any page, the terminal obtains each logical unit corresponding to the page from the page logic file; after preprocessing each logical unit, the terminal puts them into a queue in the order of execution of each logical unit; for each logical unit taken from the queue, the terminal executes the logical unit according to the type of the logical unit.

[0017] In the above scheme, to display a page correctly, in addition to correctly rendering the elements involved on the page, it is also necessary to determine which elements need to be rendered. That is, first, it is necessary to know which elements are involved in the page to be displayed, and then by correctly rendering the involved elements, the correct page can be displayed to the user. In the process of determining which elements are involved in the page to be displayed, the terminal can obtain the corresponding logical units of the page to be displayed from the page logic file, then preprocess each logical unit, and put the processed logical units into a queue in the order of processing. Finally, for the logical unit retrieved from the queue, the terminal can execute the logical unit according to the type of the logical unit, and finally obtain the information of the elements involved in the page to be displayed.

[0018] In one possible implementation, the terminal preprocesses each logical unit, including: for any logical unit, the terminal parses each code statement in the logical unit; the terminal performs normalization processing on each code statement; the normalization processing includes at least deleting invalid statements and changing double negation statements to affirmative statements.

[0019] In the above scheme, the preprocessing operation performed by the terminal on each logical unit can be taken as an example. That is, the terminal parses each code statement in the logical unit and performs normalization processing on each code statement, such as deleting invalid statements and changing double negation statements to affirmative statements. This can ensure that when the terminal retrieves the logical unit from the queue and processes the logical unit according to its type, the processing efficiency of the logical unit can be improved.

[0020] Secondly, embodiments of this application provide a page display device for a mini-program. The device includes: a program code file acquisition unit, configured to acquire the program code file of the target mini-program based on a received launch instruction for the target mini-program; a dual file acquisition unit, configured to acquire a page rendering file and a page logic file corresponding to the target mini-program from a content delivery network (CDN) server based on the program code file; and a page display unit, configured to display the page of the target mini-program by executing each logic unit in the page logic file and rendering each node in the page rendering file.

[0021] Thirdly, embodiments of this application provide a computing device, including:

[0022] Memory, used to store program instructions;

[0023] A processor is configured to invoke program instructions stored in the memory and execute any implementation method of the first aspect according to the obtained program.

[0024] Fourthly, embodiments of this application provide a computer-readable storage medium storing computer-executable instructions for causing a computer to perform any implementation method as described in the first aspect. Attached Figure Description

[0025] To more clearly illustrate the technical solutions in the embodiments of this application, the accompanying drawings used in the description of the embodiments will be briefly introduced below. Obviously, the accompanying drawings described below are only some embodiments of this application. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0026] Figure 1A schematic diagram of a system architecture provided for an embodiment of this application;

[0027] Figure 2 A schematic diagram illustrating a page display method for a mini-program provided in an embodiment of this application;

[0028] Figure 3 A schematic diagram of a component provided in an embodiment of this application;

[0029] Figure 4 A flowchart of page rendering provided in an embodiment of this application;

[0030] Figure 5 A schematic diagram of a page display device for a mini-program provided in an embodiment of this application;

[0031] Figure 6 This is a schematic diagram of a computing device provided in an embodiment of this application. Detailed Implementation

[0032] To make the objectives, technical solutions, and advantages of this application clearer, the application will be further described in detail below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of this application, and not all embodiments. Based on the embodiments in this application, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of this application.

[0033] Currently, even after a simple style update, the provider of the mini-program service still needs to review the updated code files before the new version can be released. This process significantly reduces the efficiency of mini-program releases.

[0034] To address the aforementioned technical problems, embodiments of this application provide a possible system architecture. For example... Figure 1 The diagram shown is a schematic of a system architecture provided in an embodiment of this application. The system architecture includes a terminal 110, a third-party server 120, a target server 130, and a CDN (Content Delivery Network) server 140.

[0035] The terminal 110 can be a smartphone, computer, smart vehicle device, or other device. It can be used to select a desired mini-program from the mini-program service provided by the third-party server 120 and use the selected mini-program.

[0036] The third server 120 can be a server capable of providing various mini-program services. It can store the program code files of various mini-programs. When the terminal 110 needs to use a specific mini-program from the third-party server 120, the third-party server 120 can send the program code file stored for that mini-program to the terminal 110. The terminal 110 can then load and use the mini-program by running the received program code file. For example, the third-party server 120 can be a server for the WeChat application or a server for the Alipay application.

[0037] Target server 130 can be a server provided to various mini-program developers, equipped with a visual management console. Mini-program developers can configure each page of the mini-program through this console, including configuring page styles and page logic. After configuring all pages, developers can preview the display effect of each page in the console. If the display effect meets the development expectations, the developers package the style configuration information for each page into a page rendering file and the logic configuration information for each page into a page logic file. Finally, they can send the packaged page rendering file and page logic file to CDN server 140. Furthermore, mini-program developers can record in the mini-program's code files the page renderings that need to be retrieved from the CDN server. The code for the file and page logic file is provided so that when a user wants to use the mini-program through their terminal 110, i.e., when the user issues a start command to the terminal 110, the terminal 110 can first obtain the program code file of the mini-program from the third-party server 120. Then, the terminal 110 uses the code recorded in the program code file of the mini-program to obtain the page rendering file and page logic file of the mini-program from the CDN server 140. Thus, the terminal 110 can obtain the page rendering file and page logic file of the mini-program from the CDN server 140. Finally, the terminal 110 can correctly display the mini-program page indicated by the various operation commands issued by the user by executing the various logical units in the obtained page logic file and rendering the various nodes in the obtained page rendering file.

[0038] CDN server 140 can be used to receive and store page rendering files and page logic files of a specified mini-program transmitted by target server 130, and can send the page rendering files and page logic files of the specified mini-program requested by terminal 110 to terminal 110 after receiving the terminal 110's instruction to obtain the page rendering files and page logic files of the specified mini-program.

[0039] To address the aforementioned technical problems and in conjunction with the system architecture provided in the embodiments of this application, this application can provide a method for displaying the page of a mini-program. For example... Figure 2 The diagram shown is a schematic representation of a page display method for a mini-program provided in an embodiment of this application. This method can be implemented by... Figure 1 The terminal 110 shown executes the method, which includes the following steps:

[0040] Step 201: The terminal obtains the program code file of the target mini-program based on the received launch command for the target mini-program;

[0041] Step 202: The terminal obtains the page rendering file and the page logic file corresponding to the target mini-program from the content delivery network (CDN) server according to the program code file.

[0042] Step 203: The terminal displays the page of the target mini-program by executing each logical unit in the page logic file and rendering each node in the page rendering file.

[0043] Furthermore, in this embodiment of the invention, it should be emphasized that in existing mini-programs, the logic layer and the rendering layer are separate, and no method is provided for manipulating the DOM structure or dynamically inserting DOM nodes, so dynamic rendering cannot be achieved like a webpage.

[0044] In the above scheme, once a user launches a mini-program on their terminal, the terminal can obtain the mini-program's code file. Based on this code file, the terminal can retrieve the corresponding page rendering file and page logic file from the CDN server. Finally, the terminal displays the mini-program's page by executing the logical units in the page logic file and rendering the nodes in the page rendering file. This method configures the information for each page of the mini-program through the management console, integrates it into page rendering files and logic execution files, and then publishes them to various CDN servers. This allows the terminal to obtain the page rendering files and logic execution files from the nearest CDN server, enabling dynamic page rendering. This achieves the goal of real-time modification of the mini-program's page style without requiring business personnel to review the mini-program's code file for updated page styles.

[0045] The following will provide a detailed explanation of some of the steps mentioned above, with examples.

[0046] In some embodiments of this application, the page rendering file is published on the CDN server after configuring the style of each page of the target mini-program in the management console and packaging the style configuration information of each page; the page logic file is published on the CDN server after configuring the logic of each page of the target mini-program in the management console and packaging the logic configuration information of each page.

[0047] Currently, because mini-program developers pre-write the style and logic information of the mini-program pages in the program code file, even minor style changes require developers to update the program code file. The updated code file must then be submitted to the mini-program management personnel for review before the new version can be released. Clearly, this process, especially for hot updates like those to the mini-program page styles, will involve a lengthy waiting time before the new version can be released.

[0048] To address this issue, this application embodiment modifies the current system architecture by introducing a CDN server. The CDN server stores the mini-program's page rendering files and page logic files, and the mini-program's code file contains code that retrieves these files from the CDN server. Thus, each time a user uses the mini-program, after issuing a start command, the user terminal first obtains the mini-program's code file. Then, the user terminal retrieves information from the code file that allows the acquisition of the page rendering files and page logic files from the CDN server. The user terminal can then obtain the page rendering files and page logic files from the CDN server. Based on the execution of each logical unit in the page logic file and the rendering of each node in the page rendering file, the page indicated by the user's command can be correctly displayed.

[0049] This method configures the style and logic information of each page of the mini-program using the management console. After configuration, it is packaged into page rendering files and page logic files and published on a CDN server. Therefore, whenever a user uses the mini-program, if the page style has been updated, the user's terminal will retrieve the latest version of the page rendering and logic files from the CDN server. By processing these updated versions, the user's terminal can then view the updated mini-program. This method avoids the need for manual review of the new version's code files when updates such as mini-program styles occur (hot updates), thus improving the speed of new mini-program releases.

[0050] In one implementation of step 203 above, the terminal executes each logical unit in the page logic file, including: for any page, the terminal obtains each logical unit corresponding to the page from the page logic file; after preprocessing each logical unit, the terminal puts them into a queue in the order of execution of each logical unit; for each logical unit taken out from the queue, the terminal executes the logical unit according to the type of the logical unit.

[0051] In some embodiments of this application, the terminal preprocesses each logical unit, including: for any logical unit, the terminal parses each code statement in the logical unit; the terminal performs normalization processing on each code statement; the normalization processing includes at least deleting invalid statements and changing double negative statements to affirmative statements.

[0052] Each of these logical units is used to indicate the next action to be performed based on rules pre-configured in that logical unit and user information (including the user's historical information and the user's current actions).

[0053] For example, for a page currently displayed by a mini-program, the content visible to the user on the page can be called an element; for any element on the page that the user can operate (such as clicking), in this embodiment, a logical unit can be pre-configured for it in the management console. Thus, for a page, the number of user-operable elements corresponds to the number of logical units on that page. Therefore, after a user clicks on an operable element (let's call it element B) on page A, the terminal can obtain the logical unit corresponding to element B on page A from the page logic file. Then, the terminal preprocesses the logical unit, including parsing the code statements in the logical unit and performing operations such as deleting invalid statements and changing double negative sentences to affirmative sentences, to obtain a refined set of display logic for the new page indicated by element B on page A. The terminal can then process this set of display logic sequentially. Specifically, the processing can be performed according to the type of the currently retrieved display logic, including:

[0054] If the type of the currently retrieved display logic is a truth judgment, such as determining whether a user is a member or not based on the information stored in the database about whether the user is a member, then according to the result of the truth judgment, the next display logic is retrieved from this group of display logics, and the next display logic is processed.

[0055] If the type of the currently retrieved display logic is a custom type, such as determining the user's level based on the transaction amount data stored in the user database, then execute the custom function and wait for the result feedback after the custom function is executed. Finally, based on the feedback result, retrieve the next display logic from this group of display logics and continue to process the next display logic.

[0056] If the currently retrieved display logic is of the end type, then the processing of that group of display logic will end;

[0057] If the current display logic is user behavior analysis, then user behavior is monitored and feedback is obtained.

[0058] During the execution of the page logic file, the key point is to be able to parse out specific logical steps, then queue these logical steps and form a specific state machine. Thus, during actual execution, the state machine determines the operation to be performed for the current step based on the logic type displayed at the head of the queue.

[0059] In one implementation of step 203 above, the terminal renders each node in the page rendering file, including: for any page, the terminal obtains the node array of the page from the page rendering file; for any node in the node array, the terminal parses and renders the node using the preset components in the program code file.

[0060] Continuing with the previous example, regarding element B in page A, the execution of the logical unit of element B in the page logic file on the terminal can obtain the data of a new page (let's call it page C) to be displayed to the user after the execution of element B in page A is completed. This data is the node array. Then, for any node in the node array, the terminal can parse and render the node array through the components set in the program code file. After the terminal has completed the parsing and rendering of all nodes in the node array, it can display page C to the user.

[0061] In this context, a node is the name given to each piece of content on the page when the program code file is written, while an element is the name given to each piece of content on the page after it is displayed; furthermore, there is a one-to-one correspondence between nodes and elements.

[0062] In some embodiments of this application, the step of parsing and rendering any node in the node array using preset components in the program code file includes: the terminal traversing the node array; if the terminal determines that the current node in the node array is a page node, then setting the page title using the page component in each component; if the terminal determines that the current node is an image node with an image size set, then updating the image size of the corresponding element of the current node using the image component in each component.

[0063] In some embodiments of this application, if the terminal determines that the current node is not a page node, it iterates through each style attribute of the current node; if the terminal determines that the current CSS property style affects the position layout of the element corresponding to the current node, and the layout unit is a pure number, it supplements the unit of the attribute value corresponding to the current CSS property style and appends it to the style attribute of the element; the current CSS property style is any CSS property style of any style attribute among the various style attributes of the current node.

[0064] For example, such as Figure 3 The diagram shown is a schematic representation of a component provided in an embodiment of this application. Wherein, Figure 3 The seven components shown are those pre-configured in the program code file of the mini-program in this embodiment of the application. These seven components are the node component, image component, text component, page component, video component, audio component, and view component.

[0065] Specifically, the node component can be used to preprocess rendering data, the image component can be used to render images, the text component can be used to render text, the page component can be used to configure page-level information, the video component can be used to play videos, the audio component can be used to play audio, and the view component can be used to locate and load other types of nodes.

[0066] Furthermore, besides rendering images, the image component can also be used to set image dimensions. For example, during the development of a mini-program, when developers need to display a page that is an inquiry-based page (such as prompting the user to agree to a user agreement or authorizing geolocation information), they can pre-design the dimensions of this inquiry-based page, either using default settings or customizing them. In such scenarios with specific requirements for page dimensions, the image component, in addition to rendering images, needs to perform certain actions depending on whether an image size has been defined. Specifically: if the developer has defined a size, the image component will need to set the image size according to the user-defined size; if the developer has not defined an image size, the image component can simply render the image without any further action.

[0067] It should be noted that technicians can freely combine and use the components other than the node component among the seven components according to the actual needs of the mini-program, and this application also supports the addition of other reasonable components.

[0068] Assuming the mini-program is a WeChat mini-program, then based on Figure 3 The components shown are as follows: Figure 4 The diagram shown is a flowchart of a page rendering method provided in an embodiment of this application. The flowchart includes the following steps:

[0069] Step 401: Obtain the page rendering file from the CDN server.

[0070] Step 402: Determine if the WeChat Mini Program base library version is not less than 2.11.2. If yes, proceed to step 403; otherwise, proceed to step 404.

[0071] Step 403: Read the nodelist array (node ​​array) corresponding to the page to be displayed from the page rendering file, and then execute step 405.

[0072] Step 404: Render the prompt content in compatibility mode (e.g., render a custom image and a prompt text in a fixed format to inform the user that they need to upgrade the WeChat client before using it).

[0073] Step 405: Add the nodelist array to the node component for preprocessing.

[0074] Step 406: Determine if it is a page node. If not, proceed to step 407; otherwise, proceed to step 408.

[0075] Step 407: Iterate through the node.style property and execute step 409.

[0076] Step 408: Read the title attribute, call the WeChat Mini Program API - wx.setNavigationBarTitle, and set the title value to the page title.

[0077] Step 409: Determine whether the CSS properties affect the element's position and layout. If yes, proceed to step 410; otherwise, proceed to step 411.

[0078] Step 410: Determine whether the layout unit is a percentage or a pure number. If it is a percentage, proceed to step 411; otherwise, proceed to step 412.

[0079] Step 411: Append the CSS properties and values ​​to the element's style property, and then proceed to step 413.

[0080] Step 412: Add rpx units to the CSS property values ​​and then execute step 411.

[0081] Step 413: Determine if it is an image node. If yes, proceed to step 414; otherwise, proceed to step 415.

[0082] Step 414: Determine the image size setting mode. If it is determined that only the height is set and the width is not set, proceed to step 416; if it is determined that only the width is set and the height is not set, proceed to step 417; if it is determined that both the height and width are set, proceed to step 418.

[0083] Step 415: Render using different components based on the node type (including using image, text, video, audio, and view components), and then proceed to step 419.

[0084] Step 416: Set the mode attribute value to heightFix using the image component to adapt the width according to the image height, and then execute step 415.

[0085] Step 417: Set the mode attribute value to widthFix using the image component to adapt the height according to the image width, and then execute step 415.

[0086] Step 418: Set the mode attribute value to scaleToFill using the image component to force it to stretch and fill the area according to the set size, and then execute step 415.

[0087] Step 419: Determine if there are child nodes. If yes / yes, proceed to step 420; otherwise, proceed to step 421.

[0088] Step 420: Traverse and render child nodes, and return to step 405.

[0089] Step 421: End rendering of this node and begin rendering the next sibling node, then return to step 405.

[0090] Based on the same concept, embodiments of this application provide a page display device for a mini-program, such as... Figure 5 The diagram shown is a schematic of a page display device for a mini-program provided in an embodiment of this application. The device includes a program code file acquisition unit 501, a dual file acquisition unit 502, and a page display unit 503.

[0091] The program code file acquisition unit 501 is used to acquire the program code file of the target mini-program based on the received start command for the target mini-program;

[0092] The dual-file acquisition unit 502 is used to acquire, from the content delivery network CDN server, the page rendering file corresponding to the target mini-program and the page logic file corresponding to the target mini-program based on the program code file.

[0093] The page display unit 503 is used to display the page of the target mini-program by executing each logical unit in the page logic file and rendering each node in the page rendering file.

[0094] Furthermore, for this device, the page rendering file is published on the CDN server after configuring the style of each page of the target mini-program in the management console and packaging the style configuration information of each page; the page logic file is published on the CDN server after configuring the logic of each page of the target mini-program in the management console and packaging the logic configuration information of each page.

[0095] Furthermore, for this device, the page display unit 503 is specifically used for: obtaining the node array of the page from the page rendering file for any page; and parsing and rendering any node in the node array using the preset components in the program code file.

[0096] Furthermore, for this device, the page display unit 503 is specifically used for: traversing the node array; if it is determined that the current node in the node array is a page node, then setting the page title through the page component in each component; if it is determined that the current node is an image node with an image size set, then updating the image size of the corresponding element of the current node through the image component in each component.

[0097] Furthermore, for this device, the page display unit 503 is specifically used for: if it is determined that the current node is not a page node, then traversing each style attribute of the current node; if it is determined that the current CSS property style affects the position layout of the element corresponding to the current node, and the layout unit is a pure number, then supplementing the attribute value corresponding to the current CSS property style with units and appending it to the style attribute of the element; the current CSS property style is any CSS property style of any style attribute among the various style attributes of the current node.

[0098] Furthermore, for this device, the page display unit 503 is specifically used for: for any page, obtaining each logical unit corresponding to the page from the page logic file; preprocessing each logical unit and then placing them into a queue in the order of execution of each logical unit; and executing the logical unit according to its type for the logical unit taken from the queue.

[0099] Furthermore, for this device, the page display unit 503 is specifically used for: parsing each code statement in any logic unit; performing normalization processing on each code statement; the normalization processing includes at least deleting invalid statements and changing double negative statements into affirmative statements.

[0100] This application also provides a computing device, which may specifically be a desktop computer, portable computer, smartphone, tablet computer, personal digital assistant (PDA), etc. The computing device may include a central processing unit (CPU), memory, input / output devices, etc. Input devices may include a keyboard, mouse, touchscreen, etc., and output devices may include display devices, such as liquid crystal displays (LCDs) and cathode ray tubes (CRTs).

[0101] The memory may include read-only memory (ROM) and random access memory (RAM), and provides the processor with program instructions and data stored in the memory. In the embodiments of this application, the memory may be used to store program instructions for the page display method of the applet;

[0102] The processor is used to call the program instructions stored in the memory and execute the page display method of the applet according to the obtained program.

[0103] like Figure 6 The diagram shown is a schematic representation of a computing device provided in an embodiment of this application. The computing device includes:

[0104] The processor 601, memory 602, transceiver 603, and bus interface 604 are included; wherein the processor 601, memory 602, and transceiver 603 are connected via bus 605.

[0105] The processor 601 is used to read the program in the memory 602 and execute the page display method of the above-mentioned applet;

[0106] Processor 601 can be a central processing unit (CPU), a network processor (NP), or a combination of a CPU and an NP. It can also be a hardware chip. The aforementioned hardware chip can be an application-specific integrated circuit (ASIC), a programmable logic device (PLD), or a combination thereof. The aforementioned PLD can be a complex programmable logic device (CPLD), a field-programmable gate array (FPGA), a generic array logic (GAL), or any combination thereof.

[0107] The memory 602 is used to store one or more executable programs and can store data used by the processor 601 when performing operations.

[0108] Specifically, the program may include program code, which includes computer operation instructions. Memory 602 may include volatile memory, such as random-access memory (RAM); memory 602 may also include non-volatile memory, such as flash memory, hard disk drive (HDD), or solid-state drive (SSD); memory 602 may also include combinations of the above types of memory.

[0109] Memory 602 stores the following elements: executable modules or data structures, or subsets thereof, or extended sets thereof:

[0110] Operation instructions: This includes various operation instructions used to perform various operations.

[0111] Operating system: includes various system programs used to implement various basic business functions and handle hardware-based tasks.

[0112] The 605 bus can be a Peripheral Component Interconnect (PCI) bus or an Extended Industry Standard Architecture (EISA) bus, etc. Buses can be divided into address buses, data buses, control buses, etc. For ease of representation, Figure 6 The bus is represented by a single thick line, but this does not mean that there is only one bus or one type of bus.

[0113] Bus interface 604 can be a wired communication interface, a wireless bus interface, or a combination thereof. The wired bus interface can be, for example, an Ethernet interface. The Ethernet interface can be an optical interface, an electrical interface, or a combination thereof. The wireless bus interface can be a WLAN interface.

[0114] This application also provides a computer-readable storage medium storing computer-executable instructions for causing a computer to execute a page display method for a mini-program.

[0115] Those skilled in the art will understand that embodiments of this application can be provided as methods or computer program products. Therefore, this application can take the form of a completely hardware embodiment, a completely software embodiment, or an embodiment combining software and hardware aspects. Furthermore, this application can take the form of a computer program product embodied on one or more computer-usable storage media (including but not limited to disk storage, CD-ROM, optical storage, etc.) containing computer-usable program code.

[0116] This application is described with reference to flowchart illustrations and / or block diagrams of methods, apparatus (systems), and computer program products according to embodiments of this application. It will be understood that each block of the flowchart illustrations and / or block diagrams, and combinations of blocks in the flowchart illustrations and / or block diagrams, can be implemented by computer program instructions. These computer program instructions can be provided to a processor of a general-purpose computer, special-purpose computer, embedded processor, or other programmable data processing apparatus to produce a machine, such that the instructions, which execute via the processor of the computer or other programmable data processing apparatus, generate instructions for implementing the flowchart... Figure 1 One or more processes and / or boxes Figure 1 A device that provides the functions specified in one or more boxes.

[0117] These computer program instructions may also be stored in a computer-readable storage medium that can direct a computer or other programmable data processing device to function in a particular manner, such that the instructions stored in the computer-readable storage medium produce an article of manufacture including instruction means, which are implemented in a process Figure 1One or more processes and / or boxes Figure 1 The function specified in one or more boxes.

[0118] These computer program instructions may also be loaded onto a computer or other programmable data processing equipment to cause a series of operational steps to be performed on the computer or other programmable equipment to produce a computer-implemented process, thereby providing instructions that execute on the computer or other programmable equipment for implementing the process. Figure 1 One or more processes and / or boxes Figure 1 The steps of the function specified in one or more boxes.

[0119] Although preferred embodiments of this application have been described, those skilled in the art, upon learning the basic inventive concept, can make other changes and modifications to these embodiments. Therefore, the appended claims are intended to be interpreted as including the preferred embodiments as well as all changes and modifications falling within the scope of this application.

[0120] Obviously, those skilled in the art can make various modifications and variations to this application without departing from the spirit and scope of this application. Therefore, if such modifications and variations fall within the scope of the claims of this application and their equivalents, this application also intends to include such modifications and variations.

Claims

1. A method for displaying a page in a mini-program, characterized in that, include: The terminal obtains the program code file of the target mini-program based on the received launch command for the target mini-program; The terminal obtains the page rendering file and the page logic file corresponding to the target mini-program from the content delivery network CDN server according to the program code file. The terminal displays the page of the target mini-program by executing each logical unit in the page logic file and rendering each node in the page rendering file; The terminal renders each node in the page rendering file, including: For any given page, the terminal obtains the node array of the page from the page rendering file; For any node in the node array, the terminal parses and renders the node using the preset components in the program code file; The terminal executes each logical unit in the page logic file, including: For any given page, the terminal obtains the corresponding logical units for that page from the page logic file; After the terminal preprocesses each logic unit, it places them into a queue in the order of execution of each logic unit. For a logical unit retrieved from the queue, the terminal executes the logical unit according to its type.

2. The method as described in claim 1, characterized in that, The page rendering files are generated by configuring the styles of each page of the target mini-program in the management console, packaging the style configuration information of each page, and then publishing it on the CDN server. The page logic file is generated by configuring the logic of each page of the target mini-program on the management console, packaging the logic configuration information of each page, and then publishing it on the CDN server.

3. The method as described in claim 1, characterized in that, For any node in the node array, the terminal parses and renders the node using pre-defined components in the program code file, including: The terminal traverses the node array; If the terminal determines that the current node in the node array is a page node, it sets the page title through the page component in each component; If the terminal determines that the current node is an image node with a set image size, it updates the image size of the corresponding element of the current node through the image component in each component.

4. The method as described in claim 3, characterized in that, The method further includes: If the terminal determines that the current node is not a page node, then iterates through each style attribute of the current node; If the terminal determines that the current CSS property style affects the position layout of the element corresponding to the current node, and the layout unit is a pure number, then it supplements the unit of the property value corresponding to the current CSS property style and appends it to the style property of the element; the current CSS property style is any CSS property style of any style property among the various style properties of the current node.

5. The method as described in claim 1, characterized in that, The terminal performs preprocessing on each logic unit, including: For any given logical unit, the terminal parses each code statement within that logical unit; The terminal performs standardization processing on each code statement; the standardization processing includes at least deleting invalid statements and changing double negations into affirmative statements.

6. A page display device for a mini-program, characterized in that, include: The program code file acquisition unit is used to acquire the program code file of the target mini-program based on the received launch instruction for the target mini-program; The dual-file acquisition unit is used to obtain the page rendering file and the page logic file corresponding to the target mini-program from the content delivery network CDN server according to the program code file. A page display unit is used to display the page of the target mini-program by executing each logical unit in the page logic file and rendering each node in the page rendering file; The page display unit is specifically used to obtain the node array of the page from the page rendering file for any page; and to parse and render any node in the node array using the preset components in the program code file. The page display unit is specifically used to obtain the corresponding logical units of any page from the page logic file; after preprocessing each logical unit, put them into a queue in the order of execution of each logical unit; and execute the logical unit according to the type of the logical unit for the logical unit taken out from the queue.

7. A computer device, characterized in that, include: Memory, used to store computer programs; A processor is configured to invoke a computer program stored in the memory and execute the method as described in any one of claims 1-5 according to the obtained program.

8. A computer-readable storage medium, characterized in that, The storage medium stores computer-executable instructions for causing a computer to perform the method as described in any one of claims 1-5.

Images