如何在 ApolloClient.query() 上使用“缓存和网络”策略

Question

我正在使用 ApolloClient 构建一个应用程序来查询 GraphQL 端点。我希望在正常查询上使用“缓存和网络”获取策略，因为此特定策略仅适用于 watchQueries。我真正想要的是以下内容：

1. 如果我们可以查询服务器，我们就会得到服务器的响应。

2. 如果我们无法查询服务器，我们会从缓存中加载内容（如果已缓存）

这是我用来实例化 ApolloClient 的代码。

const defaultOptions = { 
  watchQuery: {
    fetchPolicy: 'cache-and-network',
    errorPolicy: 'ignore',
  },
  query: {
    fetchPolicy: 'network-only',
    errorPolicy: 'all',
  },
  mutate: {
    errorPolicy: 'all'
  }
}


const client = new ApolloClient({
  cache: cache,
  link: createUploadLink({
    uri: 'http://localhost:3000/graphql',
  }),
  defaultOptions
});

所以我想我有两个选择：捕获第一个查询响应，如果失败则从缓存加载内容，或者使用 watchQuery 方法发出查询。

我不知道该怎么做，所以欢迎任何帮助！

Answer 1

我最终忽略了构造函数中的 defaultOptions 对象。我根据网络状态在查询本身中定义 fetchPolicy。

function getZones() {
  return ApolloService.client.query({
    query: GET_ZONES_CLIENT,
    fetchPolicy: navigator.onLine ? 'network-only' : 'cache-only'
  })
}