在开发过程中如何避免缓存？

31

测试站点更改的外观时，是否有一种简单的方法可以防止所有缓存？我使用WP Super Cache。我可以使用提供的选项删除其缓存，删除浏览器的缓存，但是对CSS或小部件的某些更改仍然不会刷新。我尝试其他变通方法，例如切换浏览器或计算机，但是必须有一个更加简化的工作流程，在此可以确保我正在查看所做的更改，而不是某些早期缓存的格式？最好的解决方案是什么？

css  cache  development-strategy 
— cboettig
source
似乎也有几个插件专门用于CSS。真的有必要吗？这些插件会做一些清除浏览器缓存的操作吗？
— cboettig 2012年
以我为例，我不得不清除DNS提供商（cloudflare）创建的缓存。感谢所有以下建议。
— cboettig 2012年
我使用Chrome浏览器；当我在开发过程中遇到浏览器级缓存问题时，它的隐身窗口会派上用场。
— 约瑟夫·库兰代
希望这个插件能为您提供帮助：wordpress.org/plugins/prevent-browser-caching
— Kostya Tereshchuk '18

Answers:

32

将filemtime()样式表的添加为版本参数。可以说，您的默认样式表位于css/default.css和css/default.min.css（不是style.css）中。当我们在wp_loaded（notinit）上注册样式表时，我们可以将版本作为第四个参数传递。那将是最后修改的时间，因此每次我们更改文件时都会更改。

$min    = WP_DEBUG ? '': '.min';
$file   = "/css/default$min.css";
$url    = get_template_directory_uri() . $file;
$path   = get_template_directory() . $file;
$handle = get_stylesheet() . '-default';

// Overridden?
if ( is_child_theme() && is_readable( get_stylesheet_directory() . $file ) )
{
    $url  = get_stylesheet_directory_uri() . $file;
    $path = get_stylesheet_directory()     . $file;
}

$modified = filemtime( $path );

add_action( 'wp_loaded', function() use ( $handle, $url, $modified ) {
    wp_register_style( $handle, $url, [], $modified );
});

add_action( 'wp_enqueue_scripts', function() use ( $handle ) {
    wp_enqueue_style( $handle );
});

如果您使用的是Node.js和Grunt，则强烈建议使用Browsersync。它将监视您的文件并在文件更改时立即更新它们。它还可以在多个打开的浏览器中同步滚动位置，表单提交等等。很酷。

— 福厦
source
非常感谢。看来这也是以上插件的方法。在我的情况下，它没有解决问题，因为我的DNS提供程序（CloudFlare）正在缓存css文件，所以我不得不在那儿清除缓存-猜想这没有简单的方法。总的来说，我认为这是解决此类问题的最佳方法，因此我将其标记为接受。再次感谢。
— cboettig 2012年
为什么在开发过程中不使用本地样式表？
— fuxia
一些云缓存服务会将您的文件硬缓存8个多小时，因此您要么要求它们实施更好的服务来进行版本控制（有些这样做），更改服务或停止使用它们。
— Wyck
@cboettig CloudFlare具有开发模式设置，该设置将停止缓存3小时窗口。然后，它会在3小时后自动恢复缓存。
— 吉尔伯特
7

在寻找简单的解决方案很多次后，我决定找到可行的方法！

所以...考虑了一下之后，我发现了一种开发新网站时覆盖缓存的好方法...（而且很简单）。

我们需要告诉wp这是一个像这样的新CSS版本...

更改之前： 

wp_enqueue_style( 'maincss', get_template_directory_uri() . '/css/style.css', array(), false, 'all' );

更改后：

wp_enqueue_style( 'maincss', get_template_directory_uri() . '/css/style.css?v='.time(), array(), false, 'all' );

这是我们添加的内容：

?v='.time()

说明：
我们基本上是在将动态版本号添加到css文件中，这迫使浏览器每次更新时都加载新的css。

完成开发后，请不要忘记将其删除，否则该文件的缓存将无法正常工作，并且会加载该文件，以供反复返回的用户使用。

此技术适用于css和js文件-希望对您有所帮助;）

— 下垂的SEO
source
很好，但更好的是，只需在版本的第4个参数中使用time（）即可。这将给您：wp_enqueue_style( 'maincss', get_template_directory_uri() . '/css/style.css', array(), time(), 'all' );
— Dave
使用时间作为第四个参数可能会导致chrome保留该版本。如果您在工作中的网站上缓存其他所有内容，则尤其如此。这样，您就向chrome提交了一个“新文件”，供他使用，而不是尝试将“旧”版本保留一段时间（与其他资源一样）。
— Sagive SEO
不，在chrome上效果很好，我昨天用过。
— 戴夫
这意味着您尚未在htaccess中或通过插件设置缓存/到期时间。但是，无论什么为您工作;）
— Sagive SEO
6

这看起来似乎太简单了，但是如何禁用缓存，直到您完成站点的开发部分为止？开启和关闭不仅简单。

— mor7ifer
source
2
+
— Shane 2012年
谢谢-是否只需要禁用浏览器的缓存？WP superCache是​​否仍会提供缓存的内容？甚至我的DNS服务都缓存，因此我不确定是否需要分别禁用每个缓存（WP，浏览器，DNS等）。
— cboettig 2012年
Sorta取决于您，您必须尝试使用​​它并弄清楚您需要进行的配置。
— mor7ifer 2012年
我和他在一起，只是禁用它，这就是我要做的。
— 马特2012年
4

我知道这个问题已经接受了一个答案，但是我认为该答案对于手头的问题仍然太复杂了，并且根据用户的实际情况可能是不正确的（尽管没有冒犯），所以我想我仍然会分享如何在我进行开发时绕过缓存（不仅限于Wordpress）。

大多数现代浏览器都有一种叫做隐身模式的东西。在这种模式下，计算机中没有任何内容被缓存，因此每次刷新都是从服务器上下载新文件。在Internet Explorer中，按Ctrl + Shift + P。在Firefox和Chrome中，按Ctrl + Shift + N。

如果您的浏览器没有隐身模式，通常可以通过按 Ctrl + F5 IE或Ctrl + Shift + R在Firefox和Chrome上。

至于您对CSS文件（实际上是您的所有资产文件，例如图像和Javascript文件）的疑问，WP Super Cache不会以任何方式对其进行缓存。您对这个插件的设置和/或使用不会影响这些文件的投放方式。缓存这些文件的是您的浏览器，这就是您进行硬重新加载的原因。

插件的作用是评估Wordpress（通过PHP）如何构建HTML文件并存储副本，以便下次有人请求相同的帖子，页面或其他内容时，它将提供副本，而不必重新评估PHP生成的HTML，从而节省一些计算时间，从而更快地加载页面。（我希望这很清楚。）

这样做的问题是，如果您通过PHP函数在CSS文件的URL上设置了时间戳记，那么这就是对HTML的PHP​​评估，并且将可湿性粉剂超高速缓存进行缓存。对同一帖子的每个请求都将具有相同的时间戳，因为向用户提供了原始时间戳评估的副本。（如果我错了纠正我。）

正确的方法来绕过可湿性粉剂超高速缓存的缓存是将选项设置Don't cache for known users，以true在插件的设置页。

最后（这是个人喜好，因为我在编码方面非常专横），诉诸隐身或强制硬重装将不需要您在HTML页面上添加不必要的标记。当然，添加一个时间戳只会为每个请求每个静态文件增加大约13个字节，但是，就像我说的那样，我很喜欢这种东西。仍然不需要13个字节。

— 理查德·尼尔·伊拉根（Richard Neil Ilagan）
source
感谢您的有用提示。不幸的是，由于我的解决方案需要清除域网络服务提供商cloudflare的缓存，因此这里的答案都不正确。
— cboettig '02
2

天哪，有很多方法可以回答这个问题！首先，您询问了两个不同的问题：WP Super Cache和CSS文件。这些文件在不同的地方以不同的方式缓存，因此识别出问题所在很重要。

如果是WP Super Cache，则可以DONOTCACHEPAGE在开发过程中在您的functions.php中定义常量，以防止WP Super Cache缓存任何内容。不过，不要忘记在启动时删除它！

define('DONOTCACHEPAGE', true);

每个网站都有一个唯一的关键字，可以附加到URL上以加载页面的新版本，我相信您可以在“高级”标签中找到该页面。

将其分解为更好的解决方案，您应该考虑设置开发环境和生产环境，在这些环境中，您的开发环境未启用WP Super Cache（同样，假设是您的问题）。

如果您的问题与CSS / JS文件有关，则请参见上面toscho的答案以及m0r7if3r的后续评论。

— 马修·博因斯（Matthew Boynes）
source
1

当您以管理员身份登录时，HyperCache会禁用缓存。不确定WP Super Cache是​​否具有相同的功能。

— 未来
source
有一个选项，是的。
— 马修·博伊恩斯
1

如果您使用的是Chrome（我强烈建议），请打开Inspector，单击右下角的设置图标，然后在“网络”下选择“禁用缓存”。

— 莫廷格
source
0

正如对wp超级缓存所说的，但对于一般的WP缓存，请wp-config.php 更改为：

define( 'WP_CACHE', false );

参考：codex.wordpress.org

— wpcoder
source
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.