Detailed Explanation of Nginx Cache Setting Case

  • 2021-11-02 03:49:58
  • OfStack

When developing and debugging web, we often encounter the trouble of emptying the cache or forcing a refresh to test because of the browser cache (cache). We provide the settings of apache non-cache configuration and nginx non-cache configuration. There are two common cache settings, both of which are set by add_header: Cache-Control and Pragma.

location ~ .*\.(css|js|swf|php|htm|html )$ {
add_header Cache-Control no-store;add_header Pragma no-cache;

For static content (such as pictures, JS, CSS) that is not frequently modified in the site, expires expiration time can be set in the server to control browser cache, so as to effectively reduce bandwidth flow and server pressure.

Take the Nginx server as an example:

location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$ {
# The expiration time is 30 God, 
# The picture file is not updated very much, and it can be set to be large when 1 Point, 
# If it is updated frequently, it can be set to be small 1 Point. 
expires 30d;
location ~ .*\.(js|css)$ {
expires 10d;

"Background": Expires is the Web server response header field, which tells the browser that the browser can directly fetch data from the browser cache before the expiration time without requesting it again when responding to the http request.

[Relevant information]

1. Cache-control strategy

The functions of Cache-Control and Expires are to indicate the validity period of the current resource and control whether the browser directly fetches data from the browser cache or re-sends the request to the server to fetch data. However, Cache-Control has more choices and more detailed settings. If it is set at the same time, its priority is higher than Expires.

http protocol header Cache-Control:

Values can be public, private, no-cache, no-store, no-transform, must-revalidate, proxy-revalidate, max-age

The instructions in each message have the following meanings:

Public indicates that the response can be cached by any cache. Private indicates that all or part of a response message to a single user cannot be processed by the shared cache. This allows the server to describe only part of the response message when the user is not valid for requests from other users. no-cache indicates that request or response messages cannot be cached no-store is used to prevent important information from being unintentionally released. Sending in a request message will cause neither request nor response messages to use cache. max-age indicates that a client can receive a response with a lifetime of no more than a specified time (in seconds). min-fresh indicates that a client can receive a response with a response time less than the current time plus a specified time. max-stale indicates that the client can receive response messages beyond the timeout period. If you specify a value for the max-stale message, the client can receive a response message that exceeds the specified value for the timeout period.


Last-Modified/If-Modified-Since shall be used in conjunction with Cache-Control. Last-Modified: Indicates when this response resource was last modified. When the web server responds to the request, it tells the browser when the resource was last modified. If-Modified-Since: When the resource expires (max-age identified by Cache-Control) and the resource is found to have an Last-Modified declaration, the web server is requested again with the header If-Modified-Since, indicating the request time. The web server receives the request and finds the header If-Modified-Since, and then compares it with the last modification time of the requested resource. If the last modification time is newer, indicating that the resource has been changed again, the whole resource content (written in the response message package) is responded, HTTP 200; If the last modification time is old, indicating that there is no new modification of the resource, the browser is informed to continue using the saved cache in response to HTTP 304 (no inclusion, saving browsing).

What it ultimately achieves is equivalent to setting up these three types of html caching technologies:

<meta http-equiv="pragma" content="no-cache"/>
<meta http-equiv="Cache-Control" content="no-cache, must-revalidate"/> 
<meta http-equiv="expires" content="0"/>

Related articles: