fuzhengwei / fuzhengwei/CodeGuide

关于vuepress页面缓存,Nginx配置记录📝

Open
#291 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
Shell
Stars
11.9k
Forks
4.2k
PR merge metrics
No merged PRs in 30d

Description

**背景**:默认情况下使用nginx作为h5静态资源的服务器时,这些资源在浏览器端是会有缓存的,特别是微信浏览器中,缓存非常严重。

**方案**:所以项目开始部署阶段就需要配置好nginx禁止这些资源的缓存,nginx需要做如下配置

```nginx
error_page 404 https://bugstack.cn;
location / {
root html;
index index.html;
add_header Cache-Control no-cache;
}
```

**补充**:这个nginx修改后是不会立即影响到客户端的,如果某个客户端曾经打开过,那后续还是会优先从缓存中获取,除非刷新请求一次修改后的页面,再往后才生效。以上方式相当于所有的都会去掉缓存,单vue页面我们只需要去掉html的缓存即可,因为js等会自动加上hash,所以即便缓存也没关系,所以应该加个条件:

```nginx
if ($request_filename ~* .*\.(?:htm|html))
{
add_header Cache-Control "no-store, no-cache";
}
```

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.