Question

我刚刚花了半天时间悄悄发疯。

我正在对Site.css文件中的类进行更改，并且它们没有反映在我的计算机上正在开发的站点中。因为我正在通过jQuery学习并使用addClass和removeClass，并且我正在动态创建这些调用的参数，我确信问题出在我的实现中。

结果证明CSS文件已缓存在浏览器中，而我所要做的就是刷新它......

有没有办法强制刷新（最好只在调试期间我猜）？

Answer 1

“缓存中断”的一种流行方法是在css源中附加参数。通常使用时间戳。我更喜欢“文件最后修改”时间，即。 PHP中的filemtime()。我确定有一个asp.net函数会给你这个。

然后你的CSS标签变为：

<link rel="stylesheet" type="text/css" media="screen" href="/main.css?123456789"/>

每当CSS文件更新时，

都会更改查询参数。

Answer 2

按 CTRL + F5 对网页上的所有内容进行硬刷，包括脚本和样式表。

此外，您可以从动态服务器页面[php / asp.net]和Response.Expires = -1合并要提供的样式表，这将强制客户端显式加载每个HTTP-GET请求上的css。您也可以在CSS mime类型的Web服务器设置中执行此操作。

Answer 3

我使用这个技巧：

<link rel="stylesheet" type="text/css" href="cssfile.css?t=<%= DateTime.Now.Ticks %>" media="screen" />

Answer 4

对于ASP.NET，后面的代码（您可以将它放在实用程序类或母版页中）：

public static string GetTimestampedUrl(string virtualPath)
{
  var realPath = HostingEnvironment.MapPath(virtualPath);
  var file = new FileInfo(realPath);

  return VirtualPathUtility.ToAbsolute(virtualPath) + "?" + file.LastWriteTime.ToFileTime();
}

然后在你的页面中：

<link href="<%= GetTimestampedUrl("~/screen.css") %>" rel="stylesheet" type="text/css" media="screen" />

Answer 5

一个技巧是在样式表的链接中添加QueryString参数

What does '?' do in a Css link?

Answer 6

我不确定所有浏览器，但在IE8中，您可以使用开发人员工具......

转到：

工具 - ＆gt;开发人员工具（F12）

然后（在您的页面上）在开发人员工具中：

缓存 - ＆gt;始终从服务器刷新

Answer 7

这是一个经典问题。您有很多可用的解决方案：

可能最简单的方法是将您的网络服务器配置为服务器CSS文件，因为永远不会立即缓存/过期。显然，你不希望在生产环境中使用它。使用IIS，这很容易做到。
将随机值添加到您要包含的文件的名称，例如的site.css？V = 12。这就是SO为其所包含的内容。我在内部执行此操作，以便在开发机器上，参数每次（guid）更改文件服务，但在部署时它使用svn版本号。有点棘手，但更强大。
很多，我确定

Answer 8

对于Wordpress用户，以下是代码

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

或者更好一个

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

干杯！

Answer 9

我的方法是使用“查询字符串更改”方法绕过缓存（即使在浏览器和代理服务器中）。由于我正在使用母版页，我像往常一样保持与CSS的链接，但添加了一个ID（此处命名为cssStyleSheet）：

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

然后在代码后面我在Page_Load这行代码中实现，添加一个像“？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

为什么？在HTML代码中，一些设计人员可以轻松地更改CSS文件，而不会干扰某些“困难”的代码。使用Application变量，我避免从我的服务器和客户角度（如使用手机）消耗带宽。

如果部署了新的应用程序，则应用程序变量会自动重置，并且如果下载到浏览器（甚至通过代理），则会出现“新”版本的CSS。

Answer 10

最简单的方法是在浏览器中禁用缓存。如果您不能或不想这样做，可以按ctrl + f5。

您的服务器或asp应用程序也可能正在缓存。您可以在web.config中禁用它，也可以重新启动开发服务器以确保向用户显示最新版本的文件。

Answer 11

您是否在更改之间保持浏览器畅通？通常只需在更改CSS文件之间关闭所有浏览器窗口，就会告诉浏览器下载新副本。

Answer 12

为了进一步Ian Kemp's回答利用相关样式表的LastWriteTime，我编写了一个MVC帮助器来输出<link>标记，其中包含内置的缓存清除参数。

守则

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);
    }
}

<强>用法

@Html.StyleSheet("main.css")

<强>输出

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

注意

如果您对var virtualpath = "/~" + ...部分的想法感到疑惑，为什么不将其作为"~/main.css"传递？我已经以这种方式实现了这个函数，因为我的所有css文件都在一个公共文件夹（/ assets）中，帮助器将在我的输出前面加上公共文件夹名称，即/assets/main.css?131393346850223541

Answer 13

<link href="~/css/Style.css?t=@DateTime.Now" rel="stylesheet" />

我使用 C# 日期时间使用了这个简单的技巧。

我可以强制刷新样式表文件吗？

13 个答案: