Web page output method, system and computer-readable storage medium

Abstract

An embodiment of the present invention discloses a web page output method, and the method includes: generating a selection parameter based on a comparison result between real-time request data and a preset first routing table, where the real-time request data is read by a server side, and a plurality of web page template data are stored in the first routing table; obtaining a corresponding page to be rendered according to the selection parameter; performing a rendering operation on the page to be rendered based on the real-time request data to generate a corresponding target output page, and outputting a target output interface by a browser side for display. In addition, the present invention also discloses a web page output system and a computer storage medium applying the web page output method. The present invention can flexibly select the main body of page rendering, improves the flexibility of web page operation, and is beneficial to reducing the first screen time and display accuracy of web page display.

Description

Technical Field

[0001] The present invention relates to the technical field of front - end development, and in particular, to a web page output method, system, and computer - readable storage medium. Background Art

[0002] In Internet front - end development technology, human - computer interaction is realized by designing web pages, and the rendering of pages can well improve the interaction effect and user experience. Currently, there are generally two ways of web page output: one is that the server directly sends resource files such as HTML to the user - end for application construction and corresponding rendering, and then web page output is realized; the other is that the user - end directly displays the HTML file constructed and rendered by the server - end. Among them, in the first way, since the rendering operation needs to be performed at the user - end, the first - screen time of the web page display will be relatively long; in the second way, when the server load is heavy, rendering errors may occur, and during the process of transmitting the HTML file from the server - end to the user - end, file loss and other situations may occur.

[0003] In summary, the existing control flow of web page output has problems such as long first - screen time and inaccurate display. How to solve this problem is an urgent problem to be solved in the existing technology. Summary of the Invention

[0004] In view of this, the present invention provides a web page output method, system, and computer - readable storage medium, which is beneficial to improving the first - screen time and display accuracy of web page display by flexibly selecting the execution entity of web page rendering.

[0005] In a first aspect, an embodiment of the present invention provides a web page output method, and the method includes:

[0006] Generating a selection parameter based on the comparison result between real - time request data and a preset first routing table, where the real - time request data is read by the server - end, and a plurality of web page template data are stored in the first routing table;

[0007] Obtaining a corresponding page to be rendered according to the selection parameter;

[0008] Performing a rendering operation on the page to be rendered based on the real - time request data to generate a corresponding target output page, and outputting the target output interface by the browser - end for display.

[0009] Optionally, the generating a selection parameter based on the comparison result between real - time request data and a preset first routing table includes:

[0010] Obtaining unique identification information corresponding to each piece of the web page template data, where the unique identification information is used to distinguish each piece of the web page template data;

[0011] Generate a corresponding set based on the unique identification information of all the web page template data, and generate the first routing table according to the set.

[0012] Optionally, the obtaining of the corresponding page to be rendered according to the selection parameter includes:

[0013] Determine whether there is the web page template data corresponding to the real-time request data in the first routing table;

[0014] If so, generate the corresponding page to be rendered based on the selection parameter and the first routing table;

[0015] If not, obtain a preset display page according to the selection parameter, and render the preset display page by the server side based on the real-time request data and then transmit it to the browser side for display.

[0016] Optionally, the performing a rendering operation on the page to be rendered based on the real-time request data to generate a corresponding target output page includes:

[0017] Determine all page component data required to generate the target output page based on the first routing table;

[0018] Render the page to be rendered according to all the page components to generate the target output page.

[0019] Optionally, the performing a rendering operation on the page to be rendered based on the real-time request data to generate a corresponding target output page includes:

[0020] Obtain the page to be rendered sent by the server side and the rendering requirement data corresponding to the page to be rendered;

[0021] Build a corresponding application based on the rendering requirement data, and render the page to be rendered according to the application to generate the target output page.

[0022] Optionally, the building a corresponding application based on the rendering requirement data, and rendering the page to be rendered according to the application to generate the target output page includes:

[0023] Obtain page component data corresponding to the page to be rendered in a preset second routing table based on the application, where the second routing table is set on the browser side;

[0024] Render the page to be rendered by the browser side based on the page component data to generate the target output page.

[0025] Optionally, rendering the page to be rendered by the browser side based on the page component data to generate the target output page includes:

[0026] Obtain the page to be rendered sent by the server side and the first DOM (Document Object Model) data corresponding to the page to be rendered;

[0027] Obtain the second DOM data corresponding to the application;

[0028] Determine whether the first DOM data and the second DOM data match;

[0029] If they match, the browser side outputs the target output page, and performs an event binding operation on the target output page based on the first DOM data or the second DOM data;

[0030] If they do not match, the browser side feeds back the preset information corresponding to the non - match to the server side; or

[0031] Obtain the number of requests generated for the target output page request based on the real - time request data;

[0032] In the case where the number of requests is not less than one, the server side sends the target output page to the browser side again and generates corresponding prompt information; or

[0033] The browser displays and outputs the target output page as the display page.

[0034] Optionally, the determination of whether the first DOM data and the second DOM data match includes:

[0035] Obtain the number of page nodes included in the target output page;

[0036] Select a preset comparison algorithm based on the number of page nodes;

[0037] Judge whether the first DOM data and the second DOM data match according to the comparison algorithm.

[0038] In a second aspect, an embodiment of the present invention further provides a web page output system. The web page output system includes: a browser side and a server side. Both the browser side and the server side include a page rendering module and a page generation module. The browser side further includes a page output module, and the server side further includes a data comparison module and a selection module; wherein,

[0039] The data comparison module is used to generate a selection parameter based on the comparison result between the real-time request data and a preset first routing table. The real-time request data is read by the server side, and a number of web page template data are stored in the first routing table.

[0040] The selection module is used to obtain a corresponding page to be rendered according to the selection parameter.

[0041] The page rendering module is used to perform a rendering operation on the page to be rendered based on the real-time request data to generate a corresponding target output page.

[0042] The page generation module is used to generate the target output page after the page rendering module performs the rendering operation.

[0043] The page output module is used to perform transmission output and display output on the target output page.

[0044] In a third aspect, an embodiment of the present invention further provides a computer-readable storage medium, on which a computer program is stored. When the computer program is executed by a processor, the web page output method described in any one of the above is implemented.

[0045] For the web page output method, system and computer-readable storage medium according to the embodiments of the present invention, when the server receives the real-time request data corresponding to the page display request sent by the user, a selection parameter will be determined according to the comparison between the real-time request data and the first routing table set on the server side. Based on this selection parameter, the acquisition method of the page to be rendered can be determined, that is, it is determined whether there is a page to be rendered corresponding to the real-time request parameter in the first routing table. If so, the server side obtains the page to be rendered from the first routing table, renders it and then sends it to the browser side; if not, the server side renders the preset display interface and then sends it to the browser side; finally, it is output and displayed through the browser side for the user to use. The web page output method of the present invention is beneficial to improving the flexibility of web page rendering by flexibly selecting the main body of web page rendering. Because the rendering of the page to be rendered by the server side is only limited to the most basic page components required for display to the user, the problem of long first-screen time caused by browser-side rendering and the problem of incorrect web page display caused by server-side rendering can be solved, giving users a good operation experience during the rendering process. BRIEF DESCRIPTION OF THE DRAWINGS

[0046] Figure 1 is a flowchart of a web page output method provided by an embodiment of the present invention;

[0047] Figure 2 is a flowchart for constructing the first routing table in an embodiment of the present invention;

[0048] Figure 3Flowchart for selecting the page to be rendered according to an embodiment of the present invention;

[0049] Figure 4 Flowchart for implementing web page rendering according to an embodiment of the present invention;

[0050] Figure 5 Flowchart for implementing another web page rendering according to an embodiment of the present invention;

[0051] Figure 6 Flowchart for implementing yet another web page rendering according to an embodiment of the present invention;

[0052] Figure 7 Schematic structural diagram of a web page output system provided by an embodiment of the present invention;

[0053] Figure 8 Schematic structural diagram of a computer device provided by an embodiment of the present invention. Detailed implementation manners

[0054] In order to make the objectives, technical solutions and advantages of the present application clearer, the present application will be further described in detail below with reference to the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are only used to explain the present application and are not used to limit the present application.

[0055] Before discussing the exemplary embodiments in more detail, it should be mentioned that some exemplary embodiments are described as processes or methods depicted as flowcharts. Although the flowcharts depict the steps as sequential processes, many of the steps can be implemented in parallel, concurrently or simultaneously. In addition, the order of the steps can be rearranged. The process can be terminated when its operations are completed, but it can also have additional steps not included in the drawings. The process can correspond to a method, function, procedure, subroutine, subprogram, etc.

[0056] In addition, terms such as "first", "second", etc. may be used in this application to describe various directions, actions, steps or elements, etc., but these directions, actions, steps or elements are not limited by these terms. These terms are only used to distinguish the first direction, action, step or element from another direction, action, step or element. Terms such as "first" and "second" should not be construed as indicating or implying relative importance or implicitly indicating the quantity of the indicated technical features. Thus, features defined with "first" and "second" may explicitly or implicitly include one or more of such features. In the description of the present invention, the meaning of "plurality" and "batch" is at least two, such as two, three, etc., unless otherwise specifically defined.

[0057] Embodiment 1

[0058] In Internet technology, a proper interaction page can provide users with a good interaction experience with the Internet. Therefore, during the web page display process, the interface to be displayed to users is generally rendered to a certain extent. However, in the prior art, if the page is only rendered through the browser side, it may lead to a relatively long first-screen display time of the page; if it is rendered through the server side, there may be certain data missing in the web page data transmitted to the browser side after the rendering is completed. Among them, the browser side can be desktop browsers on various platforms, such as Windows, Mac os, Android, iPhone ios, etc.; corresponding web page requests are sent through applications on the browser side, where the application refers to desktop applications such as Chrome, Firfox, QQ Browser, Edga, etc. used on various platforms (such as Windows, Mac os, Android, iPhone ios, etc.). Users enter the URL (Uniform Resource Locator) address in the browser address bar or click on a hyperlink to send an access request. Further, if web page requests need to be made through other applications, a browser engine Webkit needs to be built into the application; specifically, other applications such as WeChat and DingTalk have built-in Webviews, and the Webviews used by users in the applications need to be standard browsers. The server side refers to the WEB server built using nodeJs, and the server side uses JS to build applications.

[0059] Based on the problems existing in the prior art, Embodiment 1 of the present invention provides a web page output method, which can balance the first-screen display time of the web page while ensuring the accuracy of the page display, giving users a good usage experience. Figure 1 , The web page output method includes the following steps:

[0060] Step S10: Generate selection parameters based on the comparison result between the real-time request data and a preset first routing table.

[0061] Among them, the real-time request data refers to the real-time data generated when users provide web page requirements on the browser side. The real-time request data is transmitted from the browser side to the server side, and the server side reads the real-time request data to determine the real-time request content of the user, such as URL request data.

[0062] The first routing table stores a number of web page template data, which can be selected according to the historical requirements of the browser side in the past, or can be selected according to a certain page display area. Moreover, the first routing table generally refers to all available web page template data stored on the server side. In this case, when the server side reads the real-time request data, it only needs to traverse and compare the real-time request data with all the web page template data in the first routing table to determine the web page template data corresponding to the real-time request data. Specifically, the first routing table can be stored in the database on the server side.

[0063] In this embodiment, based on the generated selection data, it can be determined whether there is web page template data corresponding to the real-time request data in the first routing table. Specifically, if during the traversal and comparison process of the real-time request data and the first routing table, web page template data corresponding to the real-time request data can be obtained in the first routing table, the generated selection data is used for the server side to locate the corresponding web page template data in the first routing table; if during the traversal and comparison process, web page template data corresponding to the real-time request data cannot be obtained, the generated selection data is used for the server side to obtain the corresponding web page data elsewhere outside the first routing table and output it.

[0064] This embodiment can give web developers more development options according to the traversal and comparison operation of the real-time request data and the first routing table, and improve the flexibility of web page rendering.

[0065] In order to facilitate the fast and accurate implementation of the traversal and comparison process when the real-time request data is traversed and compared with the first routing table, and at the same time, in order to substantially distinguish and classify each web page template data, in an embodiment of the present invention, a unique information identifier is given to each web page template data. Specifically, as Figure 2 shown, the process of distinguishing and classifying each web page template data is as follows:

[0066] Step S11: Obtain the unique identification information corresponding to each of the web page template data, and the unique identification information is used to distinguish each of the web page template data;

[0067] Specifically, due to the diversification of existing web page requirement types, if a large number of templates are placed together without corresponding differentiation information, it is very easy to cause chaos and unclarity in the data of the entire database. Therefore, in this embodiment, unique identification information with uniqueness is set for each web page template data. For example, the web page design template for the catering category can be classified as category A, the web page design template for the electronics category can be classified as category B, and so on. Then, it can be further subdivided into A1, A2... AN, B1, B2... BN, etc. Indexes can also be set for each web page template data, and the index can be used as the unique identification information, etc. Of course, it should be particularly noted that the role of the unique identification information is to distinguish web page template data. Therefore, the embodiments of the present invention do not limit the above two methods, and specific selection can be made according to actual requirements.

[0068] Step S12: Generate a corresponding set based on the unique identification information of all the web page template data, and generate the first routing table according to the set.

[0069] According to step S11, it can be known that web page data templates can be classified into unified categories according to different types. Therefore, web page template data of the same category can be used as a set of the same type. That is, the unique identification information can be used as an element of the set, and then the corresponding first routing table is generated from the set. Among them, it should be particularly noted that the number of the first routing tables is not limited and fixed in the embodiments of the present invention. As long as the web page template data of the same type classified according to the same category can be used as a part of the first routing table, that is, the first routing table is only used to represent the function that the embodiments of the present invention can perform the classification of web page template data, and does not limit the number of the first routing tables and the number of different type sets of web page template data in the first routing table.

[0070] By differentiating each web page template data with unique identification information, the orderliness and queryability of the web page template data in the first routing table can be improved, that is, the acquisition speed and efficiency of web pages can be improved. Correspondingly, the web page development efficiency can be improved to a certain extent, and faster interaction responses can also be given to users.

[0071] Step S20: Obtain the corresponding page to be rendered according to the selection parameter.

[0072] Based on the descriptions of the above steps S10, S11, and S12, the page to be rendered is the web page template data stored in the first routing table determined by the selection parameter. Generally, this page template data is generally composed of the framework of a type of page, including fewer or no page function modules; it can also be a preset display page sent by the server side. Among them, the preset display page is not included in the first routing table and can be stored in a data storage device such as a database on the server side.

[0073] As Figure 3 shown, in one embodiment, obtaining a page to be rendered corresponding to a selection parameter includes the following steps: Step S21: Determine whether there is the web page template data corresponding to the real-time request data in the first routing table; Step S22: If so, generate the corresponding page to be rendered based on the selection parameter and the first routing table; Step S23: If not, obtain a preset display page based on the selection parameter, and after rendering the preset display page by the server side based on the real-time request data, transmit it to the browser side for display.

[0074] Specifically, since web page template data is stored in the first routing table, when the selection parameter is determined based on the real-time request parameter, the web page related data corresponding to the user request is obtained. Thus, it can be determined whether the page to be rendered is obtained from the web page template data pre-stored in the first routing table or a preset display page is obtained from other parts of the server side; among them, when it is determined that there is web page template data corresponding to the selection parameter in the first routing table, the page to be rendered can be directly obtained from the first routing table; otherwise, the server side sends the preset display page to the browser side. The preset display page is the web page template data that is closest to the type desired by the real-time request data or the page components are closest after the server side parses the real-time request data, but this web page template data is not stored in the first routing table. In the actual application process, the preset display page can be stored in the server side database, or obtained by the server side through interface scheduling, or a preset display page redirected by the server side based on the real-time request data.

[0075] Step S30: Perform a rendering operation on the page to be rendered based on the real-time request data to generate a corresponding target output page, and output the target output interface by the browser side for display.

[0076] In a specific embodiment, the real-time request data includes all request data required by the user when making a page request, such as the type of the page and all constituent elements of the display page, and parameters such as the local time of the location where the user requests, etc. Based on the relevant parameters in these real-time request data, the page to be rendered can be rendered to obtain the target output page required by the user; among them, the target output interface is output and displayed by the browser side operated by the user, such as displayed to the user through a computer screen, a mobile phone screen, etc. At this time, the user can perform corresponding operations on the page to achieve page interaction operations.

[0077] In a specific embodiment, since a page finally displayed to a user includes several components. For example, a Taobao display page includes an area for displaying pictures of relevant products, an area for selecting corresponding models, and an area for detailed product information and comments. During the page rendering process, these parts need to be effectively integrated and processed to provide the best display effect for the user, that is, a page rendering operation is required, such as Figure 4 As shown in an embodiment, the process of implementing a rendering operation on a page to be rendered includes:

[0078] Step S310: Determine all page component data required to generate the target output page based on the first routing table; Step S311: Render the page to be rendered according to all the page components to generate the target output page.

[0079] Actually, in order to reduce the first screen time on the browser side during the interaction process, the embodiment of the present invention performs a rendering operation on the page to be rendered to obtain the smallest unit required for user display, that is, it is necessary to ensure that during the interaction process, through the rendering operation on the server side, the initial page displayed on the browser side is an interface that includes all functions within the user's visible range. For example, a login page must include all the components required for the login box (username, user password, login button, etc.).

[0080] Therefore, after determining that there is page template data corresponding to the real-time request data in the first routing table, the page to be rendered and other page composition data required for the page to be displayed as required by the real-time request data can be obtained from the first routing table. By performing a rendering operation on the page to be rendered with this page composition data, an interactive page for the user to perform interactive operations, that is, the target output page, can be generated.

[0081] In the web page output method of this embodiment, when a page request is made based on real-time request data and the page to be rendered is obtained on the server side, all the page composition data required for the page requested by the corresponding real-time request data is also obtained. The server side only performs a rendering operation on the smallest page composition unit required for user interaction, and other required data is sent to the browser side in a synchronous or asynchronous manner. Through the rendering operation performed by the server side, the first screen time can be reduced when the page is displayed to the user, and only rendering a part of the page to be rendered (that is, only the smallest operable component page is displayed to the user) can avoid problems such as data transmission errors, loss, or interruption when the server side sends too much data to the browser side.

[0082] In one embodiment, if the server needs to request other port servers to obtain page component data required for page rendering, the following steps need to be specifically executed: determining the generation of first page component data based on the first routing table; rendering the page to be rendered by the server based on the first page component data to generate an initial output page; sending second page component data from the server to the browser end based on the real-time request data; and performing real-time rendering on the initial output page by the browser end based on the second page component data to generate the target output page.

[0083] Based on the page operations on the server side, it is possible to perform rendering based on the data range on the server side, or to schedule corresponding data based on the interfaces associated with the server side for rendering. Moreover, there are limitations on the amount of rendering on the server side. In this way, while reducing the browser's first-screen time, it is also possible to improve the accuracy and integrity of the relevant web page rendering data sent from the server side to the browser side. It is also beneficial to enrich the operability of rendering and give developers more flexible operations.

[0084] Such as Figure 5 As shown, in one embodiment, since the server side only sends the smallest page composition unit available for user interaction to the browser side, in order to enrich all the functions of the page, after the server side sends the page rendered on the server side, the following operations need to be performed:

[0085] Step S320: Obtain the page to be rendered sent by the server side and the rendering requirement data corresponding to the page to be rendered.

[0086] Specifically, the rendering requirement data refers to the resource request data sent from the server side to the browser side based on the real-time request data. That is, through this rendering requirement data, the browser side can request corresponding rendering resources from the server side to complete the rendering operation of the display page. For example, the rendering requirement data can be JS request script data. Based on this JS request script data, the browser side can initiate requests for static resources (such as JS, CSS, etc.) from the server side, and thus build the applications required for the display page on the browser side through the JS script to improve various required functions of the page.

[0087] Step S321: Build a corresponding application based on the rendering requirement data, and render the page to be rendered according to the application to generate the target output page.

[0088] An application refers to some functional applications included in a display page, that is, corresponding functional operations are added to the original single page. For example, the function of jumping after clicking on the page, the function of communicating by clicking on the chat button, and so on. However, in practice, these applications need to be constructed by the server-side according to real-time request data and returned to the JS request script of the browser-side, and the static resources required for rendering are obtained based on this JS request script. Therefore, after constructing the application corresponding to the page, the application can be rendered, so as to ensure that all applications on the page have good display effects, and the functions corresponding to the applications can be realized normally, ensuring the high quality and high performance of the finally output target output page.

[0089] Specifically, in one embodiment, as Figure 6 shown, the specific process of generating a target output page based on rendering requirement data and a page to be rendered on the browser side includes the following:

[0090] Step S3211: Obtain page component data corresponding to the page to be rendered in a preset second routing table based on the application; Step S3212: Render the page to be rendered by the browser side based on the page component data to generate the target output page.

[0091] Among them, the second routing table is set on the browser side and is configured according to actual requirements; the second routing table stores page component data for rendering the display page. The page component data is used to enrich the page to be rendered visually and functionally when the browser side receives the page to be rendered. For example, in a page of electronic products, a flashing phenomenon is added for click operations to enhance the technological nature of the page, or for the description of a certain module, not only the corresponding function introduction is provided, but also the answer link to the corresponding theoretical knowledge is added, etc.

[0092] Therefore, during the page rendering process, rendering the page to be rendered through the page component data can effectively enhance the selectivity of development, enrich the functionality and integrity of development, thereby providing users with a better user experience and functional experience.

[0093] After the rendering is completed, in order to ensure that the page to be rendered sent by the server side matches the page finally displayed on the browser side, it is necessary to perform a further verification operation on whether they match. Specifically, first, it is necessary to obtain the page to be rendered sent by the server side and the first DOM data corresponding to the page to be rendered; and obtain the second DOM data corresponding to the application; then determine whether the first DOM data and the second DOM data match.

[0094] Specifically, the first DOM data is sent from the server - side to the browser - side based on the analysis and feedback of real - time request data. The second DOM data is generated when the page to be rendered constructs applications based on the second routing table on the browser - side, that is, the second DOM data is determined by how many applications are constructed during the real - time rendering process of the page to be rendered. Therefore, in the case where the final display page is composed of applications, the second DOM data can be used to determine whether the final display page is completed. The first DOM data is determined by real - time request data, and the real - time request data contains the constituent elements of the corresponding final display page. Based on this, it can be determined whether the final display page corresponds to the real - time request data by judging whether the first DOM data matches the second DOM data, that is, whether the browser - side finally displays the page corresponding to the real - time request data.

[0095] Specifically, in actual comparison of whether the first DOM data matches the second DOM data, it can be carried out by comparing the specific number of page nodes included in the target output page. Actually, each display page contains several functions, that is, it includes several pages, and each function can be calculated as a node. Therefore, each display page can be regarded as a set corresponding to all functional page nodes. Similarly, the first DOM data sent from the server - side to the browser - side has the same meaning. Thus, it can be determined whether the finally displayed page meets the actual needs of users according to the comparison between the first DOM data and the second DOM data.

[0096] Among them, in an embodiment of the present invention, in order to improve the development flexibility, different comparison algorithms can be selected for matching calculation according to the data volume of the first DOM data or the second DOM data. For example, when the data volume of the first DOM data and / or the second DOM data is relatively small, the Diff algorithm can be selected, and when the data volume of the DOM data and / or the second DOM data is relatively large, the React diff algorithm can be used. Of course, the present invention embodiment does not limit and fix the selection of the comparison algorithm, and can be adjusted according to actual needs.

[0097] In the embodiment of the present invention, if the first DOM data matches the second DOM data, it means that the finally rendered target output page corresponds to the real - time request data and meets the actual needs of users. At this time, the browser - side outputs the target output page and performs an event - binding operation on the target output page based on the first DOM data or the second DOM data. Among them, event - binding refers to binding events to the data (HTML file) corresponding to the finally rendered target output page through the browser event mechanism to ensure the realization of the page functions. How to specifically implement event - binding is a conventional technology in the prior art and will not be elaborated here.

[0098] In addition, if the first DOM data does not match the second DOM data, it indicates that the target output page does not match the actual request page corresponding to the real-time request data. In this case, in order to provide a good interaction experience for users, on the one hand, the present invention embodiment will feedback the comparison result from the browser side to the server side, and specifically, this feedback operation can be achieved by setting preset information; in addition, in actual operation, in order to reduce user request operations, the number of requests can be set in the real-time request data of the corresponding page. In this way, if the first request fails to obtain the result that the first DOM data matches the second DOM data, the server side can be requested again to send the web page corresponding to the real-time request data to the browser side, that is, based on the real-time request data, the number of requests generated for obtaining the target output page request is obtained. When the number of requests is not less than one, the server side sends the target output page to the browser side again and generates a corresponding prompt message.

[0099] Furthermore, the browser can display and output the target output page as the display page; or the server side can send a preset display page as the display page to be displayed to the user and remind the user that the request has an error.

[0100] By comparing and matching the corresponding second DOM data in the application construction process of the target output page with the first DOM data fed back by the server side based on the real-time request data, the accuracy of the finally output page can be guaranteed.

[0101] In the web page output method of the present invention embodiment, when the server receives the real-time request data corresponding to the page display request sent by the user, a selection parameter is determined according to the comparison between the real-time request data and the first routing table set on the server side. Based on this selection parameter, the acquisition method of the page to be rendered can be determined, that is, it is determined whether there is a page to be rendered corresponding to the real-time request parameter in the first routing table. If it exists, the server side obtains the page to be rendered from the first routing table, renders it, and then sends it to the browser side; if it does not exist, the server side renders the preset display interface and then sends it to the browser side; finally, it is output and displayed by the browser side for the user to use. The web page output method of the present invention is beneficial to improving the flexibility of web page rendering by flexibly selecting the main body of web page rendering. Because the server side's rendering of the page to be rendered is only limited to the most basic page components required for display to the user, it can solve the problems of long first screen time caused by browser-side rendering and incorrect web page display caused by server-side rendering, and give users a good operation experience during the rendering process.

[0102] Embodiment 2

[0103] Embodiment 2 of the present invention provides a web page output system 300Figure 7 is a schematic structural diagram of the system, as Figure 7 shown. The web page output system includes: a browser side 310 and a server side 320. Both the browser side 310 and the server side 320 include a page rendering module 350 and a page generation module 360. The browser side further includes a page output module 370, and the server side further includes a data comparison module 330 and a selection module 340.

[0104] In one embodiment, the data comparison module 330 is configured to generate a selection parameter based on a comparison result between real-time request data and a preset first routing table. The real-time request data is read by the server side, and a plurality of web page template data are stored in the first routing table. The selection module 340 is configured to obtain a corresponding page to be rendered according to the selection parameter. The page rendering module 350 is configured to perform a rendering operation on the page to be rendered based on the real-time request data to generate a corresponding target output page. The page generation module 360 is configured to generate the target output page after the page rendering module performs the rendering operation. The page output module 370 is configured to perform transmission output and display output on the target output page.

[0105] Embodiment III

[0106] Figure 8 is a schematic structural diagram of a computer device provided in Embodiment III of the present invention, as Figure 8 shown. The computer device includes a processor, a memory, a non-volatile storage medium, and a network interface. The number of processors in the computer device can be one or more, Figure 8 and one processor is taken as an example here. The processor, memory, non-volatile storage medium, and network interface in the computer device can be connected through a bus or other means, Figure 8 and connection through a bus is taken as an example here.

[0107] The memory, as a computer-readable storage medium, can be used to store software programs, computer-executable programs, and modules, such as program instructions / modules corresponding to the web page output method in the embodiments of the present invention (for example, the data comparison module 330, selection module 340, page rendering module 350, page generation module 360, and page output module 370 in the web page output system). The processor runs the software programs, instructions, and modules stored in the memory, thereby performing various functional applications and data processing of the computer device, that is, implementing the above-mentioned web page output method.

[0108] That is:

[0109] Generate a selection parameter based on the comparison result between the real-time request data and a preset first routing table, where the real-time request data is read by the server side, and a number of web page template data are stored in the first routing table;

[0110] Obtain a corresponding page to be rendered according to the selection parameter;

[0111] Perform a rendering operation on the page to be rendered based on the real-time request data to generate a corresponding target output page, and output the target output interface by the browser side for display.

[0112] The memory may mainly include a program storage area and a data storage area. Among them, the program storage area may store an operating system and application programs required for at least one function; the data storage area may store data created according to the use of the terminal, etc. In addition, the memory may include high-speed random access memory, and may also include non-volatile memory, such as at least one magnetic disk storage device, a flash memory device, or other non-volatile solid-state storage devices. In some instances, the memory may further include a memory remotely set relative to the processor, and these remote memories may be connected to the computer device through a network. Examples of the above network include but are not limited to the Internet, an enterprise intranet, a local area network, a mobile communication network, and combinations thereof.

[0113] Embodiment 4

[0114] Embodiment 4 of the present invention further provides a storage medium containing computer-executable instructions, and the computer-executable instructions are used to execute a web page output method when executed by a computer processor. The method includes: generating a selection parameter based on the comparison result between the real-time request data and a preset first routing table, where the real-time request data is read by the server side, and a number of web page template data are stored in the first routing table; obtaining a corresponding page to be rendered according to the selection parameter; performing a rendering operation on the page to be rendered based on the real-time request data to generate a corresponding target output page, and outputting the target output interface by the browser side for display.

[0115] Certainly, the computer-executable instructions of a storage medium provided by the embodiments of the present invention are not limited to the above method operations, and may also execute related operations in the web page output methods provided by any embodiments of the present invention.

[0116] From the above description of the embodiments, those skilled in the art can clearly understand that the present invention can be implemented by means of software and necessary general hardware. Of course, it can also be implemented by hardware, but in many cases the former is a better implementation. Based on such an understanding, the technical solution of the present invention, in essence, or the part that contributes to the prior art, can be embodied in the form of a software product. This computer software product can be stored in a computer-readable storage medium, such as a floppy disk, read-only memory (ROM), random access memory (RAM), flash memory (FLASH), hard disk, or optical disc of a computer, etc., including several instructions for causing a computer device (which can be a personal computer, computer device, or network device, etc.) to execute the methods of various embodiments of the present invention.

[0117] It should be noted that in the embodiments of the above device, the various units and modules included are only divided according to functional logic, but are not limited to the above division, as long as the corresponding functions can be realized; in addition, the specific names of the functional units are only for the convenience of mutual distinction and do not limit the protection scope of the present invention.

[0118] Note that the above is only the preferred embodiment of the present invention and the technical principles applied. Those skilled in the art will understand that the present invention is not limited to the specific embodiments here, and various obvious changes, re-adjustments, and substitutions can be made by those skilled in the art without departing from the protection scope of the present invention. Therefore, although the present invention has been described in more detail through the above embodiments, the present invention is not limited to the above embodiments. Without departing from the concept of the present invention, more other equivalent embodiments can be included, and the scope of the present invention is determined by the scope of the appended claims.

Claims

1. A web page output method, characterized in that, The method includes: Generating selection parameters based on the comparison result between real-time request data and a preset first routing table, where the real-time request data is read by the server side, and several web page template data are stored in the first routing table; Obtaining a corresponding page to be rendered according to the selection parameters; Performing a rendering operation on the page to be rendered based on the real-time request data to generate a corresponding target output page, and outputting the target output interface by the browser side for display; The generating selection parameters based on the comparison result between real-time request data and a preset first routing table includes: Obtaining unique identification information corresponding to each piece of the web page template data, where the unique identification information is used to distinguish each piece of the web page template data; Generating a corresponding set based on the unique identification information of all the web page template data, and generating the first routing table according to the set; The obtaining a corresponding page to be rendered according to the selection parameters includes: Judging whether there is web page template data corresponding to the real-time request data in the first routing table; If so, generating the corresponding page to be rendered based on the selection parameters and the first routing table; If not, obtaining a preset display page based on the selection parameters, and rendering the preset display page by the server side based on the real-time request data and then transmitting it to the browser side for display; The performing a rendering operation on the page to be rendered based on the real-time request data to generate a corresponding target output page includes: Obtaining the page to be rendered sent by the server side and rendering requirement data corresponding to the page to be rendered; Constructing a corresponding application based on the rendering requirement data, and rendering the page to be rendered according to the application to generate the target output page; The constructing a corresponding application based on the rendering requirement data, and rendering the page to be rendered according to the application to generate the target output page includes: Obtaining page component data corresponding to the page to be rendered in a preset second routing table based on the application, where the second routing table is set on the browser side, and page component data for rendering a display page are stored in the second routing table, and the page component data are used to enrich the page to be rendered visually and functionally when the browser side receives the page to be rendered; Rendering the page to be rendered by the browser side based on the page component data to generate the target output page.

2. The web page output method according to claim 1, wherein The performing a rendering operation on the page to be rendered based on the real-time request data to generate a corresponding target output page includes: Determining all page component data required to generate the target output page based on the first routing table; Rendering the page to be rendered according to all the page components to generate the target output page.

3. The web page output method according to claim 1, wherein The rendering the page to be rendered by the browser side based on the page component data to generate the target output page includes: Obtaining the page to be rendered sent by the server side and first DOM data corresponding to the page to be rendered; Obtaining second DOM data corresponding to the application; Judging whether the first DOM data and the second DOM data match; If there is a match, the browser side outputs the target output page and performs an event binding operation on the target output page based on the first DOM data or the second DOM data; If there is no match, the browser side feeds back the corresponding preset information indicating non - match to the server side; or Obtain the number of requests generated for the target output page request based on the real - time request data; When the number of requests is not less than one, the server side sends the target output page to the browser side again and generates corresponding prompt information; or The browser displays and outputs the target output page as the display page.

4. The web page output method according to claim 3, characterized in that The determination of whether the first DOM data and the second DOM data match includes: Obtain the number of page nodes included in the target output page; Select a preset comparison algorithm based on the number of page nodes; Judge whether the first DOM data and the second DOM data match according to the comparison algorithm.

5. A web page output system, characterized in that, The web page output system includes: a browser side and a server side. Both the browser side and the server side include a page rendering module and a page generation module. The browser side further includes a page output module, and the server side further includes a data comparison module and a selection module; wherein, The data comparison module is used to generate selection parameters based on the comparison result between the real - time request data and a preset first routing table. The real - time request data is read by the server side, and several web page template data are stored in the first routing table; The selection module is used to obtain the corresponding page to be rendered according to the selection parameters; The page rendering module is used to perform a rendering operation on the page to be rendered based on the real - time request data to generate a corresponding target output page; The page generation module is used to generate the target output page after the page rendering module performs the rendering operation; The page output module is used to perform transmission output and display output on the target output page; The generation of selection parameters based on the comparison result between the real - time request data and the preset first routing table includes: Obtain the unique identification information corresponding to each piece of the web page template data. The unique identification information is used to distinguish each piece of the web page template data; Generate a corresponding set based on the unique identification information of all the web page template data and generate the first routing table according to the set; The obtaining of the corresponding page to be rendered according to the selection parameters includes: Judge whether there is web page template data corresponding to the real - time request data in the first routing table; If so, generate the corresponding page to be rendered based on the selection parameters and the first routing table; If not, obtain a preset display page based on the selection parameters, and the server side renders the preset display page based on the real - time request data and then transmits it to the browser side for display; The performing of a rendering operation on the page to be rendered based on the real - time request data to generate a corresponding target output page includes: Obtain the page to be rendered sent by the server side and the rendering requirement data corresponding to the page to be rendered; Build a corresponding application based on the rendering requirement data, and render the page to be rendered according to the application to generate the target output page; The building of the corresponding application based on the rendering requirement data and the rendering of the page to be rendered according to the application to generate the target output page includes: Obtain page component data corresponding to the page to be rendered in a preset second routing table based on the application. The second routing table is set on the browser side, and the page component data for rendering the display page is stored in the second routing table. The page component data is used to enrich the page to be rendered visually and functionally when the browser side receives the page to be rendered; Render the page to be rendered by the browser side based on the page component data to generate the target output page.

6. A computer-readable storage medium having a computer program stored thereon, characterized in that, When the computer program is executed by a processor, it implements the web page output method according to any one of claims 1-4.

Images