Question

我有一个使用angularjs和bootstrap的网站。问题在于客户端浏览器中的缓存。我发布了一些东西......客户端从缓存中获取旧东西。我使用angular-ui-router-0.3.1进行路由。

我在$ stateProvider中使用cache：false，但没有。

这是我用来路由html页面的索引：

<!DOCTYPE html>
<html lang="en" ng-app="mainApp">
<head>    
<meta http-equiv="expires" content="0">
<meta http-equiv="cache-control" content="no-cache, must-revalidate, post-check=0, pre-check=0">
<meta http-equiv="pragma" content="no-cache">
...
</head>
<body>
<div ui-view></div>
</body>
</html>

和app.js：

var app = angular.module('mainApp', ['ui.router','angularUtils.directives.dirPagination']);
app.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
    .state('index', {
        cache: false,
        url: '/',
        templateUrl: 'pages/main.html'
    })
    .state('presentation', {
        cache: false,
        url: '/presentation',
        templateUrl: 'pages/presentation.html'
    })
    .state('about', {
        cache: false,
        url: '/about',
        templateUrl: 'pages/about.html'
    })
    ...
    $urlRouterProvider.otherwise('/');
    });

最大的问题是，例如，当我更新演示文稿页面时，客户端不会获得更新。

即使它存储在缓存中，我该如何强制路由页面加载？或者如何说客户端浏览器，不要缓存路由页面？

Answer 1

第1步：在配置中创建一个变量用作查询字符串，例如：

var version = 1.01;

然后像这样更改所有templateUrl：

templateUrl: 'pages/main.html?v=' + version

每次将新版本推送到生产环境时，都要更新version变量。这应该强制浏览器重新加载模板，因为它无法知道新的查询字符串代表什么。

第2步：如果您还想强制重新加载主页面，以下是满足所有浏览器的最低要求：

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />

缓存路由页面禁用

1 个答案: