发表新帖
发表新帖

Can I force a refresh of my stylesheet file?

前端 未结
关注
12 2199
-上瘾入骨i
-上瘾入骨i 2020-12-13 18:51

I have just spent half a day quietly going mad.

I\'m making changes to my classes in the Site.css file and they were not being reflected in the site being develope

相关标签:
12条回答
  • 误落风尘
    2020-12-13 19:38

    My approach is using the “querystring changing” method to bypass caches (even in browser and proxy servers). Since I’m using Master Pages I maintain the link to CSS as usual like but adding an ID (named here as cssStyleSheet):

    <head runat="server">
<link id="cssStyleSheet" href="~/Styles/Default.css" rel="stylesheet" type="text/css" />

    Then at code behind I implemented at Page_Load this line of code, adding a quesrystring like “?t=5343423424234”.

    Protected Sub Page_Load(…)

    If IsNothing(Application("CSSTicks")) = True Then
        Application("CSSTicks") = DateTime.Now.Ticks
    End If


    cssStyleSheet.Attributes("href") = cssStyleSheet.Attributes("href") & "?t=" & Application("CSSTicks")

End Sub

    Why is that? At HTML code, some designer could change the CSS file as easy, no interfering at some “difficult” code. Using an Application variable I avoid spending bandwidth from my servers and also from customer perspective (like using mobiles).

    If new application is deployed, the Application variable is reset automatically and a “new” version of CSS if downloaded to browser (even through proxies).

    0 讨论(0)
  • -上瘾入骨i
    2020-12-13 19:39

    For Wordpress users, below is the code

    <link rel="stylesheet" href="<?php echo get_bloginfo('stylesheet_url')."?d=".date( 'Ymd', time()); ?>" type="text/css" media="screen" />

    Or better one

    <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); echo '?' . filemtime( get_stylesheet_directory() . '/style.css'); ?>" type="text/css" media="screen, projection" />

    Cheers!

    0 讨论(0)
  • 半阙折子戏
    2020-12-13 19:40

    Press CTRL+F5 to hard-refresh everything on your webpage including scripts and stylesheets.

    Additionally, you can incorporate the stylesheets to be served from a dynamic server page [php/asp.net] and the Response.Expires = -1 which will force the client to load the css on every HTTP-GET request explicitly. You can also do this in your webserver settings for CSS mime types.

    0 讨论(0)
  • 半阙折子戏
    2020-12-13 19:45

    Are you keeping your browser open between your changes? Often simply closing all browser windows between making changes to your CSS file will tell the browser to download a new copy.

    0 讨论(0)
  • 不知归路
    2020-12-13 19:45

    To further Ian Kemp's answer which utilises the LastWriteTime of the style sheet in question, I have written an MVC helper to output the <link> tag with the cache-busting parameter built in.

    The Code

    public static class CssLinkHelper
{
    public static IHtmlString StyleSheet(this HtmlHelper helper, string stylesheetname)
    {
        // define the virtual path to the css file (see note below)
        var virtualpath = "~/" + stylesheetname;
        // get the real path to the css file
        var realpath = HostingEnvironment.MapPath(virtualpath);
        // get the file info of the css file
        var fileinfo = new FileInfo(realpath);

        // create a full (virtual) path to the css file including a cache busting parameter (e.g. /main.css?12345678)
        var outputpath = VirtualPathUtility.ToAbsolute(virtualpath) + "?" + fileinfo.LastWriteTime.ToFileTime();
        // define the link tag for the style sheet
        var tagdefinition = string.Format("<link rel=\"stylesheet\" type=\"text/css\" href=\"{0}\" />", outputpath);

        // return html string of the tag
        return new HtmlString(tagdefinition);
    }
}

    Usage

    @Html.StyleSheet("main.css")

    Output

    <link rel="stylesheet" type="text/css" href="/main.css?131393346850223541" />

    Note

    In case you're wondering about the var virtualpath = "/~" + ... part and thinking, why not just pass it in as "~/main.css"? I have implemented this function this way because all my css files are in a common folder (/assets) and the helper will prefix my output with the common folder name i.e. /assets/main.css?131393346850223541

    0 讨论(0)
  • 野性不改
    2020-12-13 19:48

    This is a classic problem. You have a lot of solutions available:

    1. Probably the easiest way is to configure your webserver to server CSS files as never-cache/expire immediately. Obviously you wouldn't want this on a production environment. With IIS, this is very easy to do.
    2. Add a random value to the name of the file you're including, e.g. Site.css?v=12. This is what SO does for their includes. I do this in house so that on the development machine, the parameter changes each time (a guid) the file is served, but when deployed it uses the svn version number. A little trickier but more robust.
    3. Many, many more I'm sure
    0 讨论(0)
 看不清?
提交回复
热议问题