How to disable mobile browser caching for web apps

Source: Internet
Author: User

Those who have developed web apps, especially front-end users, have encountered this annoying thing. JS or CSS code changes, but the mobile browser does not update any refresh. the cache of mobile browser is particularly bad.

So I am posting a method today to solve this problem. Remember to paste it during local debugging and delete it after going online, so that visitors may experience a slow browsing experience.

Code:

<meta http-equiv="expires" content="0"><meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache">

Paste the above Code into the HEAD.

 

By the way, paste the cached information:

1. Concept

Cache-controlUsed to control the HTTP cache (some of HTTP/1.0 may not be implemented, but only Pragma: no-cache is implemented)

Data packet format:

Cache-Control: cache-directive

Cache-directive can be:

Request:

| "no-cache"| "no-store"| "max-age" "=" delta-seconds| "max-stale" [ "=" delta-seconds ]| "min-fresh" "=" delta-seconds| "no-transform"| "only-if-cached"| "cache-extension"

Response:

| "public"| "private" [ "=" <"> field-name <"> ]| "no-cache" [ "=" <"> field-name <"> ]| "no-store"| "no-transform"| "must-revalidate"| "proxy-revalidate"| "max-age" "=" delta-seconds| "s-maxage" "=" delta-seconds| "cache-extension"
Partial Description: The response can be cached in any cache area according to whether the cache is available. Private indicates that the whole or part of the response message of a single user cannot be processed by the shared cache. This allows the server to only describe part of the user's response message, which is invalid for requests of other users. No-cache indicates that the request or response message cannot be cached (HTTP/1.0 is replaced by no-cache of Pragma). no-store is used to prevent the unintentional release of important information. Sending a request message does not cache the request and response messages. Based on the cache timeout max-age, it indicates that the client can receive responses with a lifetime not greater than the specified time (in seconds. Min-fresh indicates that the client can receive a response whose response time is earlier than the current time plus the specified time. Max-stale indicates that the client can receive response messages beyond the timeout period. If the value of the max-stale message is specified, the client can receive response messages that exceed the timeout period.ExpiresIndicates the existence time. The client is allowed not to check (send a request) before this time, which is equivalent to the max-age effect. If both exist, it will be overwritten by the max-age of Cache-Control. Format: Expires = "Expires": "HTTP-date example: Expires: Thu, 01 Dec 1994 16:00:00 GMT (The GMT format is required)
 
2. the application sets expires and cache-control through META in HTTP. <meta http-equiv = "Cache-Control" content = "max-age = 7200"/> <meta http-equiv =" expires "content =" Mon, 20 Jul 2009 23:00:00 GMT "/> the preceding settings are only for example. You can use one of them. This statement is only valid for the webpage and does not cache images or other requests on the webpage. In this way, the client has more requests. Although only the Last-modified status is checked, the browsing speed must be affected when many requests exist.
To add a cache to a file, use the mod_expire module of apache and write it as <IfModule mod_expires.c> ExpiresActive OnExpiresDefault "access plus 1 days"
</IfModule> remember to set ExpiresActive to On. I didn't set On at first. It seems that YSlow cannot find the cache mechanism. In this way, the default value is all.
For specific MIME types, you can: ExpiresByType image/gif "access plus 5 hours 3 minutes". For details, see Apache Module mod_expires. In addition, when you click Refresh on the browser, in all the requests sent by the client, the value is max-age = 0, indicating the validate operation. When sending the request to the server, the server must check the cache and update the cache. Generally, the result is 304 Not Modified, indicating no change.

 

 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.