Web page display method, device, computer equipment, storage medium, and product

Abstract

The present application relates to a web page display method, apparatus, computer equipment, storage medium, and product. The method comprises: receiving a web page access request sent by a terminal, and obtaining an option data array corresponding to a target web page from a database through the web page access request. The option data array is sent to the terminal so that the terminal generates a target web page based on the option data array. Since the option data array stored in the database records multiple option data and the linkage relationship between the multiple option data in a non-nested manner, the size of the database will not be increased, and the storage space occupied by the option data array is also relatively small. Then, after receiving the Http request sent by the terminal, the server can obtain the option data array corresponding to the target web page at one time and send the option data array to the terminal. Obviously, the web page display method of the present application solves the problem of web page freeze caused by frequent access.

Description

Technical Field

[0001] The present application relates to the technical field of page data processing, and in particular to a web page display method, apparatus, computer equipment, storage medium, and product. Background Art

[0002] With the continuous development of Internet technology, there is an increasing need to display data in a linked manner on web pages.

[0003] Traditionally, when displaying data in a linked fashion on a front-end webpage, each time a user selects a page on the previous page and opens the next page, an HTTP request is triggered. This request retrieves the data from the next page from the server, enabling linked display. The next page is then rendered based on the data in the next page.

[0004] Therefore, if multiple data displays need to be linked on the front-end web page, the traditional method will trigger multiple HTTP requests, which will cause web page freezes. Summary of the Invention

[0005] The embodiments of the present application provide a web page display method, apparatus, computer device, and computer-readable storage medium, which can solve the problem of web page freeze caused by frequent access.

[0006] In one aspect, a web page display method is provided, which is applied to a server, and the method includes:

[0007] Receiving a web page access request sent by a terminal;

[0008] Obtaining an option data array corresponding to a target web page from a database through the web page access request; the option data array records a plurality of option data and linkage relationships between the plurality of option data in a non-nested manner;

[0009] The option data array is sent to the terminal, so that the terminal generates the target webpage according to the option data array.

[0010] In the embodiment of the present application, because the option data array stored in the database records multiple option data and the linkage relationships between the multiple option data in a non-nested manner, the size of the database will not be increased, and the storage space occupied by the option data array is also relatively small. Therefore, after receiving a web page access request sent by a terminal, the server can obtain the option data array corresponding to the target web page in one go and send the option data array to the terminal. Subsequently, the terminal can render the page to generate the target web page based on the option data array and the user's selection instructions for the multiple option data, thereby realizing the linkage display of the option data on the target web page. There is no need, as in traditional methods, to trigger a web page access request to obtain the sub-option data corresponding to the option data once the user triggers a selection instruction for the option data. Clearly, the web page display method of the present application solves the problem of web page lag caused by frequent access.

[0011] In one embodiment, the option data array includes multiple objects of the same level, and the identity identifier and process identifier of the option data are recorded in the objects of the same level; if the process identifier of the first option data is the same as the identity identifier of the second option data, it indicates that the first option data is option data that has a linkage relationship with the second option data, and the page where the first option data is located is the next level page of the page where the second option data is located.

[0012] In an embodiment of the present application, the option data array includes multiple peer objects, each of which records the identity and process identifier of the option data. The identity identifier of the option data can be used to distinguish different peer objects. The process identifier of the option data can also be used to characterize the linkage relationship (inclusion relationship or hierarchical relationship) between different peer objects. In this way, in the option data array, by using non-nested peer objects, specifically by recording the identity and process identifier of the option data in the peer objects, the linkage relationship between multiple option data is recorded, and the storage space occupied by the option data array in the database is greatly reduced.

[0013] In another aspect, a web page display method is provided, which is applied to a terminal, and the method includes:

[0014] Send a web page access request to the server;

[0015] receiving an option data array corresponding to a target web page, issued by the server according to the web page access request; wherein the option data array records a plurality of option data and linkage relationships between the plurality of option data in a non-nested manner;

[0016] The target web page is generated according to the option data array.

[0017] In this embodiment of the present application, a webpage access request is sent to a server, and an option data array corresponding to a target webpage, issued by the server in response to the webpage access request, is received. The option data array records multiple option data and linkage relationships between the multiple option data in a non-nested manner. The target webpage is generated based on the option data array.

[0018] Since the option data array stored in the database records multiple option data and the linkage relationship between the multiple option data in a non-nested manner, the size of the database will not be increased, and the storage space occupied by the option data array is also relatively small. Then, the terminal sends a web page access request to the server. After receiving the Http request (web page access request) sent by the terminal, the server can obtain the option data array corresponding to the target web page at one time, and send the option data array to the terminal. Subsequently, the terminal can perform page rendering to generate the target web page based on the option data array and the user's selection instructions for multiple option data, so as to realize the linkage display of the option data in the target web page. There is no need to trigger an Http request to obtain the sub-option data corresponding to the option data when the user triggers a selection instruction for the option data as in the traditional method. Obviously, the web page display method in this application solves the problem of web page freeze caused by frequent access.

[0019] In one embodiment, generating the target webpage according to the option data array includes:

[0020] Based on the plurality of option data and the linkage relationship between the plurality of option data, a first-level page of the webpage is generated; at least one first-level option data is displayed on the first-level page;

[0021] On the first level page of the webpage, receiving a user selection instruction for first level target option data; the first level target option data is any one option data of the at least one first level option data;

[0022] In response to the selection instruction, a second-level page is generated for linkage display with the first-level page of the web page according to the first-level target option data, the plurality of option data, and the linkage relationship between the plurality of option data.

[0023] In an embodiment of the present application, the option data array stored in the database records multiple option data and the linkage relationship between the multiple option data in a non-nested manner, which does not increase the size of the database, and the storage space occupied by the option data array is also relatively small. Therefore, the terminal can obtain the option data array of the target web page based on a single web page access request, and there will be no problem of web page freeze. Then, the terminal can render a level-by-level page based on the multiple option data stored in the option data array and the linkage relationship between the multiple option data, combined with the user's selection instructions for the page, thereby realizing the linkage display of the option data in the page. The entire linkage display process does not require multiple Http requests to the server, which reduces the time it takes to load the page. Furthermore, the speed of realizing the linkage display of option data in the page is improved.

[0024] In one embodiment, the option data array includes multiple peer objects, each of which records an identity identifier and a process identifier of the option data; if the process identifier of the first option data is the same as the identity identifier of the second option data, then the first option data is option data that has a linkage relationship with the second option data, and the page where the first option data is located is a page one level lower than the page where the second option data is located;

[0025] The step of generating a first-level page of the webpage based on the plurality of option data and the linkage relationship between the plurality of option data includes:

[0026] determining first-level option data from the plurality of option data based on the process identifier of the option data; the process identifier corresponding to the first-level option data is empty;

[0027] Rendering is performed according to the first-level option data to generate a first-level page of the target web page.

[0028] In this embodiment of the present application, since the process identifier corresponding to the first-level option data is predefined as being empty, based on the process identifier of the option data, the option data with an empty process identifier can be determined from the plurality of option data as the first-level option data. Rendering is then performed based on the first-level option data to generate the first-level page of the target webpage. In this way, the first-level option data can be accurately determined, and thus the first-level page of the target webpage can be accurately determined. Thus, based on the rule that the process identifier corresponding to the first-level option data is empty, the first-level page of the target webpage can be quickly generated.

[0029] In one embodiment, generating a second-level page for linkage display with the first-level page of the webpage based on the first-level option data, the plurality of option data, and linkage relationships between the plurality of option data includes:

[0030] According to the identity identifier of the first-level target option data, obtaining second-level option data having a process identifier identical to the identity identifier of the first-level target option data from the plurality of option data;

[0031] Rendering is performed according to the second-level option data to generate a second-level page that is displayed in conjunction with the first-level page of the web page.

[0032] In an embodiment of the present application, based on the identity identifier of the first-level target option data, second-level option data having a process identifier identical to the identity identifier of the first-level target option data is obtained from the multiple option data. Rendering is performed based on the second-level option data to generate a second-level page that is displayed in conjunction with the first-level page of the web page. Based on the identity identifier of the option data selected by the user on the page, the option data having a process identifier identical to the identity identifier of the option data selected by the user can be obtained as the second-level option data in combination with the process identifier of other option data. Similarly, based on the identity identifier and process identifier of the option data recorded in the option data array stored in the terminal, the next-level option data can be quickly determined, and then the next-level page can be quickly rendered. Thus, the response speed of the web page is improved.

[0033] In another aspect, a web page display device is provided, the device comprising:

[0034] A web page access instruction receiving module is used to receive a web page access request sent by a terminal;

[0035] An option data array acquisition module is used to acquire an option data array corresponding to a target web page from a database according to the web page access request; the option data array records a plurality of option data and linkage relationships between the plurality of option data in a non-nested manner;

[0036] The first target webpage generating module is configured to send the option data array to the terminal so that the terminal generates the target webpage according to the option data array.

[0037] On the other hand, a computer device is provided, including a memory and a processor, wherein a computer program is stored in the memory, and when the computer program is executed by the processor, the processor executes the steps of the web page display method described above.

[0038] On the other hand, a computer-readable storage medium is provided, on which a computer program is stored. When the computer program is executed by a processor, the steps of the web page display method described above are implemented.

[0039] On the other hand, a computer program product is provided, comprising a computer program, which implements the steps of the web page display method described above when executed by a processor.

[0040] The webpage display method, apparatus, computer device, storage medium, and product described above receive a webpage access request from a terminal and, based on the webpage access request, retrieve an option data array corresponding to a target webpage from a database. The option data array records multiple option data items and the linkage relationships between the multiple option data items in a non-nested manner. The option data array is then sent to the terminal, which generates the target webpage based on the option data array.

[0041] Since the option data array stored in the database records multiple option data and the linkage relationship between multiple option data in a non-nested manner, the size of the database will not be increased, and the storage space occupied by the option data array is also relatively small. Then, after receiving the Http request sent by the terminal, the server can obtain the option data array corresponding to the target web page at one time, and send the option data array to the terminal. Subsequently, the terminal can perform page rendering to generate the target web page based on the option data array and the user's selection instructions for multiple option data, so as to realize the linkage display of the option data in the target web page. There is no need to trigger an Http request to obtain the sub-option data corresponding to the option data when the user triggers a selection instruction for the option data as in the traditional method. Obviously, the web page display method in this application solves the problem of web page freeze caused by frequent access. BRIEF DESCRIPTION OF THE DRAWINGS

[0042] In order to more clearly illustrate the embodiments of the present application or the technical solutions in the prior art, the following briefly introduces the drawings required for use in the embodiments or the description of the prior art. Obviously, the drawings described below are only some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without any creative work.

[0043] Figure 1 A diagram illustrating an application environment of a web page display method according to an embodiment;

[0044] Figure 2 is a flowchart of a web page display method in one embodiment;

[0045] Figure 3 is a flowchart of a web page display method in another embodiment;

[0046] Figure 4 for Figure 3 A flowchart for generating a target web page based on an array of option data;

[0047] Figure 5 is a schematic diagram of linked display of option data in a target web page in one embodiment;

[0048] Figure 6 is a schematic diagram of linked display of option data in a target web page in another embodiment;

[0049] Figure 7 is a flowchart of a web page display method in a specific embodiment;

[0050] Figure 8 is a structural block diagram of a web page display device in one embodiment;

[0051] Figure 9 is a structural block diagram of a web page display device in another embodiment;

[0052] Figure 10 for Figure 9 The structural block diagram of the second target web page generation module;

[0053] Figure 11 Schematic diagram of the internal structure of a computer device in one embodiment. DETAILED DESCRIPTION

[0054] In order to make the purpose, technical solutions and advantages of this application more clearly understood, the present application is 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 this application and are not intended to limit this application.

[0055] It will be understood that the terms "first," "second," and the like used herein may be used to describe various elements herein, but these elements are not limited by these terms. These terms are only used to distinguish a first element from another element. For example, a first-level page may be referred to as a second-level page, and similarly, a second-level page may be referred to as a first-level page without departing from the scope of this application. Both a first-level page and a second-level page are level pages, but they are not the same-level pages.

[0056] Figure 1 FIG. 1 is a schematic diagram of an application environment of a web page display method in an embodiment. Figure 1As shown, the application environment includes a terminal 120, a server 140, and a database 160. Terminal 120 and server 140 are connected via a network, and server 140 and database 160 are connected via a network. Server 140 receives a webpage access request from a terminal and retrieves an option data array corresponding to the target webpage from the database based on the webpage access request. The option data array records multiple option data and the linkage relationships between the multiple option data in a non-nested manner. The option data array is then sent to the terminal, so that the terminal generates the target webpage based on the option data array. Terminal 120 may be, but is not limited to, various personal computers, laptops, smartphones, tablets, IoT devices, and portable wearable devices. IoT devices may include smart speakers, smart TVs, smart air conditioners, smart car devices, etc. Portable wearable devices may include smart watches, smart bracelets, head-mounted devices, etc.

[0057] Traditionally, to achieve linked data display on the front-end page, option data is stored in a nested database according to linkage logic. This means that the database stores both the option data and all subsequent option data linked to it. If there is overlap in the linkage logic between the option data, the database will store a large amount of duplicate data. For example, the database may record that option data 1 includes option data 2 and option data 3; then record that option data 2 includes option data 4, option data 5, and so on; and then record that option data 3 includes option data 4, option data 5, and so on. This means that there is overlap in the linkage logic between option data 2 and option data 3. If the linkage relationships between the option data become more complex, this will significantly increase the database size, resulting in a waste of storage space.

[0058] And when a web page access request is received on the front-end page, the terminal sends an Http request to the server. If, in response to this Http request, all option data related to the web page access request (option data stored in a nested manner) are sent to the terminal, then due to the large amount of data of the option data stored in a nested manner, the sending process is slow and the delay is long, which will cause the web page to freeze. If the terminal sends an Http request to the server, only the option data to be displayed this time is sent to the terminal. Then, when the user makes a selection for a certain option data on the terminal's web page, an Http request is triggered, and the server will frequently respond to multiple Http requests, which will also cause the problem of web page freeze.

[0059] In order to solve the problem of web page freezing, this application proposes a web page display method. Figure 2 FIG. 1 is a flow chart of a web page display method in one embodiment. The web page display method in this embodiment is to run on Figure 1 This article describes the server in the example. Figure 2As shown, the web page display method includes steps 220 to 260, wherein:

[0060] Step 220: Receive a webpage access request sent by a terminal.

[0061] The user triggers a web page access request on the terminal and sends the web page access request to the server, which receives the web page access request. The user can trigger the web page access request on the terminal by opening a web page access app or a website. The web page access request can be an HTTP request. The web page access request can include information about the target web page to be accessed and the user's user ID, etc., which is not limited in this application.

[0062] Step 240: Obtain an option data array corresponding to the target web page from the database through the web page access request; the option data array records multiple option data and linkage relationships between the multiple option data in a non-nested manner.

[0063] After receiving the webpage access request, the server accesses the database based on the target webpage information and the user ID carried in the request, and retrieves the option data array corresponding to the target webpage from the database. Of course, further option data arrays corresponding to the target webpage and user ID can also be retrieved. That is, after receiving the HTTP request sent by the terminal, the server retrieves the option data array corresponding to the target webpage in one go. The option data array records multiple option data and the linkage relationships between the multiple option data in a non-nested manner. If the option data array records multiple option data and the linkage relationships between the multiple option data in a nested manner, this means that option data 1 is recorded to include option data 2 and option data 3; option data 2 is recorded to include option data 4 and option data 5, etc.; option data 3 is recorded to include option data 4 and option data 5, etc.; and so on. If some of the option data include the same option data, the same option data will be recorded repeatedly, resulting in multiple duplicate data entries in the database. This obviously increases the size of the database and wastes storage space.

[0064] The non-nested approach here means that each piece of option data is recorded only once in the option data array, and multiple pieces of option data are all objects at the same level, with the linkage relationships between them recorded within each object. This achieves the goal of recording multiple pieces of option data and the linkage relationships between them without nesting. Therefore, duplicate data is not recorded in the database. This significantly reduces the size of the database and avoids wasting storage space. The linkage relationships between multiple pieces of option data here include inclusion relationships or hierarchical relationships between the multiple pieces of option data.

[0065] Step 260: Send the option data array to the terminal so that the terminal generates a target web page according to the option data array.

[0066] That is, after receiving the HTTP request from the terminal, the server retrieves the array of option data corresponding to the target webpage and sends it to the terminal. The terminal then renders the target webpage based on the array of option data and the user's selection instructions for multiple option data, thereby displaying the option data on the target webpage.

[0067] When a user triggers a webpage access request for another target webpage on a terminal, the server sends the webpage access request to the server. After receiving the webpage access request, the server accesses a database based on the information about the target webpage to be accessed and the user's user ID, and retrieves the option data array corresponding to the target webpage from the database. The target webpage can be an OA (Office Automation) office webpage, while the other target webpage can be a financial webpage, although this application does not limit this.

[0068] In this embodiment of the present application, a webpage access request sent by a terminal is received, and an option data array corresponding to a target webpage is retrieved from a database based on the webpage access request. The option data array records multiple option data items and the linkage relationships between the multiple option data items in a non-nested manner. The option data array is then sent to the terminal, which generates the target webpage based on the option data array.

[0069] Since the option data array stored in the database records multiple option data and the linkage relationship between multiple option data in a non-nested manner, the size of the database will not be increased, and the storage space occupied by the option data array is also relatively small. Then, after receiving the Http request sent by the terminal, the server can obtain the option data array corresponding to the target web page at one time, and send the option data array to the terminal. Subsequently, the terminal can perform page rendering to generate the target web page based on the option data array and the user's selection instructions for multiple option data, so as to realize the linkage display of the option data in the target web page. There is no need to trigger an Http request to obtain the sub-option data corresponding to the option data when the user triggers a selection instruction for the option data as in the traditional method. Obviously, the web page display method in this application solves the problem of web page freeze caused by frequent access.

[0070] The previous embodiment described a web page display method that enables linked display of option data on a web page without requiring frequent database access via a server. This embodiment further describes an option data array comprising multiple peer objects, each of which records the identity and process identifiers of the option data. If the process identifier of a first option data item is the same as the identity identifier of a second option data item, the first option data item is linked to the second option data item, and the page containing the first option data item is a lower-level page than the page containing the second option data item.

[0071] Specifically, the option data array is stored in the database and includes multiple peer objects. That is, each option data item is recorded once as a peer object. Each peer object records the identity and process ID of the option data item. The identity and process ID of the option data item can be used to indicate the linkage relationship (inclusion relationship or hierarchical relationship) between the option data item and other multiple option data items.

[0072] For example, if the process identification (Pid) of the first option data is the same as the identity identification (Id) of the second option data, then the first option data is option data that has a linkage relationship (inclusion relationship or hierarchical relationship) with the second option data, and the page where the first option data is located is a page one level below the page where the second option data is located. In other words, the second option data is included in the page one level below the first option data.

[0073] Table 1-1 below shows some of the option data in the option data array stored in the database.

[0074] Table 1-1

[0075] Id Pid sort code name unit resourceType Type 1 NULL 1 XX host machine NULL alarm_resource_type_host alarm_type_metric 10 4 10 XXX Disk usage G alarm_resource_type_host alarm_type_metric 2 1 2 XX CPU NULL alarm_resource_type_host alarm_type_metric 3 1 3 XXX Memory NULL alarm_resource_type_host alarm_type_metric

[0076] Among them, the Pids corresponding to the option data of Id=2 and Id=3 in Table 1-1 are both 1, which means that the option data of Id=2 and Id=3 are both the next-level pages of the page where the option data of Id=1 is located.

[0077] In an embodiment of the present application, the option data array includes multiple peer objects, and the peer objects record the identity identifiers and process identifiers of the option data. The identity identifiers of the option data can be used to distinguish different peer objects. The process identifiers of the option data can also be used to characterize the linkage relationships (inclusion relationships or hierarchical relationships) between different peer objects. In this way, in the option data array, by using non-nested peer objects, specifically by recording the identity identifiers and process identifiers of the option data in the peer objects, the linkage relationships between multiple option data are recorded, and the storage space occupied by the option data array in the database is greatly reduced.

[0078] Figure 3 FIG. 1 is a flow chart of a web page display method in one embodiment. The web page display method in this embodiment is to run on Figure 1 The following describes the terminal in the example. Figure 3 As shown, the web page display method includes steps 320 to 360, wherein:

[0079] Step 320: Send a web page access request to the server.

[0080] A user triggers a web page access request on a terminal, which sends the request to a server, which then receives it. The user can trigger a web page access request on the terminal by opening a web page access app or a website. The web page access request can be an HTTP request. The web page access request can include information about the target web page to be accessed, as well as information such as the user's user ID, though this application does not limit this.

[0081] Step 340: Receive the option data array corresponding to the target web page sent by the server according to the web page access request; the option data array records multiple option data and the linkage relationship between the multiple option data in a non-nested manner.

[0082] After receiving the webpage access request, the server accesses a database based on the target webpage information and user ID information carried in the request, and retrieves from the database an array of option data corresponding to the target webpage. Of course, further arrays of option data corresponding to the target webpage and user ID can also be retrieved. That is, after receiving the HTTP request sent by the terminal, the server retrieves the array of option data corresponding to the target webpage in a single operation. The array of option data records multiple pieces of option data and the linkage relationships between the multiple pieces of option data in a non-nested manner.

[0083] The non-nested approach here means that each piece of option data is recorded only once in the option data array, and multiple pieces of option data are all objects at the same level, with the linkage relationships between them recorded within each object. This achieves the goal of recording multiple pieces of option data and the linkage relationships between them without nesting. Therefore, duplicate data is not recorded in the database. This significantly reduces the size of the database and avoids wasting storage space. The linkage relationships between multiple pieces of option data here include inclusion relationships or hierarchical relationships between the multiple pieces of option data.

[0084] Because the option data array stored in the database occupies relatively little storage space, the server can deliver the option data array corresponding to the target webpage to the terminal all at once based on the webpage access request. The terminal can then receive the option data array corresponding to the target webpage delivered by the server all at once. This avoids the problem of frequent HTTP requests triggered by conventional methods, where each click of an option data item on the terminal triggers a single HTTP request to retrieve the corresponding sub-option data.

[0085] Step 360: Generate a target web page based on the option data array.

[0086] After the terminal receives the array of option data corresponding to the target webpage from the server, it can display the option data on the target webpage based on the array of option data and the user's selection of the first-level target option data. This display process does not require initiating an HTTP request to the server.

[0087] The option data array records multiple option data and the linkage relationships between the multiple option data in a non-nested manner. Based on the option data array and the user's selection of the first-level target option data, the option data can be linked and displayed on the target webpage. Specifically, the option data is linked and displayed on the target webpage based on the multiple option data and the linkage relationships between the multiple option data.

[0088] In the embodiment of the present application, a webpage access request is sent to a server, and the server receives an option data array corresponding to a target webpage, issued in response to the webpage access request. The option data array records multiple option data and linkage relationships between the multiple option data in a non-nested manner. The target webpage is generated based on the option data array.

[0089] Since the option data array stored in the database records multiple option data and the linkage relationship between multiple option data in a non-nested manner, the size of the database will not be increased, and the storage space occupied by the option data array is also relatively small. Then, the terminal sends a web page access request to the server. After receiving the Http request (web page access request) sent by the terminal, the server can obtain the option data array corresponding to the target web page at one time, and send the option data array to the terminal. Subsequently, the terminal can perform page rendering to generate the target web page based on the option data array and the user's selection instructions for multiple option data, so as to realize the linkage display of the option data in the target web page. There is no need to trigger an Http request to obtain the sub-option data corresponding to the option data when the user triggers a selection instruction for the option data as in the traditional method. Obviously, the web page display method in this application solves the problem of web page freeze caused by frequent access.

[0090] In the above embodiment, a web page display method is described, which can realize the linked display of option data on the web page without frequent access to the database through the server. Figure 4 As shown, in this embodiment, step 360, generating a target web page according to the option data array, includes:

[0091] Step 362: Generate a first-level page of the webpage based on the plurality of option data and the linkage relationship between the plurality of option data; the first-level page displays at least one first-level option data.

[0092] like Figure 5 The figure shows a schematic diagram of the linkage display of option data in a target web page in one embodiment. The target web page includes multiple levels of pages, first-level pages, second-level pages, third-level pages, etc., which are not limited in this application. Since the option data array stored in the terminal records multiple option data and the linkage relationship between multiple option data in a non-nested manner, first, the terminal can generate the first-level page of the web page based on the web page access request, multiple option data and the linkage relationship between multiple option data. Among them, the first-level page includes at least one first-level option data. For example, the first-level page can include only one first-level option data, or it can include multiple parallel first-level option data. Combined with Figure 5 As shown, the first-level page includes multiple parallel first-level option data, such as first-level option data A, first-level option data B, and first-level option data C. First-level option data can be linked to other option data, but other option data cannot be linked to first-level option data.

[0093] Then, you can render based on at least one first-level option data to generate the first-level page of the web page, and get Figure 5The first level page in .

[0094] Step 364: On the first level page of the webpage, receive a user selection instruction for first level target option data; the first level target option data is any one option data of at least one first level option data.

[0095] After rendering based on at least one first-level option data to generate a first-level page of the webpage, a user selection instruction for the first-level target option data can be received on the first-level page of the webpage. The first-level target option data is any option data in the at least one first-level option data. Figure 5 As shown, the user triggers a selection instruction for the first-level option data A on the first-level page. Here, the first-level option data A is the first-level target option data.

[0096] Step 366 , in response to the selection instruction, generating a second level page for linkage display with the first level page of the webpage based on the first level target option data, the plurality of option data and the linkage relationship between the plurality of option data.

[0097] In response to a selection instruction for first-level option data A, the terminal generates a second-level page for display linked to the first-level page of the webpage based on the first-level option data A, the plurality of option data, and the linkage relationships between the plurality of option data. Specifically, based on the first-level option data A, the plurality of option data, and the linkage relationships between the plurality of option data, other option data that can be linked to the first-level option data A is determined. The other option data that can be linked to the first-level option data A is used as second-level option data on the second-level page. Rendering based on this second-level option data generates a second-level page for display linked to the first-level page of the webpage.

[0098] After the second-level page is generated, the second-level page can continue to be used as the new first-level page, and the second-level option data in the second-level page can be used as the new first-level option data. The control terminal is executed cyclically to receive the user's selection instructions for the first-level option data on the first-level page of the web page; the control terminal obtains the second-level option data whose process identifier is the same as the identity identifier of the first-level option data from multiple option data based on the identity identifier of the first-level option data; and the rendering is performed according to the second-level option data to generate a second-level page that is displayed in linkage with the first-level page of the web page until there is no option data with a linkage relationship in the second-level option data.

[0099] For example, on a second-level page of a webpage, a user selection instruction is received for second-level target option data; the second-level target option data is any one of at least one second-level option data. In response to the selection instruction, a third-level page is generated for linked display with the second-level page of the webpage based on the second-level target option data, the plurality of option data, and the linkage relationships between the plurality of option data. This process continues in this manner until the linked display reaches the last-level page of the target webpage.

[0100] In an embodiment of the present application, a first-level page of a webpage is generated based on multiple option data and the linkage relationships between the multiple option data. On the first-level page of the webpage, a user selection instruction for first-level target option data is received. In response to the selection instruction, a second-level page is generated and displayed in linkage with the first-level page of the webpage based on the first-level target option data, the multiple option data, and the linkage relationships between the multiple option data. This process continues in this manner until the linkage display reaches the last-level page of the target webpage.

[0101] The option data array stored in the database records multiple option data and the linkage relationship between multiple option data in a non-nested manner, which will not increase the size of the database, and the storage space occupied by the option data array is also relatively small. Therefore, the terminal can obtain the option data array of the target web page based on a single web page access request, and there will be no problem of web page freeze. Then, the terminal can render the page one level at a time based on the multiple option data stored in the option data array and the linkage relationship between the multiple option data, combined with the user's selection instructions for the page, thereby realizing the linkage display of the option data in the page. The entire linkage display process does not require multiple HTTP requests to the server, which reduces the time it takes to load the page. In addition, the speed of realizing the linkage display of option data in the page is improved.

[0102] In one embodiment, the option data array includes multiple peer objects, each of which records an identity identifier and a process identifier of the option data. If the process identifier of the first option data is the same as the identity identifier of the second option data, then the first option data is option data that has a linkage relationship with the second option data, and the page where the first option data is located is a page one level lower than the page where the second option data is located.

[0103] Step 362: Generate a first-level page of the webpage based on the plurality of option data and the linkage relationship between the plurality of option data, including:

[0104] determining first-level option data from the plurality of option data based on the process identifier of the option data; the process identifier corresponding to the first-level option data is empty;

[0105] Rendering is performed based on the first-level option data to generate the first-level page of the target web page.

[0106] Specifically, the option data array is stored in the database and includes multiple peer objects. That is, each option data item is recorded once as a peer object. Each peer object records the identity and process ID of the option data item. The identity and process ID of the option data item can be used to indicate the linkage relationship (inclusion relationship or hierarchical relationship) between the option data item and other multiple option data items.

[0107] For example, if the process identification (Pid) of the first option data is the same as the identity identification (Id) of the second option data, then the first option data is option data that has a linkage relationship (inclusion relationship or hierarchical relationship) with the second option data, and the page where the first option data is located is a page one level below the page where the second option data is located. In other words, the second option data is included in the page one level below the first option data.

[0108] Therefore, based on the process ID of the option data, the first-level option data is determined from the multiple option data, where the process ID corresponding to the first-level option data is NULL. As shown in Table 1-1, the Pid of the option data with Id=1 is NULL, so the option data with Id=1 is determined to be the first-level option data.

[0109] Then, rendering is performed according to the first-level option data to generate a first-level page of the target webpage, wherein the first-level option data is displayed on the first-level page, and the user can trigger a selection operation on the first-level option data.

[0110] In this embodiment of the present application, since the process identifier corresponding to the first-level option data is predefined as being empty, based on the process identifier of the option data, the option data with an empty process identifier can be determined from the plurality of option data as the first-level option data. Rendering is then performed based on the first-level option data to generate the first-level page of the target webpage. In this way, the first-level option data can be accurately determined, and thus the first-level page of the target webpage can be accurately determined. Thus, based on the rule that the process identifier corresponding to the first-level option data is empty, the first-level page of the target webpage can be quickly generated.

[0111] In the previous embodiment, the process of generating the first-level page of the target webpage was described. In this embodiment, step 364 is further described, which generates a second-level page that is linked to the first-level page of the webpage for display based on the first-level option data, multiple option data, and the linkage relationship between the multiple option data, including:

[0112] According to the identity identifier of the first-level target option data, second-level option data having a process identifier identical to the identity identifier of the first-level target option data is obtained from the plurality of option data;

[0113] Rendering is performed according to the second-level option data to generate a second-level page that is displayed in conjunction with the first-level page of the web page.

[0114] Specifically, based on the process identifier of the option data, the option data with an empty process identifier is determined as the first-level option data from the plurality of option data. Rendering is then performed based on the first-level option data to generate the first-level page of the target webpage. At this point, based on the identity identifier of the first-level target option data, second-level option data with the same process identifier as the first-level target option data can be obtained from the plurality of option data.

[0115] According to Table 1-1, the Pid of the option data with Id=1 is NULL, so the option data with Id=1 is determined to be first-level option data. In Table 1-1, the Pids corresponding to the option data with Id=2 and Id=3 are both 1, which means that the option data with Id=2 and Id=3 are both second-level option data.

[0116] Specifically, rendering is performed based on the second level option data to generate a second level page that is linked to the first level page of the web page. Rendering is performed based on the option data with Id=2 and Id=3 to generate a second level page that is linked to the first level page of the web page.

[0117] like Figure 5 As shown, the first-level page includes first-level option data A, first-level option data B, and first-level option data C. Assume that the Pids of the first-level option data A, the first-level option data B, and the first-level option data C are all NULL, and the Id of the first-level option data A=1.

[0118] Furthermore, the second-level page includes second-level option data A1 and second-level option data A2, so the Pid of second-level option data A1 and second-level option data A2 are both 1, the Id of second-level option data A1=4, and the Id of second-level option data A2=5.

[0119] Further, if the user selects the second-level option data A2 on the second-level page, a third-level page is generated after rendering. The third-level page includes third-level option data A21, third-level option data A22, and third-level option data A23. Then the Pids of the third-level option data A21, the third-level option data A22, and the third-level option data A23 are all 5, the Id of the third-level option data A21 is 9, the Id of the third-level option data A22 is 10, and the Id of the third-level option data A23 is 11.

[0120] Furthermore, if the user selects the third-level option data A23 on the third-level page, a fourth-level page is generated after rendering. The fourth-level page includes fourth-level option data A231, fourth-level option data A232, and fourth-level option data A233. Then the Pids of the fourth-level option data A231, the fourth-level option data A232, and the fourth-level option data A233 are all 11, the Id of the fourth-level option data A231 is 15, the Id of the fourth-level option data A232 is 16, and the Id of the fourth-level option data A233 is 17.

[0121] like Figure 6 As shown, the first-level page, the second-level page and Figure 5 The first-level page and the second-level page shown in are the same, and the detailed rendering process will not be repeated here.

[0122] Furthermore, if the user reselects on the second-level page, that is, it is not the first time that the user has made a selection on the second-level page, and the option reselected by the user is not the previous option. Then, first, the historical operation records are cleared on the second-level page and the subsequent linked pages. Then, if the user reselects the second-level option data A1 on the second-level page, the third-level page is generated after rendering. The third-level page includes the third-level option data A11, the third-level option data A12, and the third-level option data A13. Then, the Pids of the third-level option data A11, the third-level option data A12, and the third-level option data A13 are all 4, the Id of the third-level option data A11 is 6, the Id of the third-level option data A12 is 7, and the Id of the third-level option data A13 is 8.

[0123] Further, if the user selects the third-level option data A12 on the third-level page, a fourth-level page is generated after rendering. The fourth-level page includes fourth-level option data A121, fourth-level option data A122, and fourth-level option data A123. Then the Pids of the fourth-level option data A121, the fourth-level option data A122, and the fourth-level option data A123 are all 7, the Id of the fourth-level option data A121 is 12, the Id of the fourth-level option data A122 is 13, and the Id of the fourth-level option data A123 is 14.

[0124] In an embodiment of the present application, second-level option data having a process identifier identical to the identity identifier of the first-level target option data is obtained from a plurality of option data based on the identity identifier of the first-level target option data. Rendering is performed based on the second-level option data to generate a second-level page that is displayed in conjunction with the first-level page of the web page. Based on the identity identifier of the option data selected by the user on the page, option data having a process identifier identical to the identity identifier of the option data selected by the user can be obtained as second-level option data in combination with the process identifier of other option data. Similarly, based on the identity identifier and process identifier of the option data recorded in the option data array stored in the terminal, the next-level option data can be quickly determined, and then the next-level page can be quickly rendered. This improves the response speed of the web page.

[0125] In a specific embodiment, Figure 7 As shown, a web page display method is provided, which is applied to a terminal and includes:

[0126] Step 702: Display the initial page of the webpage on the terminal;

[0127] Step 704: Initiate a webpage access request to the server, so that the server obtains the option data array corresponding to the target webpage from the database and sends the option data array to the terminal;

[0128] Step 706: Get the option data array corresponding to the target web page, and store the option data array into the page cache data, which is recorded as alldata;

[0129] Step 708: Filter out the option data with a null Pid from alldata, record it as option data data1, and transmit the option data data1 to the first-level page for display;

[0130] Step 710, generating a first level page;

[0131] Step 712: Receive a user's selection instruction for any option data data1 in the first-level page, and record the ID of the option data data1 as select_id;

[0132] Step 714: Filter out the option data with pid=select_id from alldata, record it as option data data2, and transmit option data data2 to the second-level page for display;

[0133] Step 716, generating a second level page;

[0134] Step 718: If the user reselects on the second-level page, a selection instruction for any option data data1 on the first-level page is received, and the id of the option data data1 is recorded as select_id_new;

[0135] Step 720: Clear the historical operation records on the second-level page and subsequent linked pages;

[0136] Step 722: Filter out the option data with pid=select_id_new from alldata, record it as option data data3, and transmit option data data3 to the second-level page for display;

[0137] Step 724, generating a new second-level page;

[0138] In the embodiment of the present application, since the option data array stored in the database records multiple option data and the linkage relationship between multiple option data in a non-nested manner, the size of the database will not be increased, and the storage space occupied by the option data array is also relatively small. Then, the terminal sends a web page access request to the server. After receiving the Http request (web page access request) sent by the terminal, the server can obtain the option data array corresponding to the target web page at one time and send the option data array to the terminal. Subsequently, the terminal can perform page rendering to generate the target web page based on the option data array and the user's selection instructions for multiple option data, so as to realize the linkage display of the option data in the target web page. There is no need to trigger an Http request to obtain the sub-option data corresponding to the option data when the user triggers a selection instruction for the option data as in the traditional method. Obviously, the web page display method in the present application solves the problem of web page freeze caused by frequent access.

[0139] It should be understood that, although the various steps in the above flow chart are shown in sequence as indicated by the arrows, these steps are not necessarily performed in the order indicated by the arrows. Unless otherwise specified herein, there is no strict order restriction on the execution of these steps, and these steps can be performed in other orders. Moreover, at least a portion of the steps in the above flow chart may include multiple sub-steps or multiple stages, and these sub-steps or stages are not necessarily performed at the same time, but can be performed at different times, and the execution order of these sub-steps or stages is not necessarily to be performed in sequence, but can be performed in turn or alternately with other steps or at least a portion of the sub-steps or stages of other steps.

[0140] In one embodiment, Figure 8 As shown, a web page display device 800 is provided, which includes:

[0141] The web page access instruction receiving module 820 is used to receive a web page access request sent by a terminal;

[0142] The option data array acquisition module 840 is used to acquire the option data array corresponding to the target web page from the database through the web page access request; the option data array records multiple option data and the linkage relationship between the multiple option data in a non-nested manner;

[0143] The first target webpage generating module 860 is configured to send the option data array to the terminal so that the terminal generates the target webpage according to the option data array.

[0144] In one embodiment, the option data array includes multiple objects of the same level, and the identity identifier and process identifier of the option data are recorded in the objects of the same level; if the process identifier of the first option data is the same as the identity identifier of the second option data, it indicates that the first option data is option data that has a linkage relationship with the second option data, and the page where the first option data is located is the next level page of the page where the second option data is located.

[0145] In one embodiment, Figure 9 As shown, a web page display device 900 is provided, which is applied to a terminal and includes:

[0146] A web page access request sending module 920 is used to send a web page access request to a server;

[0147] The option data array receiving module 940 is used to receive the option data array corresponding to the target web page sent by the server according to the web page access request; the option data array uses a non-nested method to record multiple option data and the linkage relationship between the multiple option data;

[0148] The second target webpage generating module 960 is configured to generate a target webpage according to the option data array.

[0149] In one embodiment, Figure 10 As shown, the second target webpage generating module 960 includes:

[0150] The first-level page generating unit 962 is configured to generate a first-level page of a webpage based on the plurality of option data and the linkage relationship between the plurality of option data; the first-level page displays at least one first-level option data;

[0151] The selection instruction receiving unit 964 is configured to receive a user's selection instruction for first-level target option data on the first-level page of the webpage; the first-level target option data is any one of the at least one first-level option data;

[0152] The second-level page generating unit 966 is used to generate a second-level page for linkage display with the first-level page of the web page in response to the selection instruction based on the first-level target option data, multiple option data and the linkage relationship between the multiple option data.

[0153] In one embodiment, the option data array includes multiple peer objects, each of which records an identity identifier and a process identifier of the option data. If the process identifier of the first option data is the same as the identity identifier of the second option data, then the first option data is option data that has a linkage relationship with the second option data, and the page where the first option data is located is a page one level lower than the page where the second option data is located.

[0154] The first-level page generating unit is further configured to determine first-level option data from the plurality of option data based on the process identifier of the option data; the process identifier corresponding to the first-level option data is empty;

[0155] Rendering is performed based on the first-level option data to generate the first-level page of the target web page.

[0156] In one embodiment, the second-level page generating unit 966 is further configured to obtain, from the plurality of option data, second-level option data having a process identifier identical to the identity identifier of the first-level target option data, based on the identity identifier of the first-level target option data;

[0157] Rendering is performed according to the second-level option data to generate a second-level page that is displayed in conjunction with the first-level page of the web page.

[0158] The division of the various modules in the above web page display device is only for illustration. In other embodiments, the web page display device may be divided into different modules as needed to complete all or part of the functions of the above web page display device.

[0159] For the specific definition of the web page display device, please refer to the definition of the web page display method above and will not be repeated here. Each module in the above-mentioned web page display device can be implemented in whole or in part through software, hardware, or a combination thereof. Each of the above-mentioned modules can be embedded in or independent of the processor in the computer device in hardware form, or can be stored in the memory of the computer device in software form, so that the processor can call and execute the corresponding operations of each of the above modules.

[0160] Figure 11Schematic diagram of the internal structure of a computer device in one embodiment. The computer device includes a server and a terminal, wherein the terminal can be any terminal device such as a mobile phone, a tablet computer, a laptop computer, a desktop computer, a PDA (Personal Digital Assistant), a POS (Point of Sales), a vehicle-mounted computer, a wearable device, etc. The terminal includes a processor and a memory connected via a system bus. The processor can include one or more processing units. The processor can be a CPU (Central Processing Unit) or a DSP (Digital Signal Processing), etc. The memory can include a non-volatile storage medium and an internal memory. The non-volatile storage medium stores an operating system and a computer program. The computer program can be executed by the processor to implement a web page display method provided in each of the following embodiments. The internal memory provides a cached operating environment for the operating system computer program in the non-volatile storage medium.

[0161] The various modules in the webpage display device provided in the embodiments of the present application may be implemented in the form of a computer program. The computer program may be run on a terminal. The program modules comprising the computer program may be stored in a memory of the terminal. When the computer program is executed by a processor, the steps of the method described in the embodiments of the present application are implemented.

[0162] The present application also provides a computer-readable storage medium, one or more non-volatile computer-readable storage media containing computer-executable instructions, which, when executed by one or more processors, cause the processors to perform the steps of the webpage display method.

[0163] An embodiment of the present application further provides a computer program product comprising instructions, which, when executed on a computer, enables the computer to execute the web page display method.

[0164] It should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for analysis, stored data, displayed data, etc.) involved in this application are all information and data authorized by the user or fully authorized by all parties.

[0165] As used herein, any reference to memory, storage, database, or other medium may include non-volatile and / or volatile memory. Non-volatile memory may include ROM (Read-Only Memory), PROM (Programmable Read-only Memory), EPROM (Erasable Programmable Read-Only Memory), EEPROM (Electrically Erasable Programmable Read-only Memory), or flash memory. Volatile memory may include RAM (Random Access Memory), which serves as an external cache memory. By way of illustration and not limitation, RAM is available in many forms, such as SRAM (Static Random Access Memory), DRAM (Dynamic Random Access Memory), SDRAM (Synchronous Dynamic Random Access Memory), Double Data Rate DDRSDRAM (Double Data Rate Synchronous Dynamic Random Access memory), ESDRAM (Enhanced Synchronous Dynamic Random Access memory), SLDRAM (Sync Link Dynamic Random Access Memory), RDRAM (Rambus Dynamic Random Access Memory), and DRDRAM (Direct Rambus Dynamic Random Access Memory).

[0166] The above embodiments merely illustrate several implementation methods of the present application. While the descriptions are relatively specific and detailed, they should not be construed as limiting the scope of the present invention. It should be noted that a person skilled in the art could make various modifications and improvements without departing from the spirit of the present invention, all of which fall within the scope of protection of the present invention. Therefore, the scope of protection of the present invention shall be determined by the appended claims.

Claims

1. A web page display method, characterized in that: Applied to a server, the method includes: Receiving a web page access request sent by a terminal; An option data array corresponding to a target web page is obtained from a database through the web page access request; the option data array records a plurality of option data and linkage relationships between the plurality of option data in a non-nested manner; the non-nested manner means that each option data is recorded only once in the option data array, and the plurality of option data are all objects of the same level, and each object of the same level has an identity identifier and a process identifier recorded therein to indicate linkage relationships between itself and other objects of the same level; The option data array is sent to the terminal so that the terminal stores the option data array in the page cache, and filters out the option data with an empty process identifier from the page cache to generate a first-level page, and receives a selection instruction for any option data in the first-level page, filters out the option data with a process instruction consistent with the identity identifier of the option data from the page cache to generate a second-level page, and when the user re-selects on the second-level page, clears the historical operation records on the second-level page and subsequent linked pages.

2. The method according to claim 1, characterized in that If the process identifier of the first option data is the same as the identity identifier of the second option data, it indicates that the first option data is option data having a linkage relationship with the second option data, and the page where the first option data is located is the next level page of the page where the second option data is located.

3. A web page display method, characterized in that: Applied to a terminal, the method includes: Send a web page access request to the server; receiving an option data array corresponding to a target webpage and issued by the server in response to the webpage access request; wherein the option data array records a plurality of option data and linkage relationships between the plurality of option data in a non-nested manner; wherein the non-nested manner means that each option data is recorded only once in the option data array, and the plurality of option data are all objects of the same level, and each object of the same level records an identity identifier and a process identifier of the option data to indicate linkage relationships between itself and other objects of the same level; Storing the option data array in a page cache, and filtering option data with a process identifier of null from the page cache to generate a first-level page; receiving a selection instruction for any option data in the first-level page, filtering out option data whose process instruction is consistent with an identity identifier of the option data from the page cache, and generating a second-level page; If the user makes a new selection on the second-level page, the historical operation records on the second-level page and subsequent linked pages are cleared.

4. The method according to claim 3, characterized in that The method includes storing the option data array in a page cache, filtering out option data with an empty process identifier from the page cache, and generating a first-level page; receiving a selection instruction for any option data in the first-level page, filtering out option data with a process instruction consistent with the identity identifier of the option data from the page cache, and generating a second-level page, including: Based on the plurality of option data and the linkage relationship between the plurality of option data, a first-level page of the webpage is generated; at least one first-level option data is displayed on the first-level page; On the first level page of the webpage, receiving a user selection instruction for first level target option data; the first level target option data is any one option data of the at least one first level option data; In response to the selection instruction, a second-level page is generated for linkage display with the first-level page of the web page according to the first-level target option data, the plurality of option data, and the linkage relationship between the plurality of option data.

5. The method according to claim 4, characterized in that The option data array includes a plurality of peer objects, each of which records an identity identifier and a process identifier of the option data. If the process identifier of the first option data is the same as the identity identifier of the second option data, then the first option data is option data that has a linkage relationship with the second option data, and the page where the first option data is located is a page one level lower than the page where the second option data is located. The step of generating a first-level page of the webpage based on the plurality of option data and the linkage relationship between the plurality of option data includes: determining first-level option data from the plurality of option data based on the process identifier of the option data; the process identifier corresponding to the first-level option data is empty; Rendering is performed according to the first-level option data to generate a first-level page of the target web page.

6. The method according to claim 5, characterized in that The step of generating a second-level page for linkage display with the first-level page of the webpage according to the first-level option data, the plurality of option data, and linkage relationships between the plurality of option data includes: According to the identity identifier of the first-level target option data, obtaining second-level option data having a process identifier identical to the identity identifier of the first-level target option data from the plurality of option data; Rendering is performed according to the second-level option data to generate a second-level page that is displayed in conjunction with the first-level page of the web page.

7. A web page display device, characterized in that: The device comprises: A web page access instruction receiving module is used to receive a web page access request sent by a terminal; An option data array acquisition module is configured to acquire, from a database, an option data array corresponding to a target web page through the web page access request; the option data array records multiple option data and linkage relationships between the multiple option data in a non-nested manner; the non-nested manner means that each option data item is recorded only once in the option data array, and the multiple option data items are all objects of the same level, with each object of the same level recording an identity identifier and a process identifier for the option data item to indicate linkage relationships between itself and other objects of the same level; The first target web page generation module is used to send the option data array to the terminal so that the terminal stores the option data array in the page cache, and filters out the option data with an empty process identifier from the page cache to generate a first-level page, and receives a selection instruction for any option data in the first-level page, filters out the option data with a process instruction consistent with the identity identifier of the option data from the page cache to generate a second-level page, and clears the historical operation records on the second-level page and subsequent linked pages when the user re-selects on the second-level page.

8. A computer device comprising a memory and a processor, wherein a computer program is stored in the memory, wherein: When the computer program is executed by the processor, the processor is caused to perform the steps of the web page display method according to any one of claims 1 to 6.

9. A computer-readable storage medium having a computer program stored thereon, characterized in that: When the computer program is executed by a processor, the steps of the web page display method according to any one of claims 1 to 6 are implemented.

10. A computer program product comprising a computer program, characterized in that When the computer program is executed by a processor, the steps of the web page display method according to any one of claims 1 to 6 are implemented.

Images