CN113407876B - Webpage refreshing method, webpage refreshing system and related device - Google Patents

Abstract

The present application provides a webpage refresh method, which includes: receiving a webpage refresh request; judging whether a browser has set up a negotiation cache; if so, judging whether the refresh request hits a view-level cache; the view-level cache is at least three layers; The refresh request includes a view-level cache, and the view-level cache corresponding to the refresh request is returned, so that the browser uses the view-level cache to refresh the web page. When performing webpage refresh, the application firstly determines whether the browser has set up the negotiation cache. When the browser sets the negotiation cache, the server will return the view-level cache corresponding to the refresh request without returning all the data of the webpage, saving repeated level traffic. It makes full use of the browser cache, which can quickly generate pages, shorten the loading time of webpages, and enhance the comfort of users' page browsing. The present application also provides a web page refresh system, a computer-readable storage medium and a server, which have the above beneficial effects.

Description

A web page refresh method, web page refresh system and related device

technical field

The present application relates to the field of computer networks, and in particular, to a web page refresh method, a web page refresh system and related devices.

Background technique

At present, most pages pay attention to the loading speed of the first screen, and for most applications, the first screen is relatively complex, and details are changed frequently, but some pages will not change. Once all the data of the page is requested, most of the data code will be repeated, and in Re-rendering after receiving the code returned by the server seriously affects the page loading speed.

SUMMARY OF THE INVENTION

The purpose of the present application is to provide a web page refresh method, a web page refresh system, a computer-readable storage medium and a server, which can effectively improve the web page loading speed by setting a view-level cache.

In order to solve the above-mentioned technical problems, the present application provides a method for refreshing a webpage, and the specific technical solutions are as follows:

Receive refresh requests for web pages;

Determine whether the browser has set up a negotiation cache;

If so, determine whether the refresh request hits the view-level cache; the view-level cache is at least three layers;

If the refresh request includes a view-level cache, the view-level cache corresponding to the refresh request is returned, so that the browser uses the view-level cache to refresh the web page.

Optionally, before judging whether the browser sets the negotiation cache, it also includes:

Determine whether the browser sets mandatory caching;

If not, perform the steps of judging whether the browser has set the negotiation cache;

If so, determine whether the mandatory cache has expired;

If the forced cache expires, perform the step of judging whether the browser sets the negotiation cache;

If the forced cache has not expired, the webpage is refreshed by using the forced cache.

Optionally, returning the view-level cache corresponding to the refresh request includes:

Parse the request header data contained in the refresh request to obtain a cache identifier corresponding to the view level;

Returns the view-level cache corresponding to the cache ID.

Optionally, if the request header data includes a browser-side view timestamp, returning the view-level cache corresponding to the cache identifier includes:

determine the latest view timestamp;

Determine whether the browser-side view timestamp is consistent with the latest view timestamp;

If inconsistent, the latest view timestamp and the corresponding level cache code are stored in the response header data as the view level cache corresponding to the request header data, and the response header data is returned.

Optionally, if the refresh request does not include a view-level cache, it also includes:

All page source data is returned for the browser to render the page source data and refresh the web page.

Optionally, also include:

A target element is determined, a preset identifier is added to the target element, and the view level cache is generated.

Optionally, also include:

The corresponding unique identifier is configured according to the directory structure of the webpage, and the view-level cache is generated.

The present application also provides a web page refresh system, including:

The request receiving module is used to receive the refresh request of the webpage;

The first judgment module is used for judging whether the browser sets the negotiation cache;

a second judging module, configured to judge whether the refresh request hits a view-level cache when the judgment result of the first judging module is yes; the view-level cache has at least three layers;

A webpage refresh module, configured to return the view-level cache corresponding to the refresh request when the judgment result of the second judgment module is yes, so that the browser refreshes the webpage by using the view-level cache.

The present application also provides a computer-readable storage medium on which a computer program is stored, and when the computer program is executed by a processor, implements the steps of the above-described method.

The present application also provides a server, including a memory and a processor, wherein a computer program is stored in the memory, and the processor implements the steps of the above method when the computer program in the memory is invoked.

The present application provides a webpage refresh method, which includes: receiving a webpage refresh request; judging whether a browser has set up a negotiation cache; if so, judging whether the refresh request hits a view-level cache; the view-level cache is at least three layers; The refresh request includes a view-level cache, and the view-level cache corresponding to the refresh request is returned, so that the browser uses the view-level cache to refresh the web page.

When performing webpage refresh, the application firstly determines whether the browser has set up the negotiation cache. When the browser sets the negotiation cache, the server will return the view-level cache corresponding to the refresh request without returning all the data of the webpage, saving repeated level traffic. It makes full use of the browser cache, which can quickly generate pages, shorten the loading time of webpages, and enhance the comfort of users' page browsing.

The present application also provides a web page refresh system, a computer-readable storage medium and a server, which have the above beneficial effects, which will not be repeated here.

Description of drawings

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 accompanying drawings required for the description of the embodiments or the prior art. Obviously, the drawings in the following description are only It is an embodiment of the present application. For those of ordinary skill in the art, other drawings can also be obtained according to the provided drawings without any creative effort.

1 is a flowchart of a method for refreshing a webpage provided by an embodiment of the present application;

FIG. 2 is a schematic structural diagram of a webpage refresh system provided by an embodiment of the present application.

Detailed ways

In order to make the purposes, technical solutions and advantages of the embodiments of the present application clearer, the technical solutions in the embodiments of the present application will be described clearly and completely below with reference to the drawings in the embodiments of the present application. Obviously, the described embodiments It is a part of the embodiments of the present application, but not all of the embodiments. Based on the embodiments in the present application, all other embodiments obtained by those of ordinary skill in the art without creative efforts shall fall within the protection scope of the present application.

Please refer to FIG. 1. FIG. 1 is a flowchart of a method for refreshing a webpage provided by an embodiment of the present application. The method includes:

S101: Receive a refresh request of the webpage;

The purpose of this step is to receive a refresh request of the webpage, and the refresh request may be an active request or a passive refresh request generated according to preset refresh parameters. For example, when a user opens a webpage on the home page, a refresh request can be actively generated. The web page in this step may originate from various terminal devices that can run web pages. It should be noted that it may be a mobile terminal web page, for example, an application interface on a mobile terminal may be used as a web page in this embodiment.

The specific content of the refresh request is not limited here, and it should at least include the cache request, but the specific cache request content is not specifically limited.

S102: Determine whether the browser sets the negotiation cache; if so, enter S103;

The purpose of this step is to determine whether the browser has set up a negotiation cache. The negotiation cache is used for negotiation and interaction between the client including the browser and the server to determine whether the cached resource expires. When requesting a resource, the browser's local cached identifier is brought to the server at the same time, and the server is compared with the latest resource. If the cached resource has not changed, the browser reads the local cache. If the cached resource has changed, return the latest resource.

S103: Determine whether the refresh request hits the view-level cache; if so, go to S104;

When the browser sets up the negotiation cache, it does not directly perform the comparison process between the local resource and the latest resource on the server, but determines whether the refresh request includes the view-level cache. In this embodiment, if the refresh request includes a view-level cache, by default, the view layering has been performed for the webpage in the browser before this embodiment is executed. There is no limitation on how to perform web page view layering. This embodiment provides the following several web page view layering methods:

The first method: determine a target element, add a preset identifier to the target element, and generate the view-level cache.

That is, the user can customize the target element as a first-level view, and add the corresponding preset identifier to obtain the view-level cache of the target element, which is equivalent to classifying the target element separately from the local web page resources, and performing corresponding processing on the server side. View hierarchy. For example, you can set the corresponding view level for a div, and the attribute is represented by s-index.

The second type: configure the corresponding unique identifier according to the directory structure of the webpage, and generate the view-level cache.

View hierarchy can also be performed according to the directory structure of the web page. For example, the root node html element is the first layer, the same level of body and body is the second layer, the layer below the body is the third layer, and so on. Of course, each level contains a corresponding unique identifier.

The third type: perform first-type view hierarchy according to the directory structure of the webpage, and configure custom hierarchy items on the basis of the first-type view hierarchy.

That is to combine the first and second view layering methods, preferably, in the actual application process of the view layering, the first method and the second method can be combined and divided into two modes. The first is the default mode, which takes the level of the directory tree diagram of the web page element as a reference. In the default mode, each level is automatically marked with a unique v-index. In the second mode, you can manually set the v-index on the element, and the element with the v-index will cache the corresponding unique identifier. The two hierarchical modes can coexist. In order to make the view layering convenient, you can set the default mode to be enabled by default, and the manual mode Can be set freely.

No matter what kind of view layering method is adopted, it should be at least less than three layers, but not too many, usually no more than 10 layers. Each view level should have a unique corresponding identifier, and the view layering method used should be generated with the server-side protocol configuration, so that the server can return the corresponding view-level cache when it receives a refresh request that hits the view-level cache. .

In addition, judging whether the refresh request hits the view-level cache in this step refers to judging whether the refresh request includes a request for the view-level cache, or other forms of requests that have the same effect as the view-level cache request, such as a request that contains the unique identifier of the corresponding view level. request etc.

S104: Return the view-level cache corresponding to the refresh request, so that the browser refreshes the webpage by using the view-level cache.

When the view-level cache is hit in the refresh request, the corresponding view-level cache is returned. Specifically, the request header data included in the refresh request can be parsed to obtain the cache ID corresponding to the view level, and then the view level cache corresponding to the cache ID can be returned.

It should be noted that there is no limitation on how to return the view-level cache corresponding to the refresh request, and it should respond to the corresponding request according to different refresh requests.

For example, if the request header data includes a browser-side view timestamp, the following steps may be included when performing returning the view-level cache corresponding to the cache identifier:

The first step is to determine the latest view timestamp;

The second step is to determine whether the browser-side view timestamp is consistent with the latest view timestamp; if not, go to the third step;

The third step is to store the latest view timestamp and the corresponding level cache code as the view level cache corresponding to the request header data into the response header data, and return the response header data.

The server determines its own latest view timestamp, and judges whether the browser view timestamp in the request header data is consistent with its own latest view timestamp. Since the latest view timestamp in the server is the current latest version, once the two If they are inconsistent, it means that the view timestamp on the browser side lags behind the latest view timestamp on the server side. It should be noted that both the browser-side view timestamp and the server-side view timestamp refer to the latest version time of the corresponding cache, that is, the browser-side view timestamp refers to the last update time of the current version cached in the browser. , the latest view timestamp of the server also refers to the last update time of the current version cached by the server.

When the two are inconsistent, the server stores the latest view timestamp and the corresponding hierarchical cache code into the response header data and returns it. It is easy to understand that after receiving the response header data, the browser uses the hierarchical cache code corresponding to the latest view timestamp to refresh the page, and can also update its own browser view timestamp to the latest view timestamp.

In the above process, both the browser-side view timestamp and the server-side view timestamp serve as cache identifiers, that is, cache identifiers corresponding to the view-level cache. Of course, those skilled in the art can also use this embodiment on the basis of Other forms of cache identifiers are used to implement the comparison process between the browser side and the server side when the view level cache is updated, which are not limited by examples here, and should also be within the protection scope of this application.

In addition, in this embodiment, if the refresh request does not include a view-level cache, all page source data may be returned at this time, so that the browser renders the page source data and refreshes the web page.

It should be noted that the server in this embodiment includes a server and other server devices that can receive a refresh request from the browser and respond to the refresh request.

When performing webpage refresh in this embodiment of the present application, it is first determined whether the browser has set the negotiation cache. When the browser has set the negotiation cache, the server will return the view-level cache corresponding to the refresh request without returning all the data of the webpage to achieve webpage refresh. The targeted refresh at times saves the transmission of repeated hierarchical traffic, and makes full use of the browser cache, which can quickly generate pages, shorten the loading time of webpages, and enhance the comfort of user page browsing.

Based on the above embodiment, as a preferred embodiment, before judging whether the browser sets the negotiation cache, the following steps may also be included:

S201: Determine whether the browser is set with mandatory caching; if not, enter S202; if so, enter S203;

S202: Execute the step of judging whether the browser sets the negotiation cache;

S203: Determine whether the mandatory cache has expired; if not, go to S204; if so, return to S202;

S204: Refresh the webpage by using the forced cache.

This implementation is intended to perform a decision to enforce caching before negotiating caching. Before the browser initiates a request for a resource, it can first determine whether the mandatory cache is hit according to the request header fields Expires and Cach-control. If it hits, it directly reads the local cache resource, no longer sends a request to the server, and returns the corresponding status code. For example, the status code can be 200. When the browser requests a file, the server configures the cache for the file in the response header data. The cache time and cache type are controlled by the server. The specific performance is: cache-control of response header data. Common settings are max-age public private no-cache no-store, etc. To put it simply, the mandatory cache sets an expiration time. Every time the client requests a resource, it will check whether it has expired, and only when it expires will it re-send the request to the server.

If the mandatory cache is not hit, the browser will initiate a request with some request header fields, and the server will determine whether to hit the negotiated cache based on these fields. For example, if-none-match and or if-modified-since, which are request header fields sent by the browser to the server. The if-none-match value contains the Etag value in the response header field of the resource returned by the server last time. The Etag value is the unique identifier generated by the server according to the resource file. As long as the resource file does not change, the Etag value remains unchanged.

And if-modified-since is used to indicate the last-modified value returned by the server last time, last-modified contains the date when the response resource was last modified on the server, and the if-modified-since recorded by the browser corresponds to the above implementation The browser-side view timestamp in the example. Then the server will judge the if-none-match of the request field and the value of the Etag produced according to the resource file it requests, compare whether the two are the same, and judge whether the unique identifier is the same. Or compare the if-modified-since of the request field with the last modification time of the resource on the server, that is, the latest view timestamp in the server. If the same word means that the resource has not changed, the resource file will not be returned, indicating that the cache is negotiated. At this time, the code corresponding to the negotiated cache can be returned, such as 304, which is used to tell the browser to directly read the local cache resource. If it is different, it means that the server resource has changed, it will return the requested resource file, and can also return the corresponding status code, such as 200.

When performing step S202 in this embodiment, reference may be made to the processes from S102 to S104 in the foregoing embodiment, which will not be repeated here.

The following describes the specific parameter setting process for the configuration of the view-level cache and the server:

The specific storage method of the view level in the request header can use key-value pairs. Specifically, the keyword key uses v-index, and the value value is stored in the form of an object. The stored content is the timestamp or unique identifier of the current view update. If the corresponding html code fragment is updated, the difference comparison will be done when publishing, and the corresponding v-index timestamp will be updated. When the browser sends a refresh request, it will also bring the level ID returned by the previous server, and the server will update the latest Compare the level ID of the v-index with the ID in the browser refresh request. If they are consistent, the html code fragment will not be returned. If they are inconsistent, the html code fragment has been updated, the updated html code fragment corresponding to the v-index will be returned, and the browser will receive the corresponding v-index. Code snippets, and then refresh the web page, because only part of the html code needs to be re-rendered when refreshing, which can improve the web page refresh speed.

The server can set the response header to configure whether to use the view hierarchy mode. For example, if the field is view-store, the corresponding value is none, which means that the view hierarchy is not used; auto, automatic mode, the level is 3 in the automatic mode, and the level is the hierarchical mode . When set to level, you can set the level for specific html internal tags. The specific settings are as follows, such as <html v-index="4">level cache tag</html>, after this setting, the server will judge the tag The v-index set on html determines how many layers there are, and then sets a v-index-data with a specific cache identifier for each layer in these layers. When the browser requests again, it will compare the cache identifier and return Nodes with different cache IDs. This embodiment also works on js and css codes, which can effectively reduce the transmission of redundant codes, so as to achieve the purpose of rapid code transmission, thereby contributing to the rapid refresh of the page.

The view-level storage method set in this embodiment and the configuration parameters of the server are a relatively specific implementation process disclosed in this application. Those skilled in the art can use other setting methods on the basis of this embodiment. within the scope of protection of this application.

The web page refresh system provided by the embodiments of the present application is introduced below. The web page refresh system described below and the web page refresh method described above can be referred to each other correspondingly.

2 is a schematic structural diagram of a web page refresh system provided by an embodiment of the present application, and the present application also provides a web page refresh system, including:

a request receiving module 100, configured to receive a refresh request of a webpage;

The first judging module 200 is used for judging whether the browser sets the negotiation cache;

The second judgment module 300 is configured to judge whether the refresh request hits a view-level cache when the judgment result of the first judgment module 200 is yes; the view-level cache has at least three layers;

The webpage refresh module 400 is configured to return the view-level cache corresponding to the refresh request when the second determination module 300 determines that the result is yes, so that the browser refreshes the webpage by using the view-level cache.

Based on the above embodiment, as a preferred embodiment, it also includes:

The forced cache judgment module is used for judging whether the browser sets the mandatory cache before judging whether the negotiation cache is set; if not, enter the first judgment module 200; If the cache expires, enter the first judgment module 200; if the mandatory cache is not expired, use the mandatory cache to refresh the webpage.

Based on the above embodiments, as a preferred embodiment, the webpage refresh module 400 includes:

a parsing unit, configured to parse the request header data contained in the refresh request to obtain a cache identifier corresponding to the view level;

The returning unit is used to return the view-level cache corresponding to the cache identifier.

Based on the above embodiment, as a preferred embodiment, if the request header data includes a browser-side view timestamp, the webpage refresh module 400 includes:

A response data return unit is used to determine the latest view timestamp; determine whether the browser-side view timestamp is consistent with the latest view timestamp; if inconsistent, use the latest view timestamp and the corresponding hierarchical cache code as the The view-level cache corresponding to the request header data stores the response header data, and returns the response header data.

Based on the above embodiment, as a preferred embodiment, it also includes:

A refresh module, configured to return all page source data if the refresh request does not include a view-level cache, so that the browser renders the page source data and refreshes the web page.

Based on the above embodiment, as a preferred embodiment, it also includes:

The first view level generation module is configured to determine a target element, add a preset identifier to the target element, and generate the view level cache.

Based on the above embodiment, as a preferred embodiment, it also includes:

The second view level generation module is configured to configure a corresponding unique identifier according to the directory structure of the web page, and generate the view level cache.

The present application also provides a computer-readable storage medium on which a computer program is stored, and when the computer program is executed, the steps provided by the above embodiments can be implemented. The storage medium may include: U disk, removable hard disk, read-only memory (Read-Only Memory, ROM), random access memory (Random Access Memory, RAM), magnetic disk or optical disk and other media that can store program codes.

The present application also provides a server, which may include a memory and a processor, where a computer program is stored in the memory, and when the processor invokes the computer program in the memory, the steps provided in the above embodiments can be implemented. Of course, the server may also include various network interfaces, power supplies and other components.

The various embodiments in the specification are described in a progressive manner, and each embodiment focuses on the differences from other embodiments, and the same and similar parts between the various embodiments can be referred to each other. For the system provided by the embodiment, since it corresponds to the method provided by the embodiment, the description is relatively simple, and the relevant part can be referred to the description of the method.

Specific examples are used herein to illustrate the principles and implementations of the present application, and the descriptions of the above embodiments are only used to help understand the methods and core ideas of the present application. It should be pointed out that for those of ordinary skill in the art, without departing from the principles of the present application, several improvements and modifications can also be made to the present application, and these improvements and modifications also fall within the protection scope of the claims of the present application.

It should also be noted that, in this specification, relational terms such as first and second, etc. are only used to distinguish one entity or operation from another entity or operation, and do not necessarily require or imply these entities or operations. There is no such actual relationship or sequence between operations. Moreover, the terms "comprising", "comprising" or any other variation thereof are intended to encompass a non-exclusive inclusion such that a process, method, article or device that includes a list of elements includes not only those elements, but also includes not explicitly listed or other elements inherent to such a process, method, article or apparatus. Without further limitation, an element qualified by the phrase "comprising a..." does not preclude the presence of additional identical elements in a process, method, article or apparatus that includes the element.

Claims (8)

1. A webpage refreshing method is characterized by comprising the following steps:

receiving a refreshing request of a webpage;

judging whether the browser sets a negotiation cache or not;

if yes, judging whether the refreshing request hits a view level cache or not; the view level cache is at least three layers;

if the refreshing request contains a view level cache, returning to the view level cache corresponding to the refreshing request so that the browser can refresh the webpage by using the view level cache;

the returning of the view level cache corresponding to the refresh request comprises:

analyzing request header data contained in the refreshing request to obtain a cache identifier corresponding to the view level;

returning the view level cache corresponding to the cache identification;

if the request header data contains a browser-side view timestamp, returning a view level cache corresponding to the cache identifier, including: determining a latest view timestamp;

judging whether the browser-side view timestamp is consistent with the latest view timestamp;

and if the current view timestamp is inconsistent with the current view timestamp, taking the latest view timestamp and the corresponding level cache code as the view level cache corresponding to the request header data, storing the view level cache into response header data, and returning the response header data.

2. The method for refreshing a web page according to claim 1, wherein before determining whether the browser sets the negotiation cache, the method further comprises:

judging whether the browser sets a forced cache or not;

if not, executing a step of judging whether the browser sets a negotiation cache or not;

if yes, judging whether the forced cache is overdue or not;

if the forced cache is overdue, executing a step of judging whether the browser sets a negotiation cache;

and if the forced cache is not expired, refreshing the webpage by utilizing the forced cache.

3. The method for refreshing web pages according to claim 1, wherein if the refresh request does not include a view level cache, further comprising:

and returning all the page source data so that the browser can render the page source data and refresh the webpage.

4. The web page refreshing method according to any one of claims 1 to 3, further comprising:

and determining a target element, adding a preset identifier to the target element, and generating the view level cache.

5. The web page refreshing method according to any one of claims 1 to 3, further comprising:

and configuring a corresponding unique identifier according to the directory structure of the webpage to generate the view level cache.

6. A web page refresh system, comprising:

the request receiving module is used for receiving a refreshing request of a webpage;

the first judgment module is used for judging whether the browser sets a negotiation cache;

the second judging module is used for judging whether the refreshing request hits the view level cache or not when the judging result of the first judging module is yes; the view level cache is at least three layers;

the webpage refreshing module is used for returning to the view level cache corresponding to the refreshing request when the judgment result of the second judgment module is yes, so that the browser can refresh the webpage by using the view level cache;

the returning of the view level cache corresponding to the refresh request comprises:

analyzing request header data contained in the refreshing request to obtain a cache identifier corresponding to the view level;

returning the view level cache corresponding to the cache identification;

if the request header data contains a browser-side view timestamp, returning a view level cache corresponding to the cache identifier, including: determining a latest view timestamp;

judging whether the browser-side view timestamp is consistent with the latest view timestamp;

and if the current view timestamp is inconsistent with the current view timestamp, taking the latest view timestamp and the corresponding level cache code as the view level cache corresponding to the request header data, storing the view level cache into response header data, and returning the response header data.

7. A computer-readable storage medium, on which a computer program is stored which, when being executed by a processor, carries out the steps of the web page refreshing method according to any one of claims 1 to 5.

8. A server, characterized in that it comprises a memory in which a computer program is stored and a processor which, when it calls the computer program in the memory, implements the steps of the web page refresh method according to any one of claims 1 to 5.

Images