我正在修改网站的外观(CSS修改),但由于烦人的持久缓存,无法在Chrome上看到结果。我尝试了Shift+刷新,但不起作用。
如何临时禁用缓存或以某种方式刷新页面以查看更改?
我正在修改网站的外观(CSS修改),但由于烦人的持久缓存,无法在Chrome上看到结果。我尝试了Shift+刷新,但不起作用。
如何临时禁用缓存或以某种方式刷新页面以查看更改?
当前回答
如果你不想编辑Chrome的设置,你可以使用匿名模式来获得同样的结果。
其他回答
使用Ctrl+Shift+R进行刷新很好,但并没有得到所需的一切。还有一些东西不会刷新,比如存储在js和css中的数据。找到了一个解决方案:谷歌为chromeweb开发人员提供的工具栏。安装工具栏后,选择选项并“重置页面”。
我已经使用了上面描述的其他选项,但我发现最好的方法是在chrome.exe的启动中添加以下参数。
“C:\Program Files(x86)\Google\Chrome\Application\Chrome.exe”--磁盘缓存大小=1-媒体缓存=1
我发现不禁用媒体缓存是一个好主意,但出于完整性的考虑。
实际上,我想要一个完全禁用缓存的选项,将内存用于IO而不是磁盘(这也会使加载时间快10倍!),但我认为chrome或任何浏览器都还没有这个选项。
F12打开Chrome DevToolsF1打开DevTools设置选中禁用缓存(当DevTools打开时),如下所示:
这当前位于默认的“首选项”选项卡上。您可能需要向下滚动。自提出此问题以来,此复选框已至少移动了几次。我最后一次检查时,它在底部的中间列中。如果在较薄的屏幕上打开它,并且“首选项”下有两列,则它可能位于右上角附近。如果有任何更改或评论,请随时更新此帖子,我将更新此帖子。
一般来说,“烦人”的缓存的问题在于框架:)。让我们来看看细节。大多数框架都在.htaccess(os equivalent)中使用去主动重定向所有请求到框架“索引”,
但它同时排除应用程序直接请求的文件和目录。
(例如,对于.htaccess,典型指令如下:
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-l
RewriteRule ^(.+)$ index.php?url=$1 [QSA,L]
)
因此,作为图形文件的所有.js、.css文件都不由框架“索引”处理。
这些文件通常在开发期间最常更改。
这就是为什么缓存控件取消激活不应该放在框架“索引”中的原因。
它应该放在.htaccess中。
F.e.用于开发过程:
Header set Cache-Control "no-store, no-cache, must-revalidate"
Header set Pragma "no-cache"
(或者对于连续的工作版本,请使用“Etag”指令-在HTTP参考中查看更多信息。注意,Etag不是用于开发的。
在.htaccess中,没有直接的方法生成用于ETag的随机数(或快速变化的序列,如日期UTC),因为-正如我之前提到的-这不是提供的)。
希望这有助于节省时间。
如何临时禁用缓存或以某种方式刷新页面以查看更改?
目前还不清楚你指的是哪种“缓存”。有几种不同的方法可以让浏览器持久地缓存内容。Web存储是其中之一,缓存控制是另一个。
一些浏览器还具有缓存,与服务工作者一起使用,以创建提供离线支持的渐进式Web应用程序(PWA)。
清除PWA的缓存
self.caches.keys().then(keys => { keys.forEach(key => console.log(key)) })
要列出缓存键的名称,请运行:
self.caches.delete('my-site-cache')
按名称删除缓存密钥(即我的站点缓存)。然后刷新页面。
如果刷新后在控制台中看到任何与工作程序相关的错误,则可能还需要注销已注册的工作程序:
navigator.serviceWorker.getRegistrations()
.then(registrations => {
registrations.forEach(registration => {
registration.unregister()
})
})