现在很多web应用都是使用Vue
、React
等框架开发的,这种SPA单页面
应用在打包后,有些文件比较大。因此,大部分公司在生产环境会使用CDN加速
,来加快首页渲染速度
。
但是使用CDN后静态文件会有缓存,重新打包上线后,可能不会立即更新修改的地方。浏览器上可以使用Ctrl + Shift + R
强制清理缓存,但是手机上清理缓存就很麻烦。再说这种清理缓存的方式对用户来说极度不友好,所以需要在Nginx
中配置相应的缓存策略
。
配置Nginx
打开 nginx.conf
配置文件,编辑对应的server
,加上下面的控制缓存策略代码:
1 | server { |
- code-1: 这段代码的含义是不缓存
html
入口页,每次都重新从服务端拉取最新的文件。 - code-2: 这个是匹配找到所有的
js
、css
文件,让其加上 30天 的缓存。
配置成功后,执行 nginx -s reload
重启nginx,应该就大功告成了。
Nginx 相关推荐
- Nginx学习与实战 · 配置HTTP2
- Nginx学习与实战 · 解决SPA单页面应用CDN缓存问题
- Nginx学习与实战 · 解决net::ERR_CONTENT_LENGTH_MISMATCH 206问题
- Nginx warn:conflicting server name ‘127.0.0.1’ on 0.0.0.0:8010, ignored
- Nginx反向代理WebSocket服务连接报错:WebSocket connection to ‘wss://xxx/xxx’ failed
欢迎访问:天问博客
本文作者: Tiven
发布时间: 2022-01-20
最后更新: 2023-03-02
本文标题: Nginx学习与实战 · 解决SPA单页面应用CDN缓存问题
本文链接: https://www.tiven.cn/p/23ff4dc/
版权声明: 本作品采用 CC BY-NC-SA 4.0 许可协议进行许可。转载请注明出处!
发布时间: 2022-01-20
最后更新: 2023-03-02
本文标题: Nginx学习与实战 · 解决SPA单页面应用CDN缓存问题
本文链接: https://www.tiven.cn/p/23ff4dc/
版权声明: 本作品采用 CC BY-NC-SA 4.0 许可协议进行许可。转载请注明出处!