部署后清除模板缓存

Question

我想确保我的用户在部署后看到我的Angular应用的最新版本。在这种情况下清除模板缓存的正确策略是什么？

我看过你可以做$templateCache.removeAll()的地方app.run，但是这会完全禁用缓存吗？

Answer 1

您需要编写一个拦截器并“捕获”所有模板请求 - 您应该可以在此拦截器中添加一个URL参数来对您的模板资产进行版本化。

例子：

// App .config() 
$httpProvider.interceptors.push(function($templateCache) { 
    return { 
    'request' : function(request) { 
     if($templateCache.get(request.url) === undefined) { // cache miss 
      // Item is not in $templateCache so add our query string 
      request.url = request.url + '?appVersion=' + appService.getConfig().version; 
     } 
     return request; 
    } 
}; 

你当然需要在每次部署新版本的时间来更新这个应用程序的配置（通过构建任务可以自动更新这个文件）。您可能需要添加额外的检查（例如，如果URL路径以'.html'结尾，请进行比较），以确保您不会高估实际的HTTP请求。

这种方法的下降是有时你可能有一个模板没有更新，你不希望浏览器缓存被丢弃。如果这是你的情况，那么你应该为每个添加一些md5（templateContent）---这可以通过Grunt/Gulp在构建时实现。