订阅 Angular Apollo 查询 observable 会带来旧值、缓存问题

Posted 2023-03-10

【中文标题】订阅 Angular Apollo 查询 observable 会带来旧值、缓存问题

【英文标题】：Subscribing to angular Apollo query observable brings old values, caching issue

【发布时间】：2019-02-04 11:18:14

【问题描述】：

我在后端使用 graphql 和 Apollo 进行调用。在 ngOnInit 中，我订阅了一个可观察的 Apollo 查询来检索所有项目，它工作正常，我添加了一个项目，然后转到另一个组件并返回，以便再次调用 ngOnInit 并从服务器获取新项目列表（之后添加一个项目），但它带来了相同的列表（添加之前）。如果我刷新页面，我会得到添加了新项目的新列表。我尝试取消订阅 onDestroy 但仍然没有运气。我尝试使用 watchQuery，但显然我的 Apollo 版本没有使用 Apollo anguoar 0.11.0 的 valueChanges，这是唯一适用于我的 angular 4 项目的版本。

【问题讨论】：

可能缓存有问题。尝试根据当前时间在您的 graphql 请求中添加一个参数。像 &time=Date.now().toString() 这样的东西。即使您的 graphql 不使用此参数。它允许强制 Apollo 提出新的请求并获得真实的结果。

感谢您的评论，是的，这是缓存的问题，我在 ngOnDestroy() 中对我的 apollo 客户端执行了 client.resetStore() 并成功了。如果这是一个答案，我会将其标记为解决方案，那么您解决问题的方法肯定比我的好。

我可以回答，您可以将其标记为解决方案。 ^^

当然，继续！

这是克服问题的有趣方法。但是我很好奇这个版本的 Apollo angular 是否不支持 fetchPolicy？

【参考方案1】：

问题来自 Apollo 的缓存。 当您发出相同的请求时，它会重复使用从请求中获得的先前结果。

有多种解决方案可以强制它不使用缓存。

正如我在 cmets 中所建议的，您可以放置​​一个 HTTP 参数，该参数将针对每个 HTTP 请求进行更改。例如，某些取决于当前时间的东西，例如&time=Date.now().toString()。每个请求都会有所不同，因此 Apollo 不会使用缓存。

但您也可以（如您所说），而且可能会更好，只需将client.resetStore() 放入ngOnDestroy() 即可重置它。它将导致存储被清除并重新获取所有活动查询。 (source)