在加载时存储JSON文件内容

Question

现在，我有一个加载JSON文件的工厂。

angular.module("app").factory("RolesFactory", ['$http', '$q', function($http, $q) {
    var d = $q.defer();
    $http.get('events.json').success(function(data) {
        d.resolve(data);
    }); 
    return d.promise;
}]);

然后当我需要使用此控制器的events.json的内容时，我调用此工厂：

App.controller('rolesCtrl', ['$scope', 'RolesFactory', function($scope, RolesFactory) {
    RolesFactory.then(function(roleData){
        $scope.roles = roleData.roles;
    });
}]);

一切都很好，但每当我需要使用这些数据时。难道它没有重新获取events.json的内容吗？含义：Angular一遍又一遍地重新加载文件？我希望加载文件一次，并通过全局变量或其他东西调用它。

当我的应用程序最初加载时，我希望它加载并存储events.json的竞争对象 - 然后我希望我的应用程序能够随时随地使用此数据。

这可能吗？

Answer 1

由于AngularJS是一个无状态框架，因此这里只有几个选项，所有选项都是某种客户端缓存：

1. 使用localStorage存储您的数据。获取数据后，您可以在对JSON进行字符串化后使用localStorage将其保存到localStorage.setItem。你下次使用它时需要重新解析JSON，所以如果这是一个巨大的JSON，这不是最好的主意
2. 使用sessionStorage存储您的数据。这与＃1完全相同，但在会话终止时您将丢失数据，即。关闭浏览器。
3. 信任要在浏览器中缓存的JSON。这种情况很可能就是这种情况。默认情况下，静态资产由大多数现代浏览器缓存。因此，工厂第二次请求JSON时，实际上并未从服务器获取资源。它只是从浏览器的缓存中提取出来的。

注意：检查此问题的方法是在Chrome的“开发者工具网络”标签中查看资源的HTTP状态代码。如果状态显示304，则表示已从缓存中提取。