如何在 Wordpress 中创建动态页面而不遇到缓存问题？

Question

我正在运行一个带有 Wordpress 博客的 RoR 网站，我刚刚在 Wordpress 中使用用户登录时由主 (RoR) 站点设置的 cookie 实现了一个登录/注销标头。

一切正常，除了当用户登录或注销（从 RoR 站点）时，我需要在 wordpress 站点上进行硬刷新以查看修改后的标头。我需要解决这个问题。

我的问题是 -这是我的缓存设置的问题，还是我应该以不同的方式实施解决方案？

我的解决方案

我的 RoR 网站会在用户登录时创建一个名为“登录”的 cookie，并在用户注销时删除该 cookie。

我编辑了我的子主题header.php以插入此代码：

<?php if(isset($_COOKIE['login'])) : ?>

  <!-- logged in header -->

<?php else : ?>

  <!-- not logged in header -->

<?php endif; ?>

缓存

我使用了很多缓存/优化插件/服务/设置，包括：

云焰

WP超级缓存

自动优化

Apache 配置来设置 Cache-Control 和 Expires 标题

首先，我禁用了 WP Super Cache，因为它的主要功能似乎是缓存 HTML 和 PHP，并且在插件处于活动状态的情况下，我需要在标头通过硬刷新更新之前删除缓存。

然后我取消选中 Autoptimze 设置以禁用 HTML 缓存。

然后我检查了我的 Cloudflare 设置——我正在使用标准缓存，使用现有的标头，并且没有进行任何缩小。

最后我的 Apache 配置似乎是正确的：

  <IfModule mod_headers.c>

 ...

     <FilesMatch "\.(html|htm|php|pdf)$">

       Header set Cache-Control "max-age=0, private, no-store, no-cache, must-revalidate"

     </FilesMatch>

  </IfModule>

作为附加测试，我直接（通过 IP 地址）访问了该网站，这似乎工作正常。我还在 Chrome 开发人员工具的网络选项卡上勾选了“禁用缓存”，并运行了一些测试，效果也很好。

因此，我认为现在问题出在 Chrome 上。

当我查看 HTTP 请求标头时，在注销或登录后返回到 Wordpress 站点后，我看到了：

Status Code: 200  (from disk cache)

当我单击浏览器刷新按钮时，页面刷新并且标题正确。

以下是显示错误标头时的 HTTP 响应标头：

cache-control: private, must-revalidate

cf-cache-status: DYNAMIC

cf-ray: 593e0b2e0cc706c5-LHR

cf-request-id: 02baa550c6000006c5e7912200000001

content-encoding: br

content-type: text/html; charset=UTF-8

date: Fri, 15 May 2020 15:55:31 GMT

expect-ct: max-age=604800, report-uri="https://report-uri.cloudflare.com/cdn-cgi/beacon/expect-ct"

expires: Fri, 15 May 2020 16:05:30 GMT

link: <https://www.example.com/blog/wp-json/>; rel="https://api.w.org/"

server: cloudflare

status: 200

vary: Accept-Encoding,User-Agent

Answer 1

我终于能够wget像这样在服务器上使用来调试这个问题：$ wget https://localhost/blog/ --no-check-certificate --server-response一旦我禁用了我在 Wordpress 中用于缓存的两个插件，这个命令就允许我绕过 Cloudflare 并查看 Apache 设置的标头。--2020-05-19 13:21:08--&nbsp; https://localhost/blog/Resolving localhost (localhost)... 127.0.0.1Connecting to localhost (localhost)|127.0.0.1|:443... connected.WARNING: cannot verify localhost's certificate, issued by ‘ST=California,L=San Francisco,OU=CloudFlare Origin SSL Certificate Authority,O=CloudFlare\\, Inc.,C=US’:&nbsp; Unable to locally verify the issuer's authority.WARNING: no certificate subject alternative name matches&nbsp; &nbsp; requested host name ‘localhost’.HTTP request sent, awaiting response...&nbsp;&nbsp; HTTP/1.1 200 OK&nbsp; Date: Tue, 19 May 2020 12:21:08 GMT&nbsp; Server: Apache&nbsp; Link: <https://localhost/blog/wp-json/>; rel="https://api.w.org/"&nbsp; Cache-Control: private, must-revalidate&nbsp; Expires: Tue, 19 May 2020 12:31:08 GMT&nbsp; Vary: Accept-Encoding,User-Agent&nbsp; Content-Type: text/html; charset=UTF-8&nbsp; Keep-Alive: timeout=5, max=100&nbsp; Connection: Keep-Alive&nbsp; Transfer-Encoding: chunkedLength: unspecified [text/html]Saving to: ‘index.html’我注意到 Cache-Control 标头与我的 Apache 配置中的标头不同。Cache-Control: max-age=0, private, no-store, no-cache, must-revalidate这是因为 Cache-Control 标头是在根域 Apache 配置中设置的，而不是为博客设置的（它由反向代理托管）。解决方案是将所有 Expires 和 Cache-Control 标头配置复制到我的博客 Apache 配置文件中，然后瞧瞧：$ wget https://localhost/blog/ --no-check-certificate --server-response--2020-05-19 16:41:19--&nbsp; https://localhost/blog/Resolving localhost (localhost)... 127.0.0.1Connecting to localhost (localhost)|127.0.0.1|:443... connected.WARNING: cannot verify localhost's certificate, issued by ‘ST=California,L=San Francisco,OU=CloudFlare Origin SSL Certificate Authority,O=CloudFlare\\, Inc.,C=US’:&nbsp; Unable to locally verify the issuer's authority.WARNING: no certificate subject alternative name matches&nbsp; &nbsp; requested host name ‘localhost’.HTTP request sent, awaiting response...&nbsp;&nbsp; HTTP/1.1 200 OK&nbsp; Date: Tue, 19 May 2020 15:41:20 GMT&nbsp; Server: Apache&nbsp; Vary: Accept-Encoding,Cookie,User-Agent&nbsp; Link: <https://localhost/blog/wp-json/>; rel="https://api.w.org/"&nbsp; Cache-Control: private, no-store, no-cache, must-revalidate&nbsp; Expires: Tue, 19 May 2020 15:41:20 GMT&nbsp; Content-Type: text/html; charset=UTF-8&nbsp; Keep-Alive: timeout=5, max=100&nbsp; Connection: Keep-Alive&nbsp; Transfer-Encoding: chunkedLength: unspecified [text/html]Saving to: ‘index.html’为了完整起见，请参阅我的博客的新 Apache 配置：# avoids sending hackers too much info about the serverServerTokens Prod<VirtualHost *:8080>&nbsp; ServerName www.example.com&nbsp; ServerAdmin [e-mail]&nbsp; ErrorLog /var/log/apache2/blog/error.log&nbsp; CustomLog /var/log/apache2/blog/access.log common&nbsp; DocumentRoot /var/www/blog&nbsp; <Directory /var/www/blog>&nbsp; &nbsp; AllowOverride All&nbsp; &nbsp; Options -Indexes&nbsp; </Directory>&nbsp; # Enable Compression&nbsp; <IfModule mod_deflate.c>&nbsp; &nbsp; SetOutputFilter DEFLATE&nbsp; &nbsp; SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png)$ no-gzip dont-vary&nbsp; &nbsp; SetEnvIfNoCase Request_URI \.(?:exe|t?gz|zip|bz2|sit|rar)$ no-gzip dont-vary&nbsp; &nbsp; Header append Vary User-Agent&nbsp; </IfModule>&nbsp; # Enable expires headers&nbsp; <IfModule mod_expires.c>&nbsp; &nbsp; ExpiresActive On&nbsp; &nbsp; ExpiresByType image/jpg&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;"access plus 1 year"&nbsp; &nbsp; ExpiresByType image/jpeg&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "access plus 1 year"&nbsp; &nbsp; ExpiresByType image/gif&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;"access plus 1 year"&nbsp; &nbsp; ExpiresByType image/png&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;"access plus 1 year"&nbsp; &nbsp; ExpiresByType text/css&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "access plus 1 month"&nbsp; &nbsp; ExpiresByType application/pdf&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;"access plus 1 month"&nbsp; &nbsp; ExpiresByType text/x-javascript&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;"access plus 1 month"&nbsp; &nbsp; ExpiresByType text/javascript&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;"access plus 1 month"&nbsp; &nbsp; ExpiresByType application/javascript&nbsp; &nbsp; &nbsp; &nbsp; "access plus 1 month"&nbsp; &nbsp; ExpiresByType application/x-javascript&nbsp; &nbsp; &nbsp; "access plus 1 month"&nbsp; &nbsp; ExpiresByType image/x-icon&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "access plus 1 year"&nbsp; &nbsp; ExpiresByType text/xml&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "access plus 0 seconds"&nbsp; &nbsp; ExpiresByType text/html&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;"access plus 0 seconds"&nbsp; &nbsp; ExpiresByType text/plain&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "access plus 0 seconds"&nbsp; &nbsp; ExpiresByType application/xml&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;"access plus 0 seconds"&nbsp; &nbsp; ExpiresByType application/json&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "access plus 0 seconds"&nbsp; &nbsp; ExpiresByType application/rss+xml&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;"access plus 1 hour"&nbsp; &nbsp; ExpiresByType application/atom+xml&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "access plus 1 hour"&nbsp; &nbsp; ExpiresByType text/x-component&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "access plus 1 hour"&nbsp; &nbsp; ExpiresDefault&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "access plus 0 seconds"&nbsp; </IfModule>&nbsp; # Enable caching headers&nbsp; <IfModule mod_headers.c>&nbsp; &nbsp; &nbsp;# Calculate etag on modified time and file size (could be turned off too ?)&nbsp; &nbsp; &nbsp;FileETag MTime Size&nbsp; &nbsp; &nbsp;# NEVER CACHE - notice the extra directives&nbsp; &nbsp; &nbsp;<FilesMatch "\.(html|htm|php)$">&nbsp; &nbsp; &nbsp; &nbsp;Header set Cache-Control "private, no-store, no-cache, must-revalidate"&nbsp; &nbsp; &nbsp;</FilesMatch>&nbsp; </IfModule>