Web site Css,js After the update of the customer browser cache problem, need to refresh to normal display of the solution __c#

Source: Internet
Author: User
Tags browser cache

Original source: http://blog.csdn.net/csdn100861/article/details/50684438

Problem Description

Recently, the company's official website style has been adjusted, deployed to the server after the access found page display is not normal, but after the refresh will show normal. Problem Analysis

After the study found that the possible reasons for the CSS file is too large, loading slow local cache problem, although the server modified the CSS file, but the browser still uses the locally cached CSS,

Need users to refresh the normal display is obviously very unreasonable, then how to solve the update after the browser to request a new CSS or JS file. Solutions Method 1 Change the Css/js file name after updating the file.

In fact, the solution to this problem is very simple, the cache is to mark the contents of the cache by file name. After you have updated the content of the CSS file of the website, you can change the filename of the CSS. As in the original HTML, the CSS call statements are as follows:

<link rel= "stylesheet" href= "Style.css" type= "text/css"  media= "screen"/>
1 1

Change the CSS file name:

<link rel= "stylesheet" href= "Stylev2.css" type= "text/css" media= "screen"/>
1 1 Method 2 Add a version number to the Css/js file

Every time you modify the CSS file to modify the file name of the CSS is a bit cumbersome, then we can load the CSS statement to add a version number (that is, the CSS link in the back of the content) on it. As in the original HTML, the CSS call statements are as follows:

<link rel= "stylesheet" href= "style.css?v=2015" type= "text/css"  media= "screen"/>
1 1

To change the version number of a CSS file to a new:

<link rel= "stylesheet" href= "style.css?v=2016" type= "text/css"  media= "screen"/>
1 1 about the css/js file suffix parameter:

CSS file after the question mark can not play a practical role, only as a suffix, if the question mark with the method of adding parameters, you can add the version number and other information, updates can refresh the browser side of the cache. A small detail that can bring us great convenience.
Like what:

<script type= "Text/javascript" src= "homepage.js?version=1.2.6" ></script>
1 1
<link rel= "stylesheet" href= "base.css?version=2.3.3" type= "Text/css"/>
1 1

Two functions of using parameters:

The client caches CSS or JS files, so each time you upgrade the JS or CSS file, change the version number, the client browser will download the new JS or CSS files, play a role in refreshing the cache.

The script does not exist, but it is dynamically generated by the server, so there is a version number to differentiate. That is, the code above is equivalent to a file:

<script type= "Text/javascript" src= "Homepage.js" ></script>
1 1
<link rel= "stylesheet" href= "Base.css" type= "Text/css"/>
1 1

But the browser will consider him to be a version of the file.

The first use is the most, and it is possible to use both.

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.