标签: 浏览器缓存

  • 站长必备技能:浏览器缓存数据怎么清理?

    浏览器缓存怎么清理

    如果您偶然发现WordPress中的错误,您可能会被要求清除浏览器缓存以修复它。这通常是一项简单的任务,但由于该过程因平台而异,您的故障排除指南可能不会提供完成它所需的具体步骤。

    在这篇文章中,我们将解释您的浏览器缓存是什么以及您可能需要清除它的原因。然后,我们将提供在三种最流行的 Internet 浏览器中执行此过程的综合步骤:Google ChromeSafariMozilla Firefox

    浏览器缓存简介

    我们在过去的几篇文章中讨论了浏览器缓存的基础知识。该过程涉及浏览器存储网页副本,以便他们可以在后续访问时轻松更快地加载内容。

    我们通常谈论浏览器缓存,以使其能够加速您自己的网站。但是,其他站点也使用这种技术,因此您自己的浏览器也存储了各种网页的副本。

    您可以手动配置浏览器缓存,但对于WordPress用户来说,使用插件来实现它更为常见。无论如何,在几种情况下您需要清除缓存并重新加载网页的新副本。

    为什么需要清除浏览器缓存

    正如我们已经说过的,浏览器缓存对于加快页面加载时间很有用。这对您作为网站所有者以及想要快速访问 Internet 上的关键信息的用户都有帮助。

    但是,您还希望信息是最新的和准确的。如果您的浏览器加载的是页面的旧副本而不是最新版本,则您可能正在查看不再相关的内容。

    这通常不是问题,因为浏览器的构建是为了检测更改并在更新时重新加载之前存储的页面。但是,如果您的浏览器没有注意到您尝试访问的内容已被修改,就会出现问题。

    可能出现这种情况的一些具体情况包括:

    • 对WordPress网站上似乎没有更新的内容进行更改时。
    • 更新新代码未正确执行的插件或主题。
    • 安装了一个图像优化插件,但仍然看到前端加载了旧的、未压缩的文件。

    清除浏览器缓存还有助于解决一些常见错误,包括:

    简而言之,如果您在使用WordPress网站时遇到任何问题,在做其他任何事情之前尝试清除浏览器缓存永远不会有什么坏处。它不会导致任何进一步的问题,并且通常是您可以自行处理的非常快速的解决方案。

    如何清除不同浏览器的缓存

    每当您访问某个网站时,您的 Web 浏览器都会将来自该网站的某些信息保存在您计算机硬盘上的“浏览器缓存”中。大多数情况下,这是一件好事,因为它无需在浏览网页时一遍又一遍地下载相同的静态资源,从而有助于加快您的 Web 浏览体验。

    例如,网站的标志不太可能改变——因此将这个标志本地存储在浏览器缓存中而不是每次访问新页面时让浏览器下载标志是有意义的。但有时这种缓存实际上会导致您的浏览体验出现问题。那时您需要清除浏览器缓存。

    在本条目中,我们将首先向您简要介绍您可能需要清除浏览器缓存的时间。然后,我们将向您展示如何清除大多数主要浏览器的浏览器缓存。如果你想快速跳到“如何”,你可以点击下面的链接之一,否则,我们将从头开始。

    如何强制刷新单个页面

    在您直接清除整个浏览器缓存之前,您可以尝试一种称为“强制刷新”的技巧。通常,当您刷新页面时,您的浏览器仍会提供页面的缓存版本,而不是再次下载所有资产。但是您实际上可以通过使用一些简单的热键绕过缓存并强制完全刷新:

    • Windows和Linux浏览器:CTRL + F5
    • Apple Safari:SHIFT +Reload工具栏按钮
    • Mac版Chrome和Firefox:CMD + SHIFT + R

    同样,此方法仅绕过您所在特定页面的缓存。它使浏览器缓存的其余部分保持不变。因此,如果您只遇到一个页面的问题,则此选项非常有用。但是,如果您想完全重置您的体验(例如,跨整个站点),最好只清除整个浏览器缓存。

    如何清除Chrome浏览器缓存

    谷歌浏览器是迄今为止最受欢迎的网络浏览器。统计数据显示,它占全球互联网使用量的一半以上。幸运的是,它的设置非常易于导航,可以快速简单地清除缓存。

    Step 1:打开Chrome浏览器设置

    首先,单击浏览器窗口右上角的三点图标:

    Chrome设置

    然后,选择设置

    Chrome设置入口

    这将在新选项卡中打开您的浏览器设置。

    Step 2:进入隐私设置和安全性

    进入浏览器设置后,点击隐私设置和安全性,或向下滚动直到到达以下部分:

    Chrome隐私设置和安全性

    接下来,选择清除浏览数据

    清理Chrome缓存

    这将打开一个小的弹出窗口。

    Step 3:清除缓存的图片和文件

    清除浏览数据窗口中,您可以选择要从Chrome中删除的多种数据类型。您可以指定任意数量并一次性删除它们,但为了清除浏览器缓存,请确保选择缓存的图片和文件

    清除Chrome缓存文件

    最后,点击清除数据。

    如何清除Firefox浏览器缓存

    Firefox占浏览器市场份额不到 5%。但是,一些较旧的应用程序可能在这个更成熟的平台上运行得更好。它还为开发人员提供了一些方便的工具。这是清除其缓存的方法。

    Step 1:进入Firefox设置

    要在Firefox中打开浏览器设置,请单击右上角的汉堡图标,然后选择设置

    Firefox设置

     

    这将打开常规设置页面。

    Step 2:查看您的隐私和安全设置

    与Chrome一样,您需要从左侧菜单导航到浏览器设置的隐私与安全部分,以访问缓存选项:

    Firefox隐私与安全设置

    请注意,您无法像在Chrome中那样通过滚动来访问这些选项。

    Step 3:清除您的数据

    接下来,向下滚动,直到找到Cookie和站点数据部分:

    清除Firefox缓存数据

    单击 清除数据…按钮:

    清除Firefox数据

    Firefox仅提供两种类型的站点数据,您可以在此处删除。确保选中已缓存网络数据,然后单击清除按钮:

    清除Firefox缓存数据

    然后Firefox会要求您再确认您的选择,此时您需要点击立即清除

    如何清除Safari浏览器缓存

    Safari排在Chrome之后,成为下一个最受欢迎的浏览器,部分原因可能是它是Apple产品的默认平台。由于它在智能手机上如此受欢迎,我们也包含了在Safari移动版中清除浏览器缓存的相应步骤。

    Step 1:访问Safari设置

    首先,您需要访问您的设置。在台式机或笔记本电脑上,只需打开浏览器并在计算机工具栏中选择Safari 

    访问Safari设置

    在您的移动设备上,打开“设置”应用:

    iOS设置

    接下来,向下滚动直到看到Safari

    Safari手机端设置

    点击它以打开其设置。

    Step 2:清除所有历史记录和网站数据

    与Chrome不同的是,Safari不提供选择和选择要删除的浏览器数据的选项。因此,每当您清除浏览器缓存时,您也将删除您的历史记录、cookie和其他数据。

    对于您的桌面浏览器,选择清除历史记录…

    清除Safari历史

    从结果下拉列表中选择所有历史记录,然后单击清除历史记录按钮:

    清除Safari所有历史

    在您的移动设备上,向下滚动到清除历史记录和网站数据选项并点击它:

    清除Safari手机端应用历史

    弹出窗口将要求您确认是否要继续:

    Safari应用历史清除确认

    点击清除历史记录和数据以完成清除缓存。

    如何清除Internet Explorer浏览器缓存

    要清除Internet Explorer的浏览器缓存,请单击右上角的齿轮图标以访问“工具”菜单。然后,找到安全并从子菜单中选择删除浏览器历史

    Internet Explorer删除浏览历史记录

    Internet Explorer删除浏览历史记录

    您还可以使用快捷方式访问菜单:CTRL + SHIFT + DEL。 Internet Explorer将打开一个弹出窗口。确保只选中Internet临时文件和网站文件框以避免清除重要信息。然后,单击底部的删除按钮:

    清除Internet Explorer浏览器缓存

    清除Internet Explorer浏览器缓存

    如何清除Microsoft Edge浏览器缓存

    若要清除Microsoft Edge的浏览器缓存,请单击 浏览器窗口右上角的更多图标(三个小点)。

    Microsoft Edge设置

    Microsoft Edge设置

    向下滚动并单击选择要清除的内容

    选择要在Microsoft Edge中清除的内容

    选择要在Microsoft Edge中清除的内容

    确保选择缓存数据和文件框以避免清除重要信息。您还可以使用快捷方式访问菜单:  CTRL + SHIFT + DEL。 然后,单击底部的清除按钮。

    清除Microsoft Edge浏览器缓存

    清除Microsoft Edge浏览器缓存

    如何清除Opera浏览器缓存

    要清除Opera的浏览器缓存,请单击左上角的Opera图标,找到更多工具选项,然后从子菜单中选择清除浏览数据

    Opera清除浏览数据

    Opera清除浏览数据

    在大多数情况下,您应该将时间周期设置为:过去4周。然后,确保只选中缓存的图像和文件框,然后单击清除浏览数据按钮:

    清除Opera中的浏览器缓存

    清除Opera中的浏览器缓存

    小结

    知道如何清除浏览器缓存意味着您可以快速修复在使用 WordPress 或只是浏览网页时可能遇到的许多错误。幸运的是,无论您喜欢哪种浏览器,这个过程都非常简单。

    在这篇博文中,我们提供了在Google ChromeSafariMozilla Firefox等浏览器清除缓存的完整演练。对于每个浏览器,您都需要访问您的设置,找到清除浏览数据的选项,并确保包含您的缓存。

  • 如何在WordPress中添加缓存文件过期标头

    如何在WordPress中添加缓存文件过期标头

    您是否刚刚通过速度测试工具运行您的WordPress网站,却被告知您需要“Add Expires headers”到您的WordPress网站?

    缓存过期标头是让Web浏览器知道是从访问者的浏览器缓存还是从您的服务器加载网页资源(如图像)的规则。这些可以帮助提高您网站的性能。除此之外,它们也是YSlow性能建议的一部分,这意味着它们会影响您在GTmetrix等工具中的性能“分数” 。

    在这篇文章中,我们将解释什么是过期标头以及它们如何影响您的网站。然后,我们将向您展示如何使用几种不同的方法在WordPress中添加过期标头。

    但首先,我们需要快速绕道讨论另一个主题——浏览器缓存。

    1. 什么是浏览器缓存?
    2. 什么是过期标头?
    3. 如何修复WordPress中的“添加过期标头”
    4. 如何测试Expires标头是否正常工作
    5. 如何为外部脚本添加过期标头

    什么是浏览器缓存?

    在讨论过期标头之前,我们首先需要向您介绍浏览器缓存的概念。这很重要,因为过期标头可以帮助您控制和实现浏览器缓存——因此,如果您不了解浏览器缓存,就无法理解过期标头。

    简而言之,浏览器缓存让您的网站告诉访问者的浏览器将某些文件保存在访问者的本地计算机上并加载这些本地文件以供后续访问,而不是在每次页面加载时从您的服务器下载它们。

    通过消除每次下载文件的需要,您可以加快站点的加载时间并减少带宽使用。

    让我们看一个示例——您网站的徽标图像。您的徽标在每个页面上都是相同的,因此强制访问者的浏览器在每次页面加载时重新下载相同的徽标文件是没有意义的。通过浏览器缓存,您可以将该徽标文件存储在访问者的本地计算机上。访问者在第一次访问时仍需要下载您的徽标图像。但是对于后续的页面查看,该文件将从其本地浏览器缓存中加载。

    什么是过期标头?

    过期标头让您告诉访问者的Web浏览器它是否应该从本地浏览器缓存中加载给定资源(如上所述),或者它是否需要从Web服务器下载新版本。

    更具体地说,它允许您在文件“过期”之前为不同文件类型的缓存版本设置持续时间,并且浏览器必须再次从服务器下载它。

    让我们看一个例子……

    假设您想控制网站上PNG图像文件的浏览器缓存行为。如果您将PNG文件的过期标头设置为一个月,这意味着访问者的浏览器将:

    • 在初始访问/下载后一个月从缓存中加载已经下载的版本。
    • 一个月后从服务器重新下载该文件。

    您可以为不同的文件类型设置不同的过期标头,这使您可以精细控制站点的浏览器缓存。

    过期标头与缓存控制

    虽然使用过期标头是控制WordPress上的浏览​​器缓存的一种方法,但它不是唯一的方法。还有另一种称为缓存控制的技术。

    缓存控制是一种更现代的技术,为控制缓存行为提供了更多的灵活性。出于这个原因,今天许多网站都使用缓存控制。

    但是,过期标头仍然提供大多数站点所需的一切,因此它们是用于浏览器缓存的好选择。您也可以同时使用两者,尽管在大多数情况下您的缓存控制标头将优先。如果同时使用两者,您需要确保在每个中设置相同的时间值。

    如果您想了解有关如何在WordPress上实现缓存控制的更多信息,请查看我们的指南,了解如何在WordPress中利用浏览器缓存

    如何修复WordPress中的“添加过期标头”

    现在,让我们进入实际的操作方法部分,我们将向您展示如何在 WordPress 中设置过期标头。

    您可以为您的WordPress网站添加过期标头。您可以在服务器级别(Nginx或Apache)使用您自己的代码片段或通过一些用户友好的WordPress插件来执行此操作。

    当有人第一次访问您的WordPress网站上的网页时,所有文件都会一个一个地加载。浏览器和WordPress托管服务器之间的所有这些请求都会增加网页加载时间。

    浏览器缓存将部分或全部文件存储在访问者的计算机上。这意味着他们下次访问该页面时,可以从他们自己的计算机加载文件,从而提高您的WordPress性能。

    现在您可能想知道,浏览器如何知道要保存哪些文件以及将它们保留多长时间?

    这就是过期标标头的用武之地。

    使用expires headerscache-control headers设置关于保存哪些文件以及保存它们多长时间的规则。在本文中,我们将重点介绍缓存过期标头,因为它们对于大多数用户来说设置起来更简单。

    缓存过期标头为浏览器缓存中存储的每种类型的文件设置过期日期。在该日期之后,文件将从您的服务器重新加载,以便为访问者提供最新版本的页面。

    如何在Apache Web服务器上使用.htaccess添加过期标头

    如果您的Web主机使用Apache Web服务器,您可以使用.htaccess文件添加过期标头,该文件位于您的服务器的根文件夹(与保存wp-config.php文件相同的文件夹)。

    这是您需要做的:

    1. 在您首选的FTP客户端中使用FTP连接到您的服务器
    2. 在根文件夹中找到.htaccess文件
    3. 将 .htaccess 文件的备份副本下载到本地计算机。这样,如果出现任何问题,您可以重新上传备份副本以解决任何潜在问题。
    4. 在文件顶部附近添加下面的代码片段
    ## EXPIRES HEADER CACHING ##
    <IfModule mod_expires.c>
    ExpiresActive On
    ExpiresByType image/jpg “access 1 year”
    ExpiresByType image/jpeg “access 1 year”
    ExpiresByType image/gif “access 1 year”
    ExpiresByType image/png “access 1 year”
    ExpiresByType image/svg “access 1 year”
    ExpiresByType text/css “access 1 month”
    ExpiresByType application/pdf “access 1 month”
    ExpiresByType application/javascript “access 1 month”
    ExpiresByType application/x-javascript “access 1 month”
    ExpiresByType application/x-shockwave-flash “access 1 month”
    ExpiresByType image/x-icon “access 1 year”
    ExpiresDefault “access 2 days”
    </IfModule>
    ## EXPIRES HEADER CACHING ##
    ## EXPIRES HEADER CACHING ##
    <IfModule mod_expires.c>
    ExpiresActive On
    ExpiresByType image/jpg “access 1 year”
    ExpiresByType image/jpeg “access 1 year”
    ExpiresByType image/gif “access 1 year”
    ExpiresByType image/png “access 1 year”
    ExpiresByType image/svg “access 1 year”
    ExpiresByType text/css “access 1 month”
    ExpiresByType application/pdf “access 1 month”
    ExpiresByType application/javascript “access 1 month”
    ExpiresByType application/x-javascript “access 1 month”
    ExpiresByType application/x-shockwave-flash “access 1 month”
    ExpiresByType image/x-icon “access 1 year”
    ExpiresDefault “access 2 days”
    </IfModule>
    ## EXPIRES HEADER CACHING ##
    ## EXPIRES HEADER CACHING ##
    <IfModule mod_expires.c>
    ExpiresActive On
    ExpiresByType image/jpg "access 1 year"
    ExpiresByType image/jpeg "access 1 year"
    ExpiresByType image/gif "access 1 year"
    ExpiresByType image/png "access 1 year"
    ExpiresByType image/svg "access 1 year"
    ExpiresByType text/css "access 1 month"
    ExpiresByType application/pdf "access 1 month"
    ExpiresByType application/javascript "access 1 month"
    ExpiresByType application/x-javascript "access 1 month"
    ExpiresByType application/x-shockwave-flash "access 1 month"
    ExpiresByType image/x-icon "access 1 year"
    ExpiresDefault "access 2 days"
    </IfModule>
    ## EXPIRES HEADER CACHING ##

    虽然默认值应该适用于大多数网站,但您可以根据需要调整代码片段中不同文件类型的时间段。

    如何在Nginx Web服务器上使用配置文件添加过期标头

    如果您的主机使用Nginx Web服务器,您可以通过编辑服务器的配置文件来控制过期标头。您如何编辑此文件将取决于您的房东——如果您需要帮助,可以联系服务器提供商的支持。

    这是您需要使用的代码:

    location ~* .(jpg|jpeg|gif|png|svg)$ {
    expires 365d;
    }
    location ~* .(pdf|css|html|js|swf)$ {
    expires 2d;
    }
    location ~* .(jpg|jpeg|gif|png|svg)$ {
    expires 365d;
    }
    location ~* .(pdf|css|html|js|swf)$ {
    expires 2d;
    }
    location ~*  .(jpg|jpeg|gif|png|svg)$ {
    expires 365d;
    }
    location ~*  .(pdf|css|html|js|swf)$ {
    expires 2d;
    }

    您可以根据需要调整不同类型文件的过期时间。

    确定您的网站运行的是Apache还是Nginx

    首先,您需要弄清楚您的网站是使用Apache还是Nginx服务器。为此,请浏览到您的网站并右键单击该页面,然后选择“Inspect(检查)”选项。

    如何在WordPress中添加缓存文件过期标头-3

    接下来,您需要单击页面顶部的“Network(网络)”选项卡。您可能需要刷新页面才能加载结果。

    如何在WordPress中添加缓存文件过期标头-4

    之后,您可以单击“Name(名称)”列顶部的域名。然后您应该向下滚动到“Response Headers(响应标头)”部分并检查名为“server(服务器)”的项目。

    如何在WordPress中添加缓存文件过期标头-5

    这将显示您正在使用哪个Web服务器。在这种情况下,该站点在Nginx服务器上运行。

    如何使用WordPress插件添加过期标头

    如果您对自己添加过期标头代码感到不自在,您还可以找到一些可以为您完成这项工作的WordPress插件。其中一些插件添加过期标头,而其他插件使用缓存控制。无论哪种方式,最终结果都是您的WordPress网站可以从浏览器缓存中受益。

    如果您的主机尚未为您实现缓存,一种解决方案是使用缓存插件。一个很好的选择是WP Rocket。激活WP Rocket插件后,它会自动为您启用浏览器缓存 – 无需配置任何其他设置。

    以下是一些其他缓存插件,可以帮助您实现过期标头和/或浏览器缓存:

    WP Rocket是市场上对初学者最友好的WordPress缓存插件。启用后,它会立即工作以加快您的网站速度,而无需像许多其他缓存插件一样处理复杂的配置设置。

    WP Rocket是一个高级插件,但其免费版本已经包含所有功能最好的部分。

    如何在WordPress中添加缓存文件过期标头-2

    您需要做的第一件事是安装并激活WP Rocket插件(官网)。

    安装并激活后,WP Rocket将自动打开浏览器缓存。默认情况下,它会使用最佳设置添加过期标头和缓存控制标头,以加速您的WordPress网站。

    这就是你需要做的。如果您想了解有关该插件的更多信息,请参阅有关如何在WordPress中正确安装和设置WP Rocket的教程

    如果您更喜欢使用免费的缓存插件将过期标头添加到您的网站,那么我们建议您查看W3 Total Cache

    W3 Total Cache提供了一些与WP Rocket相同的功能,但它并不适合初学者。您必须手动启用 expires 标头,因为它不会自动启用它们。

    如果您已经对缓存进行了排序并且只想要一个更有针对性的插件,那么两个不错的免费插件是:

    Leverage Browser Caching插件没有设置 – 您只需激活它,它就会立即开始工作。

    Add Expires Headers插件可让您控制不同文件类型的过期标头 – 您可以从WordPress仪表盘中新的Add Expires Headers区域进行这些选择:

    您可以为不同的文件类型配置不同的过期规则

    您可以为不同的文件类型配置不同的过期规则

    如何测试过期标头是否正常工作

    要测试您的过期标头是否配置正确,您可以使用GiftOfSpeed中的这个免费工具。输入网站的URL后,该工具会告诉您两件事:

    1. 您网站上所有文件的缓存持续时间。
    2. 缓存类型(应该说过期标头,因为这是您使用的方法,但您也可能会看到缓存控制,具体取决于您的站点配置)。

    您还可以通过您正在使用的任何速度测试工具(例如GTmetrix)运行您的站点,并检查您是否仍然看到“添加过期标头”消息。

    如何使用终端测试过期标头

    如果您更喜欢使用更多技术选项测试过期标头,您可以curl在终端中向您网站上的静态资产发出请求,并直接检查HTTP标头。例如,如果您的过期或缓存控制规则涵盖CSS文件,您可以发出curl如下请求。

    curl -I https://kinstalife.com/wp-includes/css/dist/block-library/style.min.css
    curl -I https://kinstalife.com/wp-includes/css/dist/block-library/style.min.css
    curl -I https://kinstalife.com/wp-includes/css/dist/block-library/style.min.css

    在我们的例子中,curl对style.min.css文件的请求提供了以下响应。

    HTTP/2 200
    server: nginx
    date: Wed, 27 Jan 2021 01:11:05 GMT
    content-type: text/css; charset=UTF-8
    content-length: 51433
    last-modified: Tue, 12 Jan 2021 20:17:48 GMT
    vary: Accept-Encoding
    etag: “5ffe03ec-c8e9”
    expires: Thu, 31 Dec 2037 23:55:55 GMT
    cache-control: max-age=315360000
    access-control-allow-origin: *
    accept-ranges: bytes
    x-edge-location-klb: HaIXowU1oNczJ391oDE9zVvZ7279840b5d30a89472f57253756b3e63
    HTTP/2 200
    server: nginx
    date: Wed, 27 Jan 2021 01:11:05 GMT
    content-type: text/css; charset=UTF-8
    content-length: 51433
    last-modified: Tue, 12 Jan 2021 20:17:48 GMT
    vary: Accept-Encoding
    etag: “5ffe03ec-c8e9”
    expires: Thu, 31 Dec 2037 23:55:55 GMT
    cache-control: max-age=315360000
    access-control-allow-origin: *
    accept-ranges: bytes
    x-edge-location-klb: HaIXowU1oNczJ391oDE9zVvZ7279840b5d30a89472f57253756b3e63
    HTTP/2 200
    server: nginx
    date: Wed, 27 Jan 2021 01:11:05 GMT
    content-type: text/css; charset=UTF-8
    content-length: 51433
    last-modified: Tue, 12 Jan 2021 20:17:48 GMT
    vary: Accept-Encoding
    etag: "5ffe03ec-c8e9"
    expires: Thu, 31 Dec 2037 23:55:55 GMT
    cache-control: max-age=315360000
    access-control-allow-origin: *
    accept-ranges: bytes
    x-edge-location-klb: HaIXowU1oNczJ391oDE9zVvZ7279840b5d30a89472f57253756b3e63

    如您所见,响应包括一个expirescache-control标头。具体来说,cache-control标头显示的max-age为315360000秒,表示有效期为一年。

    如何为外部脚本添加过期标头

    我们在上面向您展示的方法将让您控制WordPress站点服务器上所有文件的过期标头。但是,这些方法不允许您控制您可能正在加载的第三方脚本的过期标头,例如Google FontsGoogle Analytics等。

    因此,即使您已经通过上述方法实现了过期标头,某些速度测试工具仍可能将此标记为潜在问题。

    以下是一些常见第三方脚本的解决方案……

    如何将过期标头添加到Google字体

    许多WordPress网站依赖谷歌字体来定制字体。这通常涉及从Google的CDN加载字体,这意味着您将无法通过服务器的配置设置过期标头。

    一种简单的解决方法是在本地托管字体文件,而不是依赖Google的CDN。要进行此设置,您可以使用WordPress.org上的Optimize My Google Fonts (OMGF) 免费插件。

    您还可以查看我们在WordPress中本地托管字体的完整指南,以了解有关此方法的优缺点的更多信息。

    如何向Google Analytics添加过期标头

    如果您遇到与浏览器缓存和Google Analytics相关的问题,您还可以考虑在本地托管Google Analytics脚本,就像我们向您展示的Google字体一样。

    这里有一些 WordPress 插件可以很容易地实现这一点:

    小结

    回顾一下,过期标头可帮助您控制WordPress站点上不同文件类型的浏览器缓存行为。

    如今,许多站点依赖缓存控制标头而不是过期标头,因为缓存控制是一种更现代的选项,可提供更大的灵活性。但是,对于大多数站点,过期标头仍然可以正常工作,您也可以同时使用过期标头和缓存控制。

    此外,如果您不实施过期标头,一些速度测试工具会降低您网站的分数,这可能是您设置此策略的主要动机。

    我们希望本教程能帮助您了解如何在WordPress中添加过期标头。您可能对下列文章也会感兴趣:

     

  • 如何清除WordPress网站缓存

    如何清除WordPress网站缓存

    拥有一个快速加载的网站对于用户体验和SEO(搜索引擎优化)至关重要。具有优化速度的网站往往具有较低的跳出率,从而导致更高的参与度和转化率。谷歌也偏爱快速网站,并在搜索结果页面上排名更高

    从编码标准到托管服务提供商,许多组件都会影响网站速度。因此,有很多方法可以提高网站性能,而Web缓存是最有效的方法之一。

    Web 缓存存储站点数据的副本以供将来请求。Web缓存不是从服务器下载原始数据,而是将这些缓存文件提取给您的网站访问者。因此,您的内容显示得更快。

    但是,缓存文件可能会过期——这将阻止访问者看到您网站的更新版本。

    为了解决这个问题,我们将向您展示如何使用流行的WordPress插件清除缓存。我们还将包括删除浏览器缓存以获得更有效结果的步骤。让我们先解释一下什么是缓存以及它是如何工作的。

    解释WordPress缓存是什么以及它是如何工作的

    缓存是静态内容的临时存储位置,例如HTML、Javascript、CSS和媒体文件。

    每当您访问网站时,您的浏览器都会向该网站的服务器发送请求。服务器可能需要一两分钟来获取和显示请求的内容——网络缓存使这个过程更快。

    Web 缓存下载站点的静态内容并将其存储为缓存文件。因此,您的浏览器可以向服务器创建更少的请求,因为它已经有缓存的内容。

    Web缓存有两个主要系统:

    • 客户端缓存——也称为浏览器缓存,这种类型的缓存将静态内容存储在本地存储中。当用户重新访问网站时,它会加载得更快,因为缓存的版本已经存储在浏览器缓存文件夹中。
    • 服务器端缓存——具有与客户端缓存类似的概念。但是,它使用服务器来存储网站的缓存数据。服务器缓存可以存储来自多个数据库的各种站点数据,使其成为高流量网站的绝佳解决方案。

    总而言之,Web缓存通过存储网站的静态版本来减少对服务器的请求,从而提高网站性能。

    它还减少了您的网络资源,因为处理更少的请求需要更少的带宽,这可以使资源有限的网站受益。

    清除WordPress中的缓存

    有时您更改和调整您的WordPress网站,但您的内容没有在前端更新。这可能是因为您的WordPress服务器仍在显示页面的缓存版本。

    幸运的是,清除WordPress缓存通常可以解决此问题。当您的网站缓存为空时,缓存系统可以存储更新的数据并将其显示给您的访问者。

    清除WordPress网站缓存的最简单方法是安装插件。以下部分将说明如何使用四个流行的WordPress缓存插件清除缓存,并展示如何在您的域指向Cloudflare时清除缓存。

    使用LiteSpeed清除缓存

    使用LiteSpeed清除缓存

    使用LiteSpeed Cache for WordPress (LCWP) 插件来有效管理缓存的存储和使用方式。这个缓存插件使用LiteSpeed服务器缓存来改善站点加载时间,并带有LiteSpeed独有的功能。

    LiteSpeed Cache插件提供了多种清除WordPress缓存的方法。从根据特定条件设置自动缓存清除到为计划清除包括特定网站URL。请按照以下说明进行操作:

    1. 安装并激活插件后,访问您的WordPress管理仪表盘。然后,转到LiteSpeed CacheLiteSpeed Cache控制面板
    1. 选择工具箱菜单,将出现LiteSpeed缓存工具箱窗口。 LiteSpeed缓存工具箱
    1. 您可以清除各种类型的缓存,从页面缓存到CSS/JS缓存。选择您要执行的缓存清除类型。 LiteSpeed清除缓存选项
    1. 如果您想完全清除WordPress缓存,请选择Purge All。请注意,它不会删除您WordPress网站上的关键数据——您可以继续清除缓存。
    2. 但是,如果您只想清空站点某些部分的缓存,请向下滚动到“Pure By”部分。从那里,使用类别、标签或URL输入您的内容。 按类别清除LiteSpeed缓存

    除了访问您的WordPress仪表盘之外,您还可以通过访问它来清除特定页面的缓存——请记住,您需要以管理员身份登录。只需将鼠标悬停在管理栏上的LiteSpeed图标上,然后选择Purge this page

    快速清除LiteSpeed缓存

    使用WP Super Cache清除缓存

    使用WP Super Cache清除缓存

    WP Super Cache使用三种缓存模式修改WordPress站点中的缓存系统:WP cachingSimpleExpert。

    Expert和Simple方法服务于超级缓存文件,因此它们是高流量网站的绝佳解决方案。唯一的区别是专家方法涉及重写.htaccess文件中的规则以获得更快的性能。同时,WP缓存方法缓存登录用户,例如在您的网站上发表评论或存储个人信息的访问者。

    这个WordPress缓存插件还可以通过单击刷新缓存文件。只需按照以下步骤操作即可:

    1. 从您的WordPress管理后台,转到设置-> WP Super Cache。 WP Super Cache设置
    1. 在WP Super Cache Settings页面中,向下滚动到Delete Cached Pages部分。然后,单击Delete Cache按钮。

    此外,WP Super Cache插件提供了广泛的缓存功能,其中最突出的功能是垃圾收集。用户可以设置缓存超时时间,系统会相应地清除缓存文件。为此,请按照以下说明操作:

    1. 转到设置 -> WP Super Cache -> Advanced。然后,向下滚动到Expiry Time & Garbage Collection过期时间和垃圾收集
    1. 根据需要设置缓存超时和间隔。

    如果您不经常更新您的WordPress网站,将其设置为3600秒将是理想的选择。但是,拥有大量动态内容的繁忙网站(例如电子商务网站)的所有者应将其设置为600秒,以防止性能下降。

    1. 接下来,单击Change Expiration以保存更改。 更改缓存过期时间
    1. 如果要禁用垃圾收集,只需将缓存超时设置为0秒

    使用W3 Total Cache清除缓存

    使用W3 Total Cache清除缓存

    W3 Total Cache是最受欢迎的缓存插件之一,以其定制和节省带宽的功能而闻名。该插件通过缩小、提要优化和HTTP压缩节省高达80%的带宽使用量。它提供多种缓存功能,包括浏览器、数据库和站点缓存。

    此缓存插件还附带有助于提高SEO性能的AMP支持。此外,用户可以使用其WP-CLI支持命令界面来执行各种任务,例如缓存清除和查询字符串更新。

    以下是使用W3 Total Cache清除WordPress缓存的方法:

    1. 安装此缓存插件后,访问您的WordPress管理后台并转到Performance -> Dashboard。 W3 Total Cache仪表盘
    1. 单击位于页面顶部的empty all caches 一键清除W3 Total Cache缓存
    2. 系统将开始清除您的WordPress缓存。结束后,您应该会看到此消息。 W3 Total Cache缓存清除成功提示
    1. 除了empty all caches按钮外,还有其他用于删除多种缓存类型的按钮,包括仅从数据库中清除Memcached缓存。只需单击按钮即可开始相应的操作。 从数据库中清除Memcached缓存

    使用WP Fastest Cache清除缓存

    如何清除WordPress网站缓存-1

    WP Fastest Cache是另一个流行的缓存插件,以其各种优化和缓存功能而闻名,例如缩小、缓存预加载和GZIP压缩。它带有一个直观的仪表板并使用mod_rewrite来提供最快的缓存解决方案。

    用户可以开启缓存超时,省去手动清缓存的麻烦。每当发布新页面或帖子时,该插件还可以自动删除所有缓存文件——这可以防止过时的数据显示在您的WordPress网站上。

    按照以下步骤使用WP Fastest Cache执行自动缓存清除:

    1. 从您的WordPress管理后台,导航到WP Fastest Cache。它将打开WP Fastest Cache Options页面。 WP Fastest Cache选项
    1. 勾选Cache System设置旁边的框。启用缓存后,该插件将定期清除您的缓存。 WP Fastest Cache缓存系统
    1. 如果您想在发布文章或页面时清除缓存文件,只需检查“New Post”“Update Post”设置。 WP Fastest Cache缓存清理规则设置
    1. 要启用更多功能,请继续并勾选每个设置的框。请务必单击提交按钮以保存更改。

    此外,还有一个手动删除WordPress缓存的选项:

    1. 转到WP Fastest Cache并选择Delete Cache选项卡。
    2. 从那里,按Delete Cache按钮。 手动清除WordPress网站缓存
    3. 同时,如果您刚刚编辑了CSS或JavaScript文件,请选择Delete Cache and Minified CSS/JS按钮。
    4. 在页面底部,您将找到Timeout Rules设置。只需单击Add New Rule即可设置到期时间。 缓存到期时间规则设置
    1. 将出现一个弹出窗口。在那里,您可以配置要缓存的页面或帖子的条件以及删除它们的频率。单击保存以添加规则。

    使用Cloudflare清除缓存

    使用Cloudflare清除缓存

    除了使用WordPress缓存插件外,您还可以使用Cloudflare清除缓存。这是一项内容交付网络 (CDN)服务,具有多种功能来提高您的网站性能,包括缓存控制、快速缓存清除和Web缓存保护。

    要使用此方法清除WordPress缓存,请将您的域指向Cloudflare

    如果您的WordPress主机没有自动为您设置Cloudflare,请按照以下步骤操作:

    1. 创建一个Cloudflare帐户
    2. 添加您的域名并等待系统识别您的DNS记录。
    3. 选择计划级别。
    4. 当Cloudflare提供所需的名称服务器时,只需复制值并从您的托管帐户仪表板更新您的名称服务器。

    将您的域指向Cloudflare后,请按照以下步骤清除WordPress缓存:

    1. 登录您的Cloudflare仪表盘并单击您的WordPress站点的域。 Cloudflare仪表盘
    1. 导航到Caching菜单并单击ConfigurationCloudflare缓存设置页面
    1. 选择您喜欢的清除缓存的方法。要清除所有缓存文件,请单击“Purge Everything”按钮。如果要选择特定页面,请选择Custom Purge并填写要清除的页面。 Cloudflare缓存清除两种方式

    清除浏览器中的缓存

    清除您自己的浏览器缓存也有助于解决加载和格式问题。它将删除过时的文件,允许您的浏览器获取您网站的新版本。这样做还可以修复与服务器相关的问题,包括502 bad gateway504 gateway timeout

    请记住,删除浏览器缓存也可能会删除您的浏览器数据,例如书签和设置首选项。因此,请务必从浏览器中导出数据,并在清除缓存后将其重新导入

    以下步骤将向您展示如何清除Google Chrome中的缓存。请注意,相同的步骤也适用于其他浏览器。

    1. 打开您的Chrome应用程序。
    2. 单击屏幕右上角的三点(⋮)菜单。
    3. 选择更多工具 -> 清除浏览数据
    4. 它将带您到一个页面,您可以在其中执行基本或高级缓存清除。 清除浏览器缓存
    1. 选择您喜欢的方法,设置时间范围,并根据需要选中相应的框。取消选中密码和其他登录数据选项以保留您的登录凭据。
    2. 最后,单击清除数据按钮

    小结

    缓存是让您的网站加载更快的好方法——它存储您网站静态内容的副本以供将来重用。但是,过时的缓存文件可能会阻止访问者在您的网站上看到新的更改。

    幸运的是,清除您的网站缓存可以解决这个问题。本教程向您展示了如何使用WordPress流行的缓存插件清除WordPress缓存。如果删除WordPress服务器缓存不能解决问题,请尝试删除浏览器缓存

    请注意,一旦缓存的文件被删除,浏览器和服务器将需要一些时间来再次下载它们——这可能会导致加载时间比以前稍长。