10、网站托管与前端构建全攻略

网站托管与前端构建全攻略

1. 客户端缓存失效处理

在浏览网页时，浏览器会缓存下载的所有文件（如 HTML、CSS、JavaScript、图像等），以提高性能。但当修改了某个文件内容后，如何让浏览器丢弃之前的缓存内容呢？由于缓存位于客户端而非服务器端，无法创建失效请求，但可以通过更改修改文件的名称来强制浏览器发起新请求。

• 方法一：更改文件名
  例如，将 script.js 改为 script.v2.js ，并在 HTML 页面中使用新名称：

<script src="script.v2.js"></script>

• 方法二：添加查询字符串
  在 HTML 页面中声明文件名时添加查询字符串，如：

<script src="script.js?v=2.0"></script>

这两种策略存在一个问题，即不能缓存 HTML 页面，否则客户端无法理解应下载文件依赖的新版本。为确保 HTML 文件永不被缓存，上传时需将 Cache-Control 头设置为 no-cache 。以下是具体操作步骤：