Question

加载javascript文件时，我可以通过在加载文件时添加版本来强制浏览器不使用缓存，例如。

<script src="~/angular/myapp/app.js?version=123"></script>

从我的角度应用程序内部我这样做：

$routeProvider.when("/", {
  controller: "userController",
  controllerAs: "vm",
  templateUrl: "Path/to/Template/Index.html"
});

如何确保我对Index.html所做的任何更改都不会被缓存？或者出于某种原因这不是问题？

angular 1.x

Answer 1

您可以对Index.html文件执行相同的操作。只需在您的js文件中添加“cache buster”查询字符串。有一些技巧可以做到这一点，但一个简单的Date.now()时间戳应该证明了目标 ...

$routeProvider.when('/', {
  controller: 'userController',
  controllerAs: 'vm',
  templateUrl: `Path/to/Template/Index.html?t=${Date.now()}`
});

如果您的应用程序变得越来越复杂并且您希望完全阻止模板的缓存，那么您可以通过一些中间件实现此目的......

angular.module('preventTemplateCache').factory('preventTemplateCache', function($injector) {
  return {
    'request': function(config) {
      if (config.url.indexOf('views') !== -1) {
        config.url = `${config.url}?t=${Date.now()}`
      }
      return config;
    }
  }
}).config(function($httpProvider) {
  $httpProvider.interceptors.push('preventTemplateCache');
});

上面的示例假设您的模板的目录为views。

最后，正如评论所指出的，如果您只是希望阻止本地开发的缓存，您可以通过浏览器开发工具切换设置以禁用缓存资源。

如何强制浏览器重新加载角度模板文件而不缓存它？

1 个答案: