Nodejs怎样在客户端实现静态资源的缓存？

Nodejs怎样在客户端实现静态资源的缓存？
初级阶段新手，请求各位不吝分享想法和经验！！！

12 回复

1.利用 http cache
2.利用 js 的 localstorage


1 这和 node 无关
2 如果用 html5 的 localStorage 注意小米是持有专利的

小米还有这专利？？？

保护性嘛！联想还拥有“从 /proc 获得系统信息的专利”呢

如果想通过 node 实现呢？

NodeJS 中的客户端缓存、浏览器缓存、 304 缓存和 OnceIO 的缓存控制
http://cn.oncedoc.com/blog/view/iv3wnv5248br

node 只能给浏览器发一些暗示，但浏览器是否执行，和 node 一点儿关系也没有

和前端基本无关。不过后端可以做一些缓存，例如服务端渲染这样的工作，有兴趣的话可以看看我的博文， https://smallpath.me/post/spa-opti

html manifest 离线访问可以吗？

manifest 已经从标准中移除了，不建议

localStorage 一般有大小限制，最好<5MB

毕竟是 BS 结构，不要太纠结，在服务端做些提示就好了，看 6 楼

可以用 indexedDB, 我常用的一个查文档的工具 http://devdocs.io/， 就是通过 indexedDB 把文档保存在本地，所以访问起来很方便

在Node.js中，实现静态资源的缓存通常涉及设置适当的HTTP头，以便浏览器能够缓存这些资源。这可以通过使用内置的http-server模块或更强大的框架如Express来完成。下面是如何在Express中实现静态资源缓存的示例：

首先，确保你安装了Express：

npm install express

然后，你可以使用以下代码来设置静态资源缓存：

const express = require('express');
const path = require('path');
const app = express();

// 设置静态文件夹
const staticFolder = path.join(__dirname, 'public');
app.use(express.static(staticFolder, {
    maxAge: '1d', // 设置缓存时间为1天
    setHeaders: (res, path, stat) => {
        // 你可以根据文件类型设置不同的缓存策略
        if (path.endsWith('.js')) {
            res.setHeader('Cache-Control', 'public, max-age=86400'); // 1天
        } else if (path.endsWith('.css')) {
            res.setHeader('Cache-Control', 'public, max-age=604800'); // 1周
        } else if (path.endsWith('.png') || path.endsWith('.jpg')) {
            res.setHeader('Cache-Control', 'public, max-age=31536000'); // 1年
        }
    }
}));

app.listen(3000, () => {
    console.log('Server is running on port 3000');
});

在这个示例中，我们设置了一个静态文件夹public，并通过maxAge选项为所有静态资源设置了一个默认的缓存时间。此外，我们还使用了setHeaders函数为不同类型的文件（如JavaScript、CSS和图片）设置了不同的缓存策略。这样，浏览器就可以根据这些HTTP头来缓存静态资源，从而提高加载速度和性能。

回到顶部