当客户端代码已经下载时，如何在 SPA 中"bust cache"？

Question

我目前正在使用grunt将我的应用程序捆绑到一个版本化的负载中，该负载在下载之间破坏缓存。我现在要做的是客户端已经下载了位，并且正在使用缓存的客户端代码。

1. 我部署版本1.0
2. Bob下载v1.0
3. Cindy下载v1.0
4. 我部署v1.1
5. Bob的缓存过期，下次访问我的网站时，他将获得v1.1版本
6. Cindy仍然有v1.0对v1.2服务器端代码发出AJAX请求

我想知道如何在#6上告诉Cindy的浏览器——"嘿！你有旧代码！触发刷新！"

我想的是，在每个请求的响应标头中，以某种方式包括响应来自的构建的日期和时间。但这意味着我需要访问DLL的属性，作为每个请求的一部分。这可能吗？

如果是，那么我可以将该日期/时间与客户端的日期/时间（当然是UTC）进行比较，以确定是否需要刷新。

如果没有，正确的解决方案是什么？

Answer 1

在require.js配置中，您可以添加urlArgs属性：

require.config({
    urlArgs: 'bust=@Revision@',
    ...
    ...
});

这将在请求的url末尾添加修订号。

然后，您可以使用grunt任务将@Revision@替换为您的修订号。如果你正在使用类似teamcity的东西进行CI，你也可以在那里进行，并将其替换为teamcity生成的实际内部版本号。你可以使用powershell进行此操作。

请注意，在每次部署中，您都会强制客户端获取所有javascript文件，无论它们是否已更改。根据您的情况，可能需要也可能不需要。如果你想更聪明一点，你可以散列文件的内容并缓存这些服务器端，然后你可以创建一个require.js路径配置，将客户端名称映射到散列键。当文件的内容发生变化时，散列会发生变化，从而只强制对已更改的文件进行新的下载。

希望这能有所帮助。