Interview – Browser negotiation cache and strong cache

• Strong cache

Request headers cache-control and Expires are used to strongly cache files. Generally, both are set at the same time because browsers support different headers, and some browsers only recognize cache-Control.

Sample

Cache-Control:max-age=600  				             // Cache will be strong for 600 seconds
expires:Sun Jun 13 2021 01:40:44 GMT+0800(China Standard Time)// Strengthen the cache before this time
Copy the code

• Negotiation cache

Negotiation caching is performed by setting request headers if-modified-since and response headers last-modified or request headers if-none-match and response headers Etag.

Sample

//组合1:
If-Modified-Since:Sun Jun 13 2021 01:40:44 GMT+0800(China Standard Time)/ / request header
Last-Modified:Mon Jan 03 2022 00:00:00 GMT+0800(China Standard Time)/ / response headers
//组合2:
If-None-Match:"12138"		                                 / / request header
Etag:W/"12138" 							 / / response headers
Copy the code

If the value of if-modified-since is less than last-modified, the cache is used. If the value of if-modified-since is less than last-modified, the service request data is used.

Combination 2: to check whether the values of two validations are the same, W in Etag indicates weak validator, and strong validator if no write is used.

• APISummary

Cache-control apis

Cache-Control: max-age=31536000  // Indicates the maximum time that a resource can be cached.
Cache-Control: no-store          // Get the content from the server every time
Cache-Control: no-cache          // This method validates the cache expiration from the server first, and then the absolute cache expiration
Cache-Control: private or public The default value of the cache is private. If the default value is set to public, information such as the account and password may be cached by the middleman
Cache-Control: must-revalidate   // Cache validation
Copy the code