利用浏览器缓存外部文件答案

【问题标题】：Leverage browser caching for external files利用浏览器缓存外部文件
【发布时间】：2019-11-20 06:53:34
【问题描述】：

我正试图让我的谷歌页面速度洞察评级不错，但我也想缓存一些外部文件，有谁知道处理这个问题的最佳方法是什么？

https://s.swiftypecdn.com/cc.js (5 minutes)
https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (60 minutes)
https://pagead2.googlesyndication.com/pagead/osd.js (60 minutes)
https://www.google-analytics.com/plugins/ua/linkid.js (60 minutes)
https://hey.hellobar.com/…d5837892514411fd16abbb3f71f0d400607f8f0b (2 hours)
https://www.google-analytics.com/analytics.js (2 hours)

【问题讨论】：

标签： browser-cache google-pagespeed

【解决方案1】：

使用不同的浏览器缓存设置复制到您的服务器并在本地或从 CDN 提供服务。使用 cronjob 或类似的东西定期更新 GA 脚本。

在 Wordpress 上，有一些插件可以为您做到这一点，例如：Above The Fold；他们将此功能称为 Javascript 本地化。

另一方面，我在服务器上使用 Google Pagespeed 模块，它的指令 MapProxyDomain 与 Alternative async tracking snippet 结合使用。这对我来说似乎最优雅。

这应该足以让您开始解决问题。

【讨论】：

插件“above-the-fold-optimization”已于 2018 年 4 月 1 日关闭:(
@MarcoPanichi 你是对的，但现在有替代品，比如 CAOS 插件：wordpress.org/plugins/host-analyticsjs-local
在您的解决方案中，您定期更新脚本，这很好，但谷歌不推荐这种方法。见this link

【解决方案2】：

set cache-control to external resources? 您无法控制从您无法控制的服务器发送的标头。

换句话说，要么自己托管副本，要么您无能为力。

谢谢

【讨论】：

【解决方案3】：

这些文件没有解决方案。如果这些文件是 CDN（如 bootstrap cdn），您可以将这些文件本地复制到您的主机中，但如果这些请求是在运行时生成的，那么您将无能为力。 :)

【讨论】：

【解决方案4】：

您可以制作自己的缓存

将一些文件放置到浏览器的本地存储中（在它们第一次从远程服务器到达之后），下次您可以从本地副本中提供它们。这样，您可以将内容存储在需要的地方 - 唯一需要注意的是更新它们，您需要一种方法来在需要新版本时替换这些文件。

如果您不想从头开始，这里有一些 Javascript 库：
https://www.sitepoint.com/9-javascript-libraries-working-with-local-storage/

例如看看这个lsCache，它看起来超级实用：

    lscache.set('greeting', 'Hello World!', 2);     // 2 minute expiration
    lscache.get('greeting');                        // returns "Hello World!"
    lscache.remove('greeting');                     // remove
    lscache.flush();                                // flush the entire cache
    lscache.flushExpired();                         // flush only expired items

【讨论】：