Question

我正在尝试针对搜索引擎优化目的优化我的登陆页面。 Google pagespeed工具可能有所帮助，因此我尝试获得100/100但无法解决浏览器缓存问题。

我尝试通过在header.php中添加以下行来添加缓存：

username

但该工具仍然说我没有任何浏览器缓存。

我在SO上发现了另一篇文章说你只需添加这样的元标记：

<?PHP 
header("Cache-Control: max-age=2592000"); //30days (60sec * 60min * 24hours * 30days)
?>

但在使用该行时，我仍然可以从Pagespeed洞察中获得消息。

那我需要什么？

Answer 1

您需要配置您的网络服务器以启用浏览器端缓存（听起来很讽刺），

Nginx （添加到您的/etc/nginx/nginx.conf中）

location ~* \.(css|js|ico|gif|jpeg|jpg|webp|png|svg|eot|otf|woff|woff2|ttf|ogg)$ {
  expires max; 
}

如果您没有没有访问您的 nginx.conf 的权限，请咨询您的托管服务提供商或查看服务器端缓存应用程序是否具有此选项。如果您自己执行此操作，则需要在以后重新启动nginx。

来源：https://www.wpfastestcache.com/tutorial/how-to-enable-leverage-browser-caching-on-nginx/

Apache （添加到.htaccess）

<IfModule mod_expires.c>
  ExpiresActive On

  # Images
  ExpiresByType image/jpeg "access plus 1 year"
  ExpiresByType image/gif "access plus 1 year"
  ExpiresByType image/png "access plus 1 year"
  ExpiresByType image/webp "access plus 1 year"
  ExpiresByType image/svg+xml "access plus 1 year"
  ExpiresByType image/x-icon "access plus 1 year"

  # Video
  ExpiresByType video/mp4 "access plus 1 year"
  ExpiresByType video/mpeg "access plus 1 year"

  # CSS, JavaScript
  ExpiresByType text/css "access plus 1 month"
  ExpiresByType text/javascript "access plus 1 month"
  ExpiresByType application/javascript "access plus 1 month"

  # Others
  ExpiresByType application/pdf "access plus 1 month"
  ExpiresByType application/x-shockwave-flash "access plus 1 month"
</IfModule>

来源：https://gtmetrix.com/leverage-browser-caching.html

100分祝你好运！

如何正确实现pagespeed洞察的浏览器缓存？

1 个答案: