Webpage construction method, device and apparatus

By receiving user-inputted build commands and matching them with preset matching patterns, the group identifiers in the webpage building process are removed, solving the problems of easily cracked grouping logic and large resource packages, thus achieving more efficient webpage building.

CN112182470BActive Publication Date: 2025-11-04WEBANK (CHINA)
View PDF 2 Cites 0 Cited by

Patent Information

Application Number
CN202011177257.6
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2020-10-28
Publication Date
2025-11-04
Estimated Expiration
2040-10-28

AI Technical Summary

Technical Problem

In existing technologies, when building web pages using web componentization, the grouping logic is easily cracked and the resource package is large, resulting in low operating efficiency.

Method used

By receiving the build command input by the user, matching it with the pre-configured group information according to the preset matching pattern, determining whether the page elements need to be displayed, deleting the group identifiers that do not need to be displayed in the HTML file, and generating the final HTML file.

Benefits of technology

The absence of grouping logic code in the browser reduces the package size of the resulting resources, decreases network transmission time, and improves operational efficiency.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN112182470B_ABST
    Figure CN112182470B_ABST
Patent Text Reader

Abstract

Embodiments of the present application provide a webpage construction method, device and equipment, the method comprising: receiving a user input construction command; according to a preset matching mode, matching the construction command with a plurality of groups of configuration information configured in advance respectively to obtain a matching result corresponding to each group, the matching result being used to determine whether a corresponding page element needs to be displayed; according to the matching result, processing an html tag with a group identifier in a completed html file to delete a group identifier prefix in an html tag corresponding to a page element that needs to be displayed and the html tag corresponding to a page element that does not need to be displayed; and constructing a webpage according to the processed html file. The webpage constructed by the present solution does not have grouping logic code in the browser, ensuring code security, reducing the package size of the construction result resource, reducing the time loss of the resource in the network transmission process, and improving the running efficiency.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present invention relates to the field of Internet technology, and in particular to a webpage construction method, apparatus and device. Background Technology

[0002] With the development of computer technology, more and more technologies are being applied in the financial field. The traditional financial industry is gradually transforming into financial technology, and web page building technology is no exception. However, due to the security and real-time requirements of the financial industry, higher demands are being placed on the technology.

[0003] In related technologies, websites are composed of web pages, which users read through web browsers. A web page is an HTML document containing HTML tags. These HTML tags contain the page elements (such as text and images) displayed on the web page. The web browser reads the HTML document and displays the page elements within the HTML tags on the web page. A common method for building web pages is the web componentization approach, which involves breaking down different page elements into components, combining all components into a component tree according to grouping logic, and then constructing the page based on the generated component tree.

[0004] However, when building web pages using a component-based approach, all components must be initialized and loaded at runtime. This necessitates executing grouping logic at runtime to determine whether specific page elements should be displayed. Consequently, the HTML document used to build the web page inevitably contains the component grouping logic code. This not only makes the grouping logic vulnerable to cracking and leads to code information leakage, but also results in a large final build package, reducing runtime efficiency. Summary of the Invention

[0005] This invention provides a webpage construction method, apparatus, and device to address the problems in the prior art where webpage construction using web componentization methods results in easily cracked grouping logic and large final build resource packages, thus reducing operational efficiency.

[0006] A first aspect of this invention provides a webpage construction method, comprising:

[0007] Receive build commands from the user;

[0008] According to the preset matching mode, the construction command is matched with the configuration information of multiple pre-configured groups to obtain the matching result corresponding to each group. The matching result is used to determine whether the corresponding page element needs to be displayed.

[0009] According to the matching result, an html tag with a group identifier in the compiled html file is processed to delete a group identifier prefix in an html tag corresponding to a page element to be displayed and the html tag corresponding to a page element not to be displayed.

[0010] A webpage is constructed according to the processed html file.

[0011] Optionally, the construction command comprises a target indication parameter, and the configuration information comprises a group identifier and a corresponding indication parameter set.

[0012] The preset matching mode is used to match the construction command with the configuration information of a plurality of groups respectively to obtain a matching result corresponding to each group, comprising:

[0013] According to the preset matching mode, the target indication parameter is matched with each indication parameter in the indication parameter set corresponding to each group identifier respectively to obtain a matching result corresponding to each group identifier.

[0014] Optionally, according to the preset matching mode, the target indication parameter is matched with each indication parameter in the indication parameter set corresponding to each group identifier respectively to obtain a matching result corresponding to each group identifier, comprising:

[0015] It is detected whether there is an indication parameter same as the target indication parameter in the indication parameter set corresponding to the group identifier; if there is, the matching result corresponding to the group identifier is matching success; if not, the matching result corresponding to the group identifier is matching failure.

[0016] Optionally, according to the preset matching mode, the target indication parameter is matched with each indication parameter in the indication parameter set corresponding to each group identifier respectively to obtain a matching result, comprising:

[0017] The content of the target indication parameter is compared with the content of each indication parameter in each indication parameter set; if there is an indication parameter same as the content of the target indication parameter in the indication parameter set, the matching result corresponding to the group identifier is matching success; otherwise, the matching result corresponding to the group identifier is matching failure.

[0018] Optionally, according to the preset matching mode, the target indication parameter is matched with each indication parameter in the indication parameter set corresponding to each group identifier respectively to obtain a matching result, comprising:

[0019] The content of the target indication parameter is compared with the content of each indication parameter in each indication parameter set, if there is an indication parameter in the indication parameter set containing the content of the target indication parameter, the corresponding matching result of the group identifier is matching success; otherwise, the corresponding matching result of the group identifier is matching failure.

[0020] Optionally, the matching of the target indication parameter with each indication parameter in the indication parameter set corresponding to each group identifier according to the preset matching mode to obtain a matching result comprises:

[0021] Optionally, the matching of the target indication parameter with each indication parameter in the indication parameter set corresponding to each group identifier according to the preset matching mode to obtain a matching result comprises:

[0022] Optionally, the html tag contains a page element, and the processing of the html tag with the group identifier in the completed html file according to the matching result comprises:

[0023] Optionally, the html tag contains a page element, and the processing of the html tag with the group identifier in the completed html file according to the matching result comprises:

[0024] Optionally, the html tag contains a page element, and the processing of the html tag with the group identifier in the completed html file according to the matching result comprises:

[0025] Optionally, the html tag contains a page element, and the processing of the html tag with the group identifier in the completed html file according to the matching result comprises:

[0026] Optionally, the html tag contains a page element, and the processing of the html tag with the group identifier in the completed html file according to the matching result comprises:

[0027] Optionally, the html tag contains a page element, and the processing of the html tag with the group identifier in the completed html file according to the matching result comprises:

[0028] Optionally, the html tag contains a page element, and the processing of the html tag with the group identifier in the completed html file according to the matching result comprises:

[0029] Optionally, the html tag contains a page element, and the processing of the html tag with the group identifier in the completed html file according to the matching result comprises:

[0030] If the matching result corresponding to the group identifier is a match, all first nodes with the group identifier in the abstract syntax tree are traversed in a depth-first manner, and the group identifier prefix in the first nodes is deleted; if the matching result corresponding to the group identifier is a mismatch, all first nodes with the group identifier in the abstract syntax tree are traversed in a breadth-first manner, and the first nodes are deleted;

[0031] The new abstract syntax tree is converted into a new html file.

[0032] Optionally, the generating of the abstract syntax tree according to the html tags in the html file comprises:

[0033] extracting all the html tags in the html file;

[0034] parsing the extracted html tags to obtain the parent-child relationship among all the html tags;

[0035] determining the node attribute features and the parent-child node relationship corresponding to each html tag according to the parent-child relationship among the html tags;

[0036] generating the abstract syntax tree with the parent node as the root node.

[0037] The second aspect of the embodiment of the present application provides a webpage construction device, comprising:

[0038] a receiving module configured to receive a construction command input by a user;

[0039] a matching module configured to match the construction command with configuration information of a plurality of groups preconfigured according to a preset matching mode, to obtain a matching result corresponding to each group, the matching result being used to determine whether a corresponding page element needs to be displayed;

[0040] a processing module configured to process html tags with a group identifier in a completed html file according to the matching result, to delete a group identifier prefix in an html tag corresponding to a page element that needs to be displayed and an html tag corresponding to a page element that does not need to be displayed;

[0041] a construction module configured to construct a webpage according to the processed html file.

[0042] The third aspect of the embodiment of the present application provides a computer device, comprising at least one processor and a memory;

[0043] the memory stores computer execution instructions;

[0044] The at least one processor executes the computer-executed instructions stored in the memory, so that the at least one processor executes the webpage construction method provided in the first aspect of the embodiment of the present application.

[0045] The fourth aspect of the embodiment of the present application provides a computer-readable storage medium, and the computer-readable storage medium stores computer-executed instructions, and when a processor executes the computer-executed instructions, the first aspect of the embodiment of the present application is implemented.

[0046] The embodiment of the present application provides a webpage construction method, device and equipment, the method receives the construction command input by a user; and according to a preset matching mode, the construction command is matched with a plurality of groups of configuration information configured in advance respectively, and a matching result corresponding to each group is obtained. Since the matching result is used to judge whether the corresponding page element needs to be displayed, the html tags with group identifiers in the compiled html file can be processed according to the matching result, that is, the group identifier prefix in the html tag corresponding to the page element that needs to be displayed and the html tag corresponding to the page element that does not need to be displayed are deleted, so that the processed html file does not contain the group identifier. The webpage constructed by the present solution does not exist group logic code in the browser, reduces the package size of the construction result resource, reduces the time loss of the resource in the network transmission process, and improves the running efficiency. BRIEF DESCRIPTION OF DRAWINGS

[0047] In order to more clearly illustrate the technical solutions in the embodiments of the present application or the prior art, the drawings needed to be used in the embodiment or prior art description will be briefly introduced. Obviously, the drawings in the following description are only some embodiments of the present application, and other drawings can be obtained by those skilled in the art without creative labor.

[0048] Figure 1 It is an application scenario diagram of the webpage construction method shown by an exemplary embodiment of the present application;

[0049] Figure 2 It is a flowchart of the webpage construction method shown by an exemplary embodiment of the present application;

[0050] Figure 3 It is a flowchart of the construction method of the abstract syntax tree shown by an exemplary embodiment of the present application;

[0051] Figure 4 It is a structure diagram of the abstract syntax tree shown by an exemplary embodiment of the present application;

[0052] Figure 5is a structural schematic diagram of an abstract syntax tree according to another example embodiment of the present application;

[0053] Figure 6 is a structural schematic diagram of a webpage construction device according to an example embodiment of the present application;

[0054] Figure 7 is a structural schematic diagram of a computer device according to an example embodiment of the present application. DETAILED DESCRIPTION

[0055] In order to make the objects, technical solutions and advantages of the embodiments of the present application clearer, the technical solutions in the embodiments of the present application will be described clearly and completely below with reference to the drawings in the embodiments of the present application. Obviously, the described embodiments are only some of the embodiments of the present application but not all the embodiments. Based on the embodiments in the present application, all other embodiments obtained by those of ordinary skill in the art without creative work fall within the protection scope of the present application.

[0056] The terms "first", "second", "third", "fourth" and the like (if any) in the description, claims and above drawings of the present application are used to distinguish similar objects, and do not necessarily indicate a specific order or sequence. It should be understood that the data thus used can be interchanged under appropriate circumstances, so that the embodiments of the present application described herein can be implemented in an order other than that illustrated or described herein. In addition, the terms "include" and "have" and any variations thereof are intended to cover non-exclusive inclusion, for example, a process, method, system, product or device including a series of steps or units does not necessarily have to include those steps or units clearly listed, but can include other steps or units not clearly listed or inherent to the process, method, product or device.

[0057] At present, with the development of Internet technology, more and more information is shared and interacted through the Internet. Internet users can access various types of websites to obtain a large amount of information resources, and can also publish information they want to disclose through websites. A website is composed of webpages, and users read webpages in the website through a webpage browser. Among them, a webpage is an html document containing html tags, and the html tags contain page elements (such as text, pictures, etc.) displayed in the webpage. The webpage browser reads the html document and displays the page elements in the html tags to the webpage.

[0058] In the related art, a commonly used method for constructing a webpage is a web componentization scheme, that is, different page elements are disassembled into components, all components are combined into a component tree according to grouping logic between the components, and a page is constructed according to the generated component tree. However, when a webpage is constructed by using the componentization scheme, all components must be initialized and loaded at runtime, and therefore grouping logic code in the components needs to be executed at code runtime to determine whether corresponding page elements need to be displayed. Therefore, the html document for constructing the webpage must contain the grouping logic code of the components. Since the browser executes a Javascript script language at runtime, and the browser's built-in developer tools can easily obtain the component code, the grouping logic in the code is easy to be cracked, which can cause certain losses. For example, some paid functions in the webpage need to be processed differently according to different customers, and if the grouping logic in the code is cracked, customers who do not meet the conditions can also use the functions, which can cause great losses to the corresponding project. Moreover, the final construction resource package is large, which reduces the running efficiency.

[0059] To solve the above problems, the technical solution of the present application mainly comprises the following steps: determining grouping configuration information in advance, and when constructing a webpage, performing grouping logic judgment on a user input construction command according to the pre-determined grouping configuration information, that is, matching the content in the construction command with the content in each group according to a pre-set matching mode to obtain a matching result of the construction command and each group, and the matching result is used to determine whether the corresponding page element needs to be displayed. An html file is written, the html tags in the html file are provided with grouping identifiers and page elements, and the html tags in the html file are filtered according to the matching result of the construction command and each group, that is, the grouping identifiers in the html tags corresponding to the page elements that need to be displayed are deleted, and the html tags corresponding to the page elements that do not need to be displayed are deleted, so that the final generated html file only contains the tags corresponding to the page elements that need to be displayed, and does not contain any grouping identifier. In this scheme, the grouping logic of the tags is judged at the webpage code construction stage, and it is determined whether the corresponding page element needs to be displayed according to the judgment result, and the grouping identifiers in the html tags corresponding to the page elements that need to be displayed and the html tags corresponding to the page elements that do not need to be displayed are deleted before the webpage is generated. Therefore, when the browser runs the html file to generate the webpage, the html tag grouping logic code does not exist in the browser, which ensures the information security. At the same time, since the final generated html file does not include the grouping logic code, the size of the construction result resource package is also reduced, the time loss of the resource in the network transmission process is reduced, and the running efficiency is improved.

[0060] Figure 1 FIG. 1 is an application scenario diagram of a webpage construction method according to an example embodiment of the present application.

[0061] AsFigure 1 As shown in the figure, the basic architecture of the application scenario provided by the embodiment mainly includes: an operation terminal 101, a server 102 and a display terminal 103; wherein the display terminal can be a mobile phone, a tablet, a computer or any terminal with a display function. The operator inputs a web building code in an html file through the operation terminal, for example, the code input by the operator is Search When the user browses the webpage through the browser on the display terminal, the server reads the html file, and the display terminal displays the webpage showing the word "search".

[0062] Figure 2 FIG. 1 is a flow diagram of a web building method according to an example embodiment of the present application. The execution subject of the method provided by the embodiment can be Figure 1 The server in the embodiment shown can also be a related building tool in the server.

[0063] As shown in the figure, Figure 2 The method provided by the embodiment can include the following steps.

[0064] S201, receiving a building command input by a user.

[0065] Specifically, the developer inputs a corresponding building command through an information input tool (such as a hardware keyboard, a soft keyboard, etc.) according to the page element that needs to be displayed in the webpage to be built.

[0066] It should be noted that the building command can include a target indication parameter determined by the user, which can be used for grouping matching, and the specific matching method is described in the subsequent related embodiments.

[0067] In some embodiments, before receiving the building command input by the user, it is also necessary to configure the command for accepting the parameter and the parameter identifier in the front-end packaging tool webpack, so that webpack can receive the corresponding building command. For example, if the building command input by the developer contains "abc", the command for accepting "abc" and the parameter abc need to be configured in webpack, so that webpack can receive the building command when the developer inputs the corresponding building command.

[0068] S202, according to a preset matching mode, matching the building command with the configuration information of a plurality of groups pre-configured respectively, obtaining a matching result corresponding to each group, and the matching result is used to judge whether the corresponding page element needs to be displayed.

[0069] The configuration information of the plurality of groups can be a set of a plurality of command parameters, a set of a series of strings, or a set of characteristic values based on probability and statistics for advanced configuration. In a specific implementation, the configuration information of the groups can be determined according to a type of a webpage to be constructed.

[0070] Specifically, after receiving the build command, the webpack performs the build command, and matches, by using the webpack-plugin and according to a preset matching mode, content included in the build command with configuration information of a plurality of groups to obtain a matching result corresponding to each group. The matching mode can be determined by a developer, and the matching result corresponding to each group is different for different matching modes. The matching result corresponding to each group is used to determine whether a page element in an html tag corresponding to each group needs to be displayed. The webpack-plugin is a plug-in provided by the present solution based on the webpack mechanism, and the plug-in can be customized to set a build environment.

[0071] For example, the matching mode is determined as a containing mode, and the content included in the build command is compared with configuration information of a first group and configuration information of a second group. If the configuration information of the first group contains the content included in the build command, the build command is matched with the first group successfully. If the configuration information of the second group does not contain the content of the build command, the build command is not matched with the second group.

[0072] S203, according to the matching result, processing an html tag with a group identifier in the compiled html file to delete the group identifier in an html tag corresponding to a page element that needs to be displayed and an html tag corresponding to a page element that does not need to be displayed.

[0073] Specifically, a developer pre-compiles an html file, and the html file includes an html tag with a group identifier. A filtering tool webpack-loader pre-configured in the webpack determines, according to a matching result of the build command and configuration information of each group, whether a page element in an html tag corresponding to each group needs to be displayed.

[0074] For example, if the build command matches the first group successfully, the page element in the html tag with the group identifier of the first group in the html file needs to be displayed, and then the group identifier in all html tags corresponding to the first group in the html file is deleted; if the build command fails to match the second group, the page element in the html tag with the group identifier of the second group in the html file does not need to be displayed, and then the html tags corresponding to the second group in the html file are deleted.

[0075] S204, constructing a web page according to the processed html file.

[0076] Specifically, the server reads the processed html file, parses the html tags in the html file to obtain page elements, and displays the page elements.

[0077] In this embodiment, a build command input by a user is received, and the build command is matched with configuration information of a plurality of groups pre-configured according to a preset matching mode to obtain a matching result corresponding to each group. Since the matching result is used to determine whether the corresponding page element needs to be displayed, the html tags with the group identifier in the html file written can be processed according to the matching result, that is, the group identifier in the html tag corresponding to the page element that needs to be displayed and the html tag corresponding to the page element that does not need to be displayed are deleted, so that the processed html file does not contain the group identifier. The web page constructed by this scheme does not contain group logic code in the browser, reduces the package size of the construction result resource, reduces the time loss of the resource in the network transmission process, and improves the running efficiency.

[0078] In some embodiments, the build command input by the user contains a target indication parameter, and the configuration information of the plurality of groups pre-configured includes a group identifier of each group and an indication parameter set contained in each group. The indication parameter set can be a set of a plurality of command parameters, or a set of a series of strings, and for advanced configuration, it can be a set of characteristic values based on probability and statistics. In specific implementation, the configuration information of the group can be determined according to the type of the web page actually needed to be constructed.

[0079] For example, the configuration information of the group is described by taking a string as an example. It is assumed that the developer pre-configures two groups, and the group identifiers are GROUP1 and GROUP2, respectively. GROUP1 contains three strings: black, white, and red, and GROUP2 contains three strings: good, bad, and abc. The configuration information of the two groups is GROUP1 = black, white, red; and GROUP2 = good, bad, abc, respectively.

[0080] In a possible embodiment, the matching the target indication parameter with each indication parameter in the indication parameter set corresponding to each group identifier according to the preset matching mode to obtain a matching result corresponding to each group identifier comprises: detecting whether there is an indication parameter same as the target indication parameter in the indication parameter set corresponding to the group identifier; if there is, the matching result corresponding to the group identifier is matching success; if not, the matching result corresponding to the group identifier is matching failure.

[0081] The matching mode can be determined by a developer, and the matching result corresponding to each group identifier is different for different matching modes.

[0082] For example, assuming that the matching mode is a containing mode, the user input build command is npm run build–group red (the command is a command for executing webpack build, and the main function is to pass the target indication parameter to webpack), and "red" is the target indication parameter. The configuration information of the two groups is GROUP1 = black, white, red; and GROUP2 = good, bad, abc. The target indication parameter "red" in the build command is matched with the indication parameters corresponding to GROUP1 and GROUP2 respectively. GROUP1 contains the target indication parameter red, so the matching result corresponding to GROUP1 is matching success; GROUP2 does not contain the target indication parameter red, so the matching result corresponding to GROUP2 is matching failure.

[0083] It should be noted that the matching mode can include, but is not limited to, five matching modes, i.e., a containing mode, a full matching mode, a partial matching mode, an exclusion mode and a custom mode. The developer can select the matching mode according to actual needs. The mode selection can be set by setting the corresponding mode in the tool webpack-plugin in the configuration of webpack, and multiple matching modes can be set in the webpack-plugin at a time, and the target indication parameter in the input build command is grouped and judged by the webpack-plugin. The specific matching rules of the five matching modes will be described in detail below.

[0084] In a possible embodiment, if the matching mode is the containing mode, the matching the target indication parameter with each indication parameter in the indication parameter set corresponding to each group identifier according to the preset matching mode to obtain a matching result corresponding to each group identifier comprises: detecting whether there is an indication parameter same as the target indication parameter in the indication parameter set corresponding to the group identifier; if there is, the matching result corresponding to the group identifier is matching success; if not, the matching result corresponding to the group identifier is matching failure.

[0085] Specifically, assuming that two groups are pre-configured, the configuration information of the two groups is GROUP1=black, white, red; GROUP2=good, bad, abc respectively. The input build command is npm run build–group red. It is detected that the target indication parameter red in the build command exists in GROUP1, so the matching result corresponding to GROUP1 is matching success; GROUP2 does not contain the target indication parameter red, so the matching result corresponding to GROUP2 is matching failure.

[0086] In one case of the embodiment, the matching result of the target indication parameter in the input build command and the indication parameter in the configuration information of each group is marked in the global environment variable in the configuration information of each group. In the embodiment, the group identifier is the global environment variable, true is used to represent matching success, and false is used to represent matching failure. For example, in the above example, the matching result corresponding to GROUP1 is matching success, and the matching result corresponding to GROUP2 is matching failure. The matching result is marked in the corresponding global environment variable, and the marking result is IS_GROUP1=true and IS_GROUP2=false.

[0087] It should be noted that according to the containing mode, the case is not distinguished when matching the group, that is, if the input build command is npm run build–group Red or npm run build–group RED, it is considered that the target indication parameter in the build command exists in GROUP1, and the matching result corresponding to GROUP1 is matching success.

[0088] In one possible embodiment, if the matching mode is the full matching mode, the matching of the target indication parameter with each indication parameter in the indication parameter set corresponding to each group identifier according to the preset matching mode to obtain the matching result includes: comparing the content of the target indication parameter with the content of each indication parameter in each indication parameter set, if there is an indication parameter in the indication parameter set that is completely consistent with the content of the target indication parameter, the matching result corresponding to the group identifier is matching success; otherwise, the matching result corresponding to the group identifier is matching failure.

[0089] Specifically, in the full matching mode in the embodiment, each character in the target indication parameter needs to be compared with each character in each indication parameter in the configuration information. When the characters are completely consistent, it is determined that the matching is successful.

[0090] For example, assume that two groups are pre-configured, and the configuration information of the two groups is GROUP1 = black, white, red; GROUP2 = good, bad, abc. The input build command is npm run build–group red, and the matching result corresponding to GROUP1 is a match success, and the matching result corresponding to GROUP2 is a match failure. If the input build command is npm run build–group RED, after matching in the full matching mode, the target indication parameter RED in the build command is not completely consistent with the indication parameter red in GROUP1, and thus the matching result corresponding to GROUP1 is a match failure, and the matching result corresponding to GROUP2 is a match failure.

[0091] In one case of the embodiment, the matching result of the target indication parameter in the input build command and the indication parameter in the configuration information of each group is marked in the global environment variable in the configuration information of the corresponding group. For example, in the above example, the matching result corresponding to GROUP1 is a match failure, and the matching result corresponding to GROUP2 is a match failure, and thus the matching result is marked in the corresponding global environment variable, and the marking result is IS_GROUP1 = false and IS_GROUP2 = false.

[0092] In one possible embodiment, if the matching mode is the partial matching mode, the matching of the target indication parameter with each indication parameter in the indication parameter set corresponding to each group identifier to obtain the matching result includes: comparing the content of the target indication parameter with the content of each indication parameter in each indication parameter set, and if there is an indication parameter in the indication parameter set that contains the content of the target indication parameter, the matching result corresponding to the corresponding group identifier is a match success; otherwise, the matching result corresponding to the corresponding group identifier is a match failure.

[0093] For example, assume that two groups are pre-configured, and the configuration information of the two groups is GROUP1 = black, white, red; GROUP2 = good, bad, abc. The input build command is npm run build–group d, and the letter d is compared with the letters in each indication parameter in GROUP1 and GROUP2. According to the comparison, red in GROUP1 and good and bad in GROUP2 all contain the letter d, and thus the matching result corresponding to GROUP1 is a match success, and the matching result corresponding to GROUP2 is also a match success.

[0094] In one case of the embodiment, the matching result of the target indication parameter in the input build command and the indication parameter in each grouping configuration information is marked in the global environment variable in the configuration information of the corresponding group respectively. For example, in the above example, the matching result corresponding to GROUP1 is matching success, and the matching result corresponding to GROUP2 is matching success. The matching result is marked in the corresponding global environment variable, and the marking result is IS_GROUP1=true and IS_GROUP2=true.

[0095] In one possible embodiment, if the matching mode is the exclusion mode, the matching of the target indication parameter with each indication parameter in the indication parameter set corresponding to each group identifier according to the preset matching mode to obtain a matching result includes: detecting whether there is an indication parameter same as the target indication parameter in the indication parameter set corresponding to the group identifier; if there is, the matching result corresponding to the group identifier is matching failure; if not, the matching result corresponding to the group identifier is matching success.

[0096] Specifically, the exclusion mode is opposite to the above-mentioned inclusion mode. For example, the configuration information of two groups is GROUP1=black, white, red; GROUP2=good, bad, abc respectively. The input build command is npm run build-group red. Red is matched with each indication parameter in GROUP1 and GROUP2. According to the matching, it is known that GROUP1 contains red, and GROUP2 does not contain red. Therefore, the matching result corresponding to GROUP1 is matching failure, and the matching result corresponding to GROUP2 is matching success.

[0097] In one case of the embodiment, the matching result of the target indication parameter in the input build command and the indication parameter in each grouping configuration information is marked in the global environment variable in the configuration information of the corresponding group respectively. For example, in the above example, the matching result corresponding to GROUP1 is matching success, and the matching result corresponding to GROUP2 is matching success. The matching result is marked in the corresponding global environment variable, and the marking result is IS_GROUP1=false and IS_GROUP2=true.

[0098] In a possible embodiment, the custom mode is an advanced mode, which is mainly used for custom complex logic grouping. When this mode is applied, the corresponding logic function needs to be passed into the conditional parameter of the webpack-plugin plug-in. When the build command is executed, the matching result corresponding to each group identifier is obtained according to the running result of the conditional parameter, wherein the webpack-plugin is a plug-in mechanism provided by webpack, which can be used to customize the build environment. The main application scenario of this mode is complex conditional logic or calculation based on a complex statistical model, which is used as a precondition for special display logic display.

[0099] In some embodiments, a webpack-loader for custom tag filtering is introduced in the webpack configuration file, and the tag filtering is performed before the execution of other webpack-loaders. At the same time, the group identifier prefix in each html tag in the html file is passed into the webpack-loader, and the group judgment result obtained in the webpack-plugin is passed into the webpack-loader. The html tag with the group identifier in the html file is filtered by the webpack-loader according to the group judgment result. The implementation of the method for filtering the html tag with the group identifier in the completed html file according to the build command and the matching result of each group is as follows:

[0100] First, the html tag with the group identifier in the html file is filtered according to the matching result, and then it is judged whether the page element in the html tag corresponding to each group identifier in the html file needs to be displayed in the webpage according to the matching result corresponding to each group identifier. The group identifier in the html tag corresponding to the page element that needs to be displayed and the html tag corresponding to the page element that does not need to be displayed are deleted.

[0101] Specifically, if the matching result corresponding to the group identifier is a matching success, the page element in the html tag corresponding to the group identifier in the html file needs to be displayed in the webpage. If the matching result corresponding to the group identifier is a matching failure, the page element in the html tag corresponding to the group identifier in the html file does not need to be displayed in the webpage.

[0102] In one case of the present embodiment, it is judged whether the condition IS_GROUP is established. If it is established, it means that the target indication parameter in the build command matches the group GROUP successfully. If it is not established, it means that the matching fails. If IS_GROUP=true, it means that the condition is established. If IS_GROUP=false, it means that the condition is not established.

[0103] For example, the configuration information of the two groups is respectively GROUP1 = black, white, red; GROUP2 = good, bad, abc, and the input build command is npm run build-group red. The code contained in the generated html file is as follows:

[0104]

[0105] <group1-div>BAT< / group1-div>

[0106] <group2-div>MTP< / group2-div>

[0107]

[0108] wherein, “ <group1-div>BAT< / group1-div> ” and “ <group2-div>MTP< / group2-div> ” are two html tags, BAT and MTP are page elements in the two html tags, and group1 and group2 are group identifiers of the two groups.

[0109] If the input build command matches the two groups in the containing mode, the matching result is that the matching result corresponding to GROUP1 is matching success (i.e. IS_GROUP1 = true), and the matching result corresponding to GROUP2 is matching failure (i.e. IS_GROUP2 = false). According to the matching result, it can be known that, in the two html tags in the html file, <group1-div>BAT< / group1-div> BAT is a page element that needs to be displayed in the webpage, and MTP is a page element that does not need to be displayed in the webpage. Therefore, the group identifier prefix “group1-” and <group1-div>BAT< / group1-div> in <group2-div>MTP< / group2-div> need to be deleted. The code contained in the processed html file is as follows:

[0110]

[0111] BAT

[0112]

[0113] Therefore, the code in the processed html file does not exist group logic code at all.

[0114] In a possible case of the embodiment, if the page element that the developer wants to display in the webpage is not MTP but BAT, the developer only needs to change the target indication parameter in the build command from red to an indication parameter in GROUP2, which can be any one or more of good, bad and abc, or change the configuration information of the groups, for example, add red to the indication parameters in GROUP2.

[0115] It should be noted that if the input construction command matches two groups, other matching modes are used, and the final formed html file can have other conditions. For example, if the exclusion mode is used, the group matching result is that the matching result corresponding to GROUP1 is a matching failure (i.e., IS_GROUP1 = false), and the matching result corresponding to GROUP2 is a matching success (i.e., IS_GROUP2 = true), and thus the group identification prefix "group2" in <group1-div>BAT< / group1-div> and <group2-div>MTP< / group2-div> is deleted. The final obtained processed html file contains the following code:

[0116]

[0117] MTP

[0118]

[0119] It should be noted that regardless of which of the above six matching modes is used in group matching, the process of processing the html tags with group identification in the completed html file according to the matching result is similar to the above processing process, and will not be described one by one here.

[0120] Further, the specific implementation manner of filtering the html tags in the html file is that after extracting the html tags with group identification in the html file according to the group matching result, the html tags in the html file are converted into an abstract syntax tree (Abstract Syntax code, AST), each html tag in the html file corresponds to a node in the abstract syntax tree, and the nodes in the abstract syntax tree are filtered according to the group matching result, and the processed abstract syntax tree is converted into an html file. Specifically, see Figure 3 , which can include the following steps.

[0121] S301, extracting all html tags in the html file.

[0122] Specifically, since all html tags in the html file have group identification, all html tags with group identification in the html file can be extracted according to the matching result corresponding to the group identification.

[0123] S302, parsing the extracted html tags to obtain the parent-child relationship between all html tags.

[0124] S303, determining the node attribute features and parent-child node relationship corresponding to each html tag according to the parent-child relationship between the html tags.

[0125] Specifically, the xml parsing tool is used to decompose the corresponding parent-child relationship of all tags, and according to the relationship, the corresponding AST attribute characteristics and the parent-child node relationship of each tag are marked.

[0126] For example, the xml parsing tool can obtain that there is a parent-child relationship between the first tag and the second tag, and the first tag is the parent tag and the second tag is the child tag, so the first node corresponding to the first tag and the second node corresponding to the second tag have a parent-child node relationship, and the first node is the parent node and the second node corresponding to the second tag is the child node.

[0127] S304, generating an abstract syntax tree with the parent node as the root node.

[0128] For example, it is assumed that the written html file contains five html tags, in which A, B, C, D and E are used to represent the page elements contained in the five html tags respectively, and the specific code is as follows:

[0129]

[0130] <group1-div> A< / group1-div>

[0131] <group2-div> B< / group2-div>

[0132] <group3-div> C

[0133] <group4-div> D

[0134] <group5-div> E

[0135] < / group5-div> < / group4-div> < / group3-div>

[0136] For convenience of description, the html tags corresponding to the five grouping identifiers (group1-group5) are called first tag, second tag, third tag, fourth tag and fifth tag respectively. Then, it is assumed that the corresponding parent-child relationship of the five tags decomposed by the xml parsing tool is that the first tag and the second tag and the third tag have a parent-child relationship, and the first tag is the parent tag of the second tag and the third tag; the second tag and the fourth tag and the fifth tag have a parent-child relationship, and the second tag is the parent tag of the fourth tag and the fifth tag. Then, according to the relationship, the corresponding AST attribute characteristics and the parent-child node relationship of each tag are marked, and it can be obtained that the first node corresponding to the first tag and the second node corresponding to the second tag and the third node corresponding to the third tag have a parent-child node relationship, and the first node is the parent node of the second node and the third node, that is, the second node and the third node are the child nodes of the first node; the second node is the parent node of the fourth node corresponding to the fourth tag and the fifth node corresponding to the fifth tag, and the fourth node and the fifth node are the child nodes of the second node. The abstract syntax tree finally generated with the parent node as the root node is shown in Figure 4

[0137] ​Further, after the abstract syntax tree corresponding to the html file is established, the nodes in the abstract syntax tree are filtered, specifically including: if the matching result corresponding to the group identifier is matching success, then depth-first traverse all first nodes with the group identifier in the abstract syntax tree, and delete the group identifier prefix in the first node; if the matching result corresponding to the group identifier is matching failure, then breadth-first traverse all first nodes with the group identifier in the abstract syntax tree, and delete the first node.

[0138] In one case of the embodiment, it is judged whether the condition IS_GROUP is established, if yes, it means that the target indication parameter in the construction command matches the group GROUP successfully, then depth-first traverse all nodes with the group identifier in the abstract syntax tree. If not, it means matching failure, then breadth-first traverse all nodes with the group identifier in the abstract syntax tree.

[0139] Specifically, it is assumed that IS_GROUP5 is established (IS_GROUP5=true), that is, the matching result corresponding to group5 is matching success, then depth-first traverse all html nodes with group5- prefix, and remove the prefix of the corresponding html node, so that <group5-div> E< / group5-div> the html node is converted into a tag that can be recognized by the browser. E If IS_GROUP5=false, then breadth-first traverse all html nodes of group5, and directly remove the node in the abstract syntax tree.

[0140] For example, it is assumed that the group matching result obtained after grouping matching is that the matching result corresponding to group1, group2, group3 and group4 is matching success, and the matching result corresponding to group5 is matching failure, then the abstract syntax tree after filtering is as shown in Figure 5 .

[0141] Further, the new abstract syntax tree obtained is converted into a new html file.

[0142] Specifically, the new abstract syntax tree after filtering (as shown in Figure 5 ) is converted into a new html file, and the new html file contains the following content:

[0143]

[0144] A

[0145] B

[0146] C

[0147] D

[0148]

[0149] It should be noted that the filtering process of the html file in the embodiment is completed in webpack-loader, and after the new html file after processing is obtained, the new html file is returned to webpack.

[0150] In this embodiment, the purpose of using depth-first traversal when the matching is successful is that when there are multiple matching conditions, the logical relationship of parent-child node nesting will occur, and then all leaf nodes and their child nodes of the branch need to be searched when searching. The advantage of doing this is that it can guarantee that all preset conditions can be met and the correctness of the output structure.

[0151] For example, <group1-div> <group2-div> <group1-div>When the matching result corresponding to group1 is a matching success, it cannot be guaranteed that the child node group2 satisfies the filtering condition, so it is necessary to search downwards, if the matching result corresponding to group2 is a matching success, the group2 node is retained, if group2 matching fails, the group2 node is removed.

[0152] In the embodiment, the purpose of breadth-first traversal when matching a node with a matching failure is that when a node with a matching failure is matched, the node needs to be deleted, and since the inclusion relationship of the xml language itself determines that the child nodes do not need to be retained, it is unnecessary to continue to traverse the node state. The advantage of this is to improve the search efficiency and reduce unnecessary overhead.

[0153] In the embodiment, since the processing logic of the grouping tag in the html file is completely completed during code construction, the present application has the following advantages compared with the existing web componentization scheme.

[0154] First, improve the running efficiency. The conventional web componentization scheme needs to execute grouping operation logic during code running to determine whether the page element needs to be displayed, and the present application can complete this function without grouping logic code in the browser, thereby improving the running efficiency, reducing the package size of the construction result resource, and reducing the time loss of the resource in the network transmission process.

[0155] Second, reduce the security risk. Since the browser runs Javascript script language, and the developer tool of the browser can easily obtain the code. If the grouping logic exists in the source code and is cracked (such as some paid functions need to be processed differently according to different customers, and if the cracked customers do not meet the conditions, they can also use the function), it will cause unpredictable loss to the project. Using the webpage construction method of the present application, the grouping logic does not exist in the browser, and the grouping logic cannot be analyzed from the obtained code, thereby protecting the intellectual property rights to some extent.

[0156] Third, the running-time logic is brought forward to the construction time, so that the webpage front-end project is more engineering. Using the conventional web componentization scheme, javascript patches need to be made everywhere in the source code, which is not easy to maintain and has poor readability. Using the webpage construction method of the present application, the display of the page element is completely completed by the construction tool (webpack, webpack-plugin and webpack-loader), and the developer only needs to adjust the grouping configuration information and the target indication parameter in the construction command to change the display of the page element, thereby improving the readability and maintainability of the code.

[0157] Figure 6 Fig. 1 is a structural schematic diagram of a webpage construction device shown in an exemplary embodiment of the present application.

[0158] As Figure 6 shown, the webpage construction device provided by the embodiment comprises a receiving module 601, a matching module 602, a processing module 603 and a construction module 604; wherein the receiving module 601 is configured to receive a construction command input by a user; the matching module 602 is configured to match the construction command with a plurality of groups of configuration information pre-configured according to a preset matching mode, to obtain a matching result corresponding to each group, the matching result being used to determine whether a corresponding page element needs to be displayed; the processing module 603 is configured to process an html tag with a group identifier in a completed html file according to the matching result, to delete a group identifier prefix in an html tag corresponding to a page element that needs to be displayed and the html tag corresponding to a page element that does not need to be displayed; and the construction module 604 is configured to construct a webpage according to the processed html file.

[0159] Further, the construction command comprises a target indication parameter, the configuration information comprises a group identifier and a corresponding indication parameter set; and the matching mode is specifically configured to:

[0160] match the target indication parameter with each indication parameter in the indication parameter set corresponding to each group identifier according to the preset matching mode, to obtain a matching result corresponding to each group identifier.

[0161] Further, the matching mode is specifically configured to:

[0162] detect whether there is an indication parameter identical to the target indication parameter in the indication parameter set corresponding to the group identifier; if there is, the matching result corresponding to the group identifier is matching success; and if there is not, the matching result corresponding to the group identifier is matching failure.

[0163] Further, the matching mode is further configured to:

[0164] compare a content of the target indication parameter with a content of each indication parameter in each indication parameter set; if there is an indication parameter identical to the content of the target indication parameter in the indication parameter set, the matching result corresponding to the group identifier is matching success; otherwise, the matching result corresponding to the group identifier is matching failure.

[0165] Further, the matching mode is further configured to:

[0166] The content of the target indication parameter is compared with the content of each indication parameter in each indication parameter set. If there is an indication parameter in the indication parameter set that contains the content of the target indication parameter, the corresponding matching result of the group identifier is matching success. Otherwise, the corresponding matching result of the group identifier is matching failure.

[0167] Further, the matching mode is further used for:

[0168] It is detected whether there is an indication parameter same as the target indication parameter in the indication parameter set corresponding to the group identifier. If there is, the matching result corresponding to the group identifier is matching failure. If not, the matching result corresponding to the group identifier is matching success.

[0169] Further, the html tag contains a page element, and the processing module is specifically used for:

[0170] According to the matching result corresponding to each group identifier, it is judged whether the page element in the html tag corresponding to each group identifier in the html file needs to be displayed in the webpage.

[0171] The group identifier prefix in the html tag corresponding to the page element that needs to be displayed and the html tag corresponding to the page element that does not need to be displayed are deleted.

[0172] Further, the processing module is specifically used for:

[0173] If the matching result corresponding to the group identifier is matching success, the page element in the html tag corresponding to the group identifier in the html file needs to be displayed in the webpage.

[0174] If the matching result corresponding to the group identifier is matching failure, the page element in the html tag corresponding to the group identifier in the html file does not need to be displayed in the webpage.

[0175] Further, the processing module is specifically used for:

[0176] According to the html tag in the html file, an abstract syntax tree is generated, and each node in the abstract syntax tree corresponds to an html tag.

[0177] If the matching result corresponding to the group identifier is matching success, all first nodes with the group identifier in the abstract syntax tree are depth-first traversed, and the group identifier prefix in the first node is deleted. If the matching result corresponding to the group identifier is matching failure, all first nodes with the group identifier in the abstract syntax tree are breadth-first traversed, and the first node is deleted.

[0178] Convert the new abstract syntax tree into a new html file.

[0179] Further, the processing module is specifically configured to:

[0180] extract all html tags in the html file;

[0181] parsing the extracted html tags to obtain the parent-child relationship between all html tags;

[0182] determine the node attribute features and parent-child node relationship corresponding to each html tag according to the parent-child relationship between the html tags;

[0183] generate an abstract syntax tree with the parent node as the root node.

[0184] The detailed function of each module in the embodiment is described with reference to the description of the method in the embodiment, which will not be described in detail here.

[0185] It can be understood that the same or similar parts in the above embodiments can be mutually referenced, and the contents not described in detail in some embodiments can be referred to the same or similar contents in other embodiments.

[0186] Figure 7 The hardware structure schematic diagram of the computer device provided in the embodiment of the present application is shown in the figure. Figure 7 As shown in the figure, the computer device 700 provided in the embodiment of the present application includes at least one processor 701 and a memory 702. Wherein, the processor 701 and the memory 702 are connected through a bus 703.

[0187] In the specific implementation process, the at least one processor 701 executes the computer execution instructions stored in the memory 702, so that the at least one processor 701 executes the webpage construction method in the above method embodiment.

[0188] The specific implementation process of the processor 701 can be referred to the above method embodiment, which has similar implementation principles and technical effects, and will not be described here.

[0189] In the above Figure 7 In the illustrated embodiment, it is to be understood that the processor can be a central processing unit (CPU), and can also be other general purpose processors, digital signal processors (DSP), application specific integrated circuits (ASIC), etc. The general purpose processor can be a microprocessor or the processor can also be any conventional processor. The steps of the disclosed method can be directly embodied as hardware processor execution or a combination of hardware and software modules in the processor.

[0190] The memory can include a high-speed RAM memory, and can also include a non-volatile storage NVM, such as at least one disk memory.

[0191] The bus can be an Industry Standard Architecture (ISA) bus, a Peripheral Component Interconnect (PCI) bus, or an Extended Industry Standard Architecture (EISA) bus, etc. The bus can be divided into an address bus, a data bus, a control bus, etc. For ease of representation, the bus in the drawings of the present application does not limit to only one bus or one type of bus.

[0192] Another embodiment of the present application provides a computer readable storage medium, the computer readable storage medium stores computer execution instructions, when the processor executes the computer execution instructions, the web page construction method in the above method embodiment is realized.

[0193] The above computer readable storage medium, the above readable storage medium can be realized by any type of volatile or non-volatile storage device or their combination, such as static random access memory (SRAM), electrically erasable programmable read-only memory (EEPROM), erasable programmable read-only memory (EPROM), programmable read-only memory (PROM), read-only memory (ROM), magnetic memory, flash memory, magnetic disk or optical disk. The readable storage medium can be any available medium that can be accessed by a general or special purpose computer.

[0194] An example readable storage medium is coupled to the processor such that the processor can read information from the readable storage medium and can write information to the readable storage medium. Of course, the readable storage medium can be a part of the processor. The processor and the readable storage medium can be located in an application specific integrated circuits (ASIC). Of course, the processor and the readable storage medium can exist as discrete components in the device.

[0195] Those skilled in the art can understand that all or part of the steps of the above-mentioned method embodiments can be completed by program instruction related hardware. The foregoing program can be stored in a computer readable storage medium. The program executes to perform the steps of the above-mentioned method embodiments; and the foregoing storage medium includes: ROM, RAM, magnetic disk or optical disk and various storage medium that can store program codes.

[0196] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present application, and not to limit them; although the present application has been described in detail with reference to the foregoing embodiments, those skilled in the art should understand that they can still modify the technical solutions recorded in the foregoing embodiments, or make equivalent replacement for part or all of the technical features; and these modifications or replacements do not make the essence of the corresponding technical solutions deviate from the scope of the technical solutions of the embodiments of the present application. < / group2-div> < / group1-div>

Claims

1. A webpage construction method, characterized in that, include: Receive build commands input by developers, the build commands including target indication parameters; According to the preset matching mode, the target indicator parameter is matched with each indicator parameter in the indicator parameter set corresponding to each group identifier in the pre-configured multiple groups to obtain the matching result corresponding to each group identifier. The matching result is used to determine whether the corresponding page element needs to be displayed. Based on the matching results, the HTML tags with group identifiers in the completed HTML file are processed to remove the group identifier prefixes from the HTML tags corresponding to the page elements that need to be displayed and the HTML tags corresponding to the page elements that do not need to be displayed. Build a webpage from the processed HTML file; The step of processing the HTML tags with grouping identifiers in the completed HTML file based on the matching results includes: An abstract syntax tree is generated based on the HTML tags in the HTML file, where each node in the abstract syntax tree corresponds to an HTML tag. If the matching result corresponding to the group identifier is a successful match, then a depth-first traversal is performed on all first nodes in the abstract syntax tree that contain the group identifier, and the group identifier prefix in the first node is deleted; if the matching result corresponding to the group identifier is a failed match, then a breadth-first traversal is performed on all second nodes in the abstract syntax tree that contain the group identifier, and the second node is deleted. The resulting abstract syntax tree will be converted into a new HTML file.

2. The method according to claim 1, characterized in that, The step of matching the target indication parameter with each indication parameter in the indication parameter set corresponding to each group identifier in a pre-configured plurality of groups according to a preset matching mode, to obtain a matching result corresponding to each group identifier, includes: Check if there is an indication parameter in the set of indication parameters corresponding to the group identifier that is the same as the target indication parameter; if it exists, the matching result corresponding to the group identifier is a successful match; if it does not exist, the matching result corresponding to the group identifier is a failed match.

3. The method according to claim 1, characterized in that, The step involves matching the target indication parameter with each indication parameter in the indication parameter set corresponding to each group identifier in a pre-configured plurality of groups according to a preset matching mode, to obtain a matching result, including: The content of the target indication parameter is compared with the content of each indication parameter in each indication parameter set. If there is an indication parameter in the indication parameter set that is completely consistent with the content of the target indication parameter, the matching result corresponding to the group identifier is a successful match; otherwise, the matching result corresponding to the group identifier is a failed match.

4. The method according to claim 1, characterized in that, The step involves matching the target indication parameter with each indication parameter in the indication parameter set corresponding to each group identifier in a pre-configured plurality of groups according to a preset matching mode, to obtain a matching result, including: The content of the target indication parameter is compared with the content of each indication parameter in each indication parameter set. If there is an indication parameter in the indication parameter set that contains the content of the target indication parameter, the matching result corresponding to the corresponding group identifier is a successful match; otherwise, the matching result corresponding to the corresponding group identifier is a failed match.

5. The method according to claim 1, characterized in that, The step involves matching the target indication parameter with each indication parameter in the indication parameter set corresponding to each group identifier in a pre-configured plurality of groups according to a preset matching mode, to obtain a matching result, including: Check if there is an indication parameter in the set of indication parameters corresponding to the group identifier that is the same as the target indication parameter; if it exists, the matching result corresponding to the group identifier is a match failure; if it does not exist, the matching result corresponding to the group identifier is a match success.

6. The method according to any one of claims 1-5, characterized in that, The HTML tags contain page elements. The process of processing the HTML tags with grouping identifiers in the completed HTML file based on the matching results includes: Based on the matching results corresponding to each group identifier, determine whether the page elements in the HTML tags corresponding to each group identifier in the HTML file need to be displayed on the webpage; Remove the grouping prefix from the HTML tags of the page elements that need to be displayed and the HTML tags of the page elements that do not need to be displayed.

7. The method according to claim 6, characterized in that, The step of determining whether the page elements in the HTML tags corresponding to each group identifier in the HTML file need to be displayed on the webpage based on the matching results corresponding to each group identifier includes: If the matching result corresponding to the group identifier is a successful match, then the page element in the HTML tag corresponding to the group identifier in the HTML file needs to be displayed on the webpage; If the matching result corresponding to the group identifier is a failure, then the page element in the HTML tag corresponding to the group identifier in the HTML file does not need to be displayed on the webpage.

8. The method according to claim 1, characterized in that, The step of generating an abstract syntax tree based on the HTML tags in the HTML file includes: Extract all HTML tags from the HTML file; The extracted HTML tags are parsed to obtain the parent-child relationships between all HTML tags; Based on the parent-child relationship between HTML tags, determine the node attribute characteristics and parent-child node relationship corresponding to each HTML tag; Generate an abstract syntax tree with the parent node as the root node.

9. A webpage building device, characterized in that, include: A receiving module is used to receive build commands input by developers, the build commands including target indication parameters; The matching module is used to match the target indicator parameter with each indicator parameter in the indicator parameter set corresponding to each group identifier in a pre-configured plurality of groups according to a preset matching mode, so as to obtain the matching result corresponding to each group identifier. The matching result is used to determine whether the corresponding page element needs to be displayed. The processing module is used to process the HTML tags with grouping identifiers in the completed HTML file according to the matching results, so as to delete the grouping identifier prefix in the HTML tags corresponding to the page elements to be displayed and the HTML tags corresponding to the page elements not to be displayed. The build module is used to construct web pages from the processed HTML file; The matching module is specifically used to: generate an abstract syntax tree based on the html tags in the html file, where each node in the abstract syntax tree corresponds to an html tag; if the matching result corresponding to the group identifier is a successful match, then perform a depth-first traversal of all first nodes in the abstract syntax tree that contain the group identifier, and delete the group identifier prefix in the first node; If the matching result corresponding to the group identifier is a failure, then traverse all second nodes with the group identifier in the abstract syntax tree in a breadth-first manner and delete the second node; The resulting abstract syntax tree will be converted into a new HTML file.

10. A computer device, characterized in that, include: At least one processor and memory; The memory stores computer-executed instructions; The at least one processor executes the computer execution instructions stored in the memory, causing the at least one processor to perform the web page construction method as described in any one of claims 1-8.

11. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores computer-executable instructions, which, when executed by a processor, implement the web page construction method as described in any one of claims 1-8.

Citation Information

Patent Citations

  • Method, device and system for extracting webpage content

    CN104866512A

  • Method and device for extracting page information

    CN105589913A