如何在Angular中使用cache和update方法缓存API响应？
如何在Angular中使用cache和update方法缓存API响应？
提问于 2021-04-30 21:22:10
我是PWA和服务工作者的新手，在我的Angular应用程序中，我有一个主屏幕，在那里我可以显示从我的API获得的客户列表。
该组件显示一个列表，其中包含客户端的徽标和有关该客户端的数据。
问题是，所有的图像都在base64中从服务器获取，所以每次刷新后，需要很长时间才能获得所有这些图像，我将能够缓存这些数据，这样用户刷新网页后，他仍然会看到客户端列表，而不会向服务器发出新的请求，而它将在后台获取新数据，并且仅在新用户访问时可见。
我试图通过添加一个dataGroup来缓存我的API，如下所示：
"dataGroups": [
{
"name": "API",
"urls": ["/api/*"],
"cacheConfig": {
"maxAge": "0u",
"strategy": "freshness",
"maxSize": 100
}
}
]在我的ngInit组件中，我像这样获取资源：
ngOnInit(): void {
combineLatest([this.negoziService.negozi(), this.negoziService.images()]).subscribe(([nagozi, images]) => {
this.arrNegozi = nagozi;
images.map((img) => {
const negozio = this.arrNegozi.find((d) => d.id === img.id);
negozio !== undefined ? negozio.logo = 'data:image/jpg;base64,' + img.img : negozio.logo = 'assets/images/no_image.svg';
})
},
error => {
this.errore = error;
}
)
}回答 1
Stack Overflow用户
发布于 2021-05-06 09:06:29
您是否考虑过使用不同的策略？这是related docs
"dataGroups": [
{
"name": "API",
"urls": ["/api/*"],
"cacheConfig": {
"maxAge": "1d", // 1 day
"strategy": "performance", // use cached resources
"maxSize": 100
}
}
]页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/67334686
复制相关文章
相似问题
腾讯云开发者
