angularjs – 您使用什么策略来获取和缓存分页集合,特别是在角度

发布时间：2020-12-17 18:07:49 所属栏目：安全来源：网络整理

导读：假设一个应用程序使用暴露分页集合的REST api中的数据,并且集合中的项目数量可能无限大(即,一次获取所有项目并存储在浏览器会话中的项目太多). 什么是获取,缓存和使这些数据的缓存无效的好策略？说,API就像, GET /users?page=1per_page=50 使用如下的响应(

假设一个应用程序使用暴露分页集合的REST api中的数据,并且集合中的项目数量可能无限大(即,一次获取所有项目并存储在浏览器会话中的项目太多).

什么是获取,缓存和使这些数据的缓存无效的好策略？

说,API就像,

GET /users?page=1&per_page=50

使用如下的响应(即包括收集数据分页元数据)

{
  "paging": {
    "per_page": 20,"page": 1,"previous": null,"self": "/api/v1/users?per_page=20&page=1","next": "/api/v1/users?per_page=20&page=2"
  },"data": [
    // first 20 users
  ]
}

客户端可能会也可能不会在连续页面中加载集合,一次一页.任何客户端都可以更改集合中的用户.最终的一致性就足够了,我现在并不关心写冲突.

问题是在angularjs应用程序的上下文中,但是是一般的场景.

解决方法

我做/做的是使用angular的 $cacheFactory,每个API端点都有一个条目.因此,如果您当前的URL是/ api / v1 / users？per_page = 20& page = 1,则缓存的密钥将是/ api / v1 / users,没有任何分页参数.然后,一旦返回响应,请在处理数据的函数中执行以下操作：

// add customer insert method somewhere
Array.prototype.insert = function (index,item) {
  this.splice(index,item);
};

var cachedData = $cacheFactory.get(key);

var insertPosition = pageSize * currentPage;

cachedData.insert(insertPosition,returnedData);

$cacheFactory.put(cachedData);

可能比现实生活中的情况简单得多,但你明白了.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!