缓存 API 在 safari ios 模拟器和 mac 上不起作用答案

【问题标题】：Cache API doesn't work on safari ios simulator and on mac缓存 API 在 safari ios 模拟器和 mac 上不起作用
【发布时间】：2020-07-11 18:22:32
【问题描述】：

我正在尝试在我的index.html 中使用以下 sn-p 代码。

<script>
        fetch('index1.js').then(response => {
            caches.open('test-cache').then(cache => {
                cache.put('index1.js', response);
            })
        })
    </script>

我在本地主机上有一个名为test-website.com 的自定义域。当我通过 chrome 访问这个页面时，一切都很好，index1.js 被存储在缓存中。现在，我打开 ios Simulator 并在那里打开 safari 并再次运行同一个网站。我也在 mac safari 上查看了这个网站，但在控制台中，这就是我得到的：

未处理的承诺拒绝：ReferenceError：找不到变量：缓存

问题 1) 为什么会出现此错误？

问题 2) 我检查了兼容性：Cache Storage API 和 Cache。第一个与 ios safari 兼容，第二个不兼容。这2个有什么区别？这可能是它找不到缓存的原因吗？

问题 3) Apple 支持 service worker，它应该支持Cache API。否则它没有价值。有什么想法吗？

【问题讨论】：

我在 prod 上遇到了同样的问题，当触发 SW 的安装事件时，我触发了 caches.open 但 caches 在全局范围内未定义。一些可能的竞争条件？

标签： javascript ios iphone caching

【解决方案1】：

Cache Storage API 的文档说明如下：

注意：Chrome 和 Safari 仅通过 HTTPS 将 CacheStorage 暴露给窗口上下文。除非配置了 SSL 证书，否则 window.caches 将是未定义的。

确保您通过 HTTPS 提供和访问网页

据我所知，浏览器在提供来自localhost 的页面时仍允许访问caches 变量作为进行测试的一种手段，但如果您通过自定义域名test-website.com

【讨论】：