spring-mvc - 使用 angularjs 开发的应用程序中 ie 9/10 上的数据未更新

Question

我正在使用 angularjs 开发一个简单的用户管理系统。这是简单的添加、更新和删除应用程序。我在后端使用 spring-mvc 来获取 JSON 响应。
在 Firefox、Chrome 和 Safari 中一切正常，但 IE ..!!!!

我有一页列出了所有用户。这是它第一次在 IE9/10 中正常工作，但对任何用户所做的任何更新都不会反射(reflect)在 View 中(使用 IE)。

我无法弄清楚发生了什么。我认为 IE9/10 也会缓存 json 数据，每次调用用户列表页面时，它都会将缓存的数据与页面绑定(bind)。

是否可以让 IE9/10 忘记那些加载的数据？

用于访问网络服务的 Angular 模块:

angular.module("user.service", ["ngResource"]).
  factory('User', function($resource, $rootScope) {
    var User = $resource(
      $rootScope.apipath + 'users/:userId', {userId: '@id'},
      {update: {method: 'PUT'}}
    );

    User.prototype.isNew = function() {
      return (typeof(this.id) === 'undefined');
    };

    return User;
});

用户列表 Controller :

function UserListController($scope, User) {
    $scope.users = User.query();
}

用户列表模板:

<h2><msg key="users"></msg><a class="btn btn-primary pull-right" href="#/users/new"><i class="icon-plus-sign icon-white"></i><msg key="addnew"></msg></a></h2>

<table class="table table-striped">
    <tr>
        <th><msg key="username"></msg></th>
        <th><msg key="name"></msg></th>
        <th></th>
    </tr>
    <tr ng-repeat="user in users">

        <td>{{user.userId}}</td>
        <td>{{user.contact.firstName}} {{user.contact.lastName}}</td>
        <td>
            <div class="pull-right">
                <a class="btn btn-info" href="#/users/{{user.id}}">
                    <i class="icon-pencil icon-white"></i><msg key="edit"></msg>
                </a> 
            </div>
        </td>
    </tr>
</table>

Answer 1

我们正在开发一个大型 AngularJs 应用程序，并且在 IE 中也遇​​到了缓存问题。最终的解决方法是将缓存控制 header 添加到 api 响应消息中。

Cache-Control: no-store

另一种选择是创建一个 http 拦截器，它附加一个唯一的时间戳，因此每个请求都是不同的并且不会被缓存。

See this article by Jef Claes about information on how to create the http interceptor .

帖子中的代码示例

var AppInfrastructure = angular.module('App.Infrastructure', []);

AppInfrastructure
    .config(function ($httpProvider) {
        $httpProvider.requestInterceptors.push('httpRequestInterceptorCacheBuster');
    })    
    .factory('httpRequestInterceptorCacheBuster', function () {
        return function (promise) {
            return promise.then(function (request) {
                if (request.method === 'GET') {
                    var sep = request.url.indexOf('?') === -1 ? '?' : '&';
                    request.url = request.url + sep + 'cacheSlayer=' + new Date().getTime();
                }

                return request;
            });
        };
    });