Shulou(Shulou.com)06/02 Report--

This article introduces the relevant knowledge of "whether the cache status code of HTTP is 200or 304". In the operation of actual cases, many people will encounter such a dilemma, so let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!

When the browser loads the resource for the first time, it generally returns 200, which means that the resource was successfully obtained and the max-age is recorded in the browser's cache. On the second visit: if you just open it with the browser, the browser will determine whether the resource is in the cache or not. If so, it will determine whether the resource has expired or not. If it has not expired, it will read the cache directly. Will not interact with the server at all, in other words, the network can be turned on, just like running locally! If it has expired, then go to the server to request and wait for the server to respond, which is very time-consuming. If the server finds that the resource has not changed, it will return 304 to tell the browser, "I have not changed, you read the cache." so the browser does not have to pull data from the server, however, waiting for the server response is also a very deadly problem, in the rapid development of the network today, waiting for a response Sometimes it's slower than downloading. If it is refreshed with a browser, then the browser will not judge max-age, but go directly to the server to get it. If the server determines that the resource has not changed, it will still return 304, which is the same as above, so refreshing is actually very scary. It is tantamount to going to the server to request all the resources and ask the server if I have expired.

When the browser requests a resource for the first time, the expires field can be set in the server response header, which indicates the cache expiration time of the resource. On the second request, if the time is still within the cache time, the cache will be used directly, otherwise the resource will be reloaded. This expires field has a defect that it must be synchronized strictly between the server and the client before it can take effect. So now many people will not use the change plan. Another solution is that when the resource is requested for the first time, the server sets the response header cache-control: max-age, which means to tell the browser when the resource expires. When the resource is requested for the second time, determine whether the expiration time has expired. If not, use the cache directly.

Cache status codes 200OK (from cache) and 304Not Modified

200 OK (from cache) is that the browser does not confirm with the server and directly uses the browser cache.

Not Modified is a cache reused after the browser and server confirm the validity of the cache once more.

Not Modified: the client has buffered files and issues a conditional request (usually an If-Modified-Since header is provided to indicate that the customer only wants to update the document on a specified date). The server tells the customer that the original buffered document can continue to be used.

304Not Modified is slower than 200OK (from cache), which refers to the cache used by the browser after confirming "If-Not-Modified" to the server.

200 and 304 featur

Status code 200: the request is successful and the desired response header or data body of the request will be returned with this response. That is, the returned data is the full amount of data, if the file is not compressed by GZIP, the size of the file, the amount of transmission.

Status code 304If the client sends a conditional GET request and the request is allowed, and the content of the document (since the last access or according to the requested condition) has not changed, the server should return this status code. That is, the client and server only need to transfer a small amount of data to do the file verification, if the file has not been modified, it is not necessary to return full amount of data.

A request with a status of 304 has a much smaller amount of data than a request with a status of 200, because 304 only needs to return the response header, not the entire file, so it only needs a few bytes, which can save a lot of network bandwidth. and reduce the rendering time of the page.

What is browser caching?

The browser cache is to save the resources of the network to speed up browsing. The browser stores the recently requested document on the user's disk. When the visitor requests the page again, the browser can display the document from the local disk. In this way, you can speed up the reading of the page. Browser cache mainly includes strong cache and negotiation cache. Baidu encyclopedia

Browser caching is also known as http caching.

Generally speaking, browser cache means that the browser caches the requested resources locally (hard disk and memory) in order to save network resources and speed up page rendering, and then judge whether to read the local cache resources according to the http response header.

Cache HTTP header information

Date: the time when the original server sent the resource response message (GMT format)

Age:Age indicates how long the response has been alive (HTTP/1.0 's response does not include Age)

Expires: that is, the specific failure time (HTTP/1.0) is specified in the HTTP header, Expires = HTTP-date

Pragma:no-cache, do not read cache every time a page is requested, compatible with HTTP/1.0, priority is higher than Expires (HTTP/1.0 + HTTP/1.1)

Cache Control: priority is higher than Pragma, Expires (HTTP/1.1) [public, both client and server can cache; private, only client cache; no-store, no cache; no-cache, use negotiation cache. ]

Expires

Expires is a header proposed by http1.0 to represent the expiration time of resources, which describes an absolute time that is returned by the server.

The second time Expires requests, it will be compared with the local time.

The first time Expires requests the server, the response header returns an Expires file expiration time.

In the second request of Expires, the client compares the local time with the expiration time of the file. If the file is not expired, it directly uses the local cache and returns the status code 200 (from memory cache) or 200 (from disk cache).

Expires Cache-Control

Cache-Control: no-cache must first confirm the change with the proxy server, and then decide whether to use the cache or request, similar to the negotiation cache (304)

Cache-Control: no-store is really not caching data locally.

Cache-Control: public can be cached by all users (shared by multiple users), including intermediate proxy servers such as terminals and CDN

Cache-Control: private can only be cached by terminal browsers (and private cache), and relay cache servers are not allowed to cache

Cache-Control: must-revalidate if the cache content is invalid, the request must be sent to the server for verification

Cache-Control: max-age=s cache content expires after s seconds. Only HTTP1.1 is available when max-gae requests the server for the first time, the response header will return a max-age, which is how long the file expires. Max-gae the second request, the client will verify whether the file is expired, if the file is not expired, directly use the local cache, return status code 200 (from memory cache) or 200 (from disk cache).

Strong caching (200 from disk cache or 200 from memory cache, hard disk cache and memory cache)

Strong caching means that the browser caches the requested resource and determines that the resource is not expired according to the cache identity (cache-control:max-age and expires of the response header).

Negotiation cache (304)

Negotiation cache means that the browser caches the requested resource but fails to determine whether the resource is expired. It needs to initiate a request to the server with the cache ID (last-modified and Etag of the response header) to ask whether the resource is expired.

Browser cache related response header

Strong cache correlation

Expires

Expires is the field in HTTP/1.0 that controls the browser cache, and its value is the expiration time of the request result cache returned by the server. When the browser initiates the request again, if the client time is earlier than the expiration time, the cached result is read directly without having to initiate the request again.

Because the client time is used to judge, the unexpected caching behavior may be caused by the difference between the client time and the server time.

Cache-Control

Cache-control is a field of HTTP/1.1 and an important rule to control cache. its value contains several sets of optional values, separated by commas.

Hongmeng official Strategic Cooperation to build HarmonyOS Technology Community

Control proxy server cache

Public: all content is cached (both proxy server and client can be cached)

Private (default): cacheable only by client

Hongmeng official Strategic Cooperation to build HarmonyOS Technology Community

Controls whether it is cached

No-cache: client caches content. Whether to use cache or not needs to be negotiated with the server.

No-store: all content will not be cached

Hongmeng official Strategic Cooperation to build HarmonyOS Technology Community

Control the cache validity period

Max-age: the value is the valid time of the resource (in seconds), indicating that the cache will expire after xx seconds

When max-age and expires exist at the same time, only max-age is valid and expires will no longer be valid.

Negotiate cache correlation

Last-modified

Last-modified is used to identify the latest modification time of a resource and to mark whether the content is updated.

The last-modified of the response header will be stored in the cache together with the cache identity. When a second request requires server negotiation, the if-Modified-Since field of the request header will compare the value of the last-modified in the cache with the resource modification time of the server to determine whether the cache has expired.

Using last-modified, it is possible that server resources do not produce substantial updates but the modification time is updated, such as resource rewriting.

Etag

Etag is a string encoding calculated by the server according to the resource content through a series of algorithms to identify the resource. When the resource content is modified, the corresponding Etag will also be updated. Its main function is to mark whether the content of the resource is updated.

Similarly, the Etag of the response header will be stored in the cache as the cache identity. When a second request requires server negotiation, the if-None-Match field of the request header will compare the etag value in the cache with the Etag of the resource on the server to determine whether the cache has expired.

When Etag and last-modified appear at the same time, the logo of Etag shall prevail.

Browser cache related request headers

Cache-Control

No-cache: forces verification to the source server again, and the control proxy server cannot directly return the cache

Max-age: the maximum age value of the response. You can set max-age=0 to use negotiation cache.

Last-modified-since

Use with last-modified

If-None-Match

Configure Etag usage

Complete browser caching process

Hongmeng official Strategic Cooperation to build HarmonyOS Technology Community

Determine whether there is a cache locally, proceed to step 4 if there are no local cache resources, and proceed to step 2 if so.

Determine whether the cache expires by expires and max-age, and return the resource directly (200from cache) if it does not expire. Otherwise proceed to step 3.

Carry the cache identification (if-modified-since if-None-Match) for the request, negotiate with the server to verify whether the cache expires, if not, the server returns a response without a resource entity, and the browser acquires the resource from the cache and returns it to the front end, otherwise it proceeds to step 4.

4. The resource is requested normally, and the server returns the resource (200) and caches it.

Cache relevant knowledge points

Location of the cache

The storage location of browser cache is divided into hard disk (disk cache) and memory (memory cache), and the reading order of browser is memory-> hard disk.

Different resources may be cached in different locations

Hongmeng official Strategic Cooperation to build HarmonyOS Technology Community

Css: because css parsing does not need to be used after building the CSSOM tree, it is cached on the hard disk and read from the hard disk when it is read.

JS and images: because browsers parse JS and images and put them in memory, priority is given to reading memory (it turns out not necessarily) and the hard disk cache is read when a new window or browser is opened.

Caching problems caused by different user behaviors

Refresh (F5/Command+r)

Cache-Control:max-age=0 is added to the document request header during refresh, so the document usually triggers the negotiation cache. Resources other than the document (JS css) are normally requested (strong caching or negotiation caching may be triggered).

Force refresh (CTRL + F5/Command+shift+r/ check disable cache)

When forced refresh, Cache-control:no-cache is added to the request header, negotiation cache is used, but the negotiation cache field (if-modified-since if-none-match) is also deleted, so the end result is to request new resources from the server.

Close browser / open new tab

Without special operations, it is possible to use strong caching or negotiation caching.

This is the end of the content of "whether the cache status code of HTTP is 200or 304". Thank you for your reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.