Web caching problem

1，The company’s website is composed of static pages. Every time the publication is completed, the user visits the old page.

2，Clear history, visit again is the new page.

3，But it is not very realistic to clear the historical records. So, what are the good solutions?

Thank you!

Answer 0:

After accessing the link URL, add “time=” + new Date ().GetTime (); of course, the random number is also OK.

Answer 1:

Add the version number, or set the cache-control

Answer 2:

An elegant way is to compile and package your js, css, and other files with tools like webpack, gulp, and then add version numbers.In a general way, after modifying JS or CSS, you manually add a suffix to the file (such as a timestamp), for example, the original JS is called “index.js”, and then you modify some of the code, and you can change it to “index2017091” before you go online.3.js “. The user – side browser will load your latest JS.This problem is mainly about browser caching, and in general browsers, JS, CSS files are cached in the user’s locality for performance considerations, so that users may not be able to download the resources again when they re access the web page. So, give your resources a better name.Or look at your business situation, I think the amount of JS static website may be a little smaller, so you can manually change. But it is really recommended to introduce webpack. If the project is relatively large, manual change is not realistic at all.See your label in node.js, you can also use node to write a script to automatically change the name of the JS, attention, also need to change the name of the JS introduced in the HTML!

Answer 3:

http://www.genshuixue.com/i-c…

Answer 4:

If it’s a full static page, it can be said that the version number can be added to all links by the packaging tool.Otherwise, you must control the cache rules through the web server (reduce cache time).

Answer 5:

Adjust cache policies, such as Last-Modified and ETag.

Answer 6:

Adding version numbers is a common practice now. If static pages are not large, you can set up cache-control without caching.

Answer 7:

It can be updated automatically at a certain time, such as setting up a 5 minute automatic update.

Method:

Setting up a buffer update time:$cacheTime = 10*30Get the path to the file:$cacheFile = "cache/static.html";Use fi every time you get a static pageLemtime gets the time to modify the file:If (file_exists ($cacheFile) & & time () - $cacheTime > filemtime ($cac)HeFile)) {... some code...}If the user has visited 300 seconds, the new static page will be regenerated.

Answer 8:

Every time it is displayed, what do we need to do with the cache? When you do static distribution on the CDN server, you will make a strategy, and you can clean up the cache on the CDN side, and the cache of the CSS and JS files, plus the corresponding version number, to ensure that each update gets the most.New, direct image caching is fine for a year, pages don’t change frequently at all, and all the data you need is loaded asynchronously by ajax. So, you can do well with JS and CSS.

Answer 9:

According to the landlord’s scenario, the simplest way is to set up.Cache-Control: no-cache，This means that every time a user visits a page, he needs to run to the server to check whether the local copy is expired. If the expiration date, the server returns a new web page.

More detailed and complex settings, such as setting cache duration, can be found in “Web Performance Optimizations: No-cache and must-revalidate in depth”

Answer 10:

Look at your tag with nodejs, and you can use tools like gulp to help you with hash filenames – this is actually one of the CDN best practices. Because as soon as the file changes, the hash file name changes, so that the user immediately gets the latest resources, and has been slowSave the expiration date.

If you are using an engineering project like angular, even the angular-cli packaging with the product environment has the function of the hash file name, which belongs to the front end best practice.