HTML5 本地存储 - 存储和加载已下载一次的 CSS

Posted 2023-03-05

【中文标题】HTML5 本地存储 - 存储和加载已下载一次的 CSS

【英文标题】：HTML5 local storage - Store and load CSS that has been downloaded once

【发布时间】：2013-06-07 06:24:38

【问题描述】：

我想知道是否可以执行以下操作：使用 html5 本地存储存储 CSS 和/或 javascript 文件，并且当再次访问页面时使用本地存储的文件，而不是再次从网络下载它们。

这对于在 3G 上运行的 webApp 很有用，可以减少要下载的数据量。

但是，我不确定在页面加载期间是否可以访问这些文件。有人知道吗？

【问题讨论】：

缓存有什么问题？

【参考方案1】：

您应该使用 cache manifest file 而不是 localStorage

【讨论】：

我实现了您从 html5Rocks Andreas 建议的链接，但是出现了一个问题：Google Chrome、Safari 和 IE9+ 工作正常，但 Firefox 在顶部提醒用户一条消息，说我的网站正在请求离线他计算机上的存储空间（用于缓存，而不是 html5）。该消息还使他可以选择允许/拒绝它。这对用户应该是透明的......还有没有其他方式来实现它而不用 firefox 抛出这个消息？

似乎你不能同时拥有（ff 和缓存中的非警报），但你阻止存储在 ff：gist.github.com/bumpux/4567599

提醒任何尝试此操作的人：我时不时地遇到一些问题，即在我更改其代码并更改清单以强制其重新加载内容后页面没有更改。最好的解决方法是使用 Ctrl+F5 刷新页面，因为这似乎会强制浏览器不使用缓存。

【参考方案2】：

通常浏览器会自动为您缓存 CSS 文件。即使在移动设备中。

【参考方案3】：

这会是可能的，但是这非常昂贵，因为在页面加载时您必须手动加载字符串，将其转换为样式/脚本并将其插入 DOM，以便浏览器识别.也可能存在浏览器不支持 localStorage 或用户阻止您访问它的情况。

最好使用元标记和/或缓存清单相应地设置缓存指令 - 浏览器通常会自动缓存您的文件。