从Apollo客户端缓存中查询嵌套对象失败，并显示“在ROOT_QUERY对象上找不到字段[FIELD]”

问题描述

我的React客户端使用查询检索albumId为1的相册的所有照片。

const GET_ALBUM_PHOTOS = gql`
  query($albumId: Int!) {
    photos(albumId: $albumId) {
      id
      src
      thumbnail
      ...
    }
  }
`;

打开Apollo Chrome扩展程序时，我可以看到缓存的记录：

photos({"albumId":"1"}):
0:{"__ref":"PhotoType:6100"}
1:{"__ref":"PhotoType:1284"}
2:{"__ref":"PhotoType:2014"}
3:{"__ref":"PhotoType:2745"}
4:{"__ref":"PhotoType:2425"}
...

现在，当我单击其中一张显示的照片时，在点击处理程序中获得photoId，随后，我想将照片对象上的本地字段isSelected设置为{{1 }}。

我在true内的客户端上扩展了PhotoType：

resolvers.js

在显示特定相册照片网格的组件中，我尝试检索其ID指定的照片，如下所示：

export const typeDefs = gql`
  extend type Query {
    ...
  }

  extend type Photo {
    isSelected: Boolean!
  }
`;

其中 const obtainedPhotoId = 1089; const photo = client.readQuery({ query: GET_PHOTO,variables: { photoId: obtainedPhotoId },}); 查询的定义为：

GET_PHOTO

（请注意，这两个查询在服务器上都可以正常工作。我还确保我不会忘记const GET_PHOTO = gql` query($photoId: Int!) { photo(id: $photoId) { id src thumbnail ... } } `; 对象。）

现在，问题在于Apollo抛出了MissingFieldError：variables，这是有道理的，因为照片对象位于具有键"Can't find field 'photo' on ROOT_QUERY object"的列表中。从我在文档上阅读的内容以及对正式仓库的问题跟踪器的各种评论来看，我可能需要定义一个缓存重定向。我尝试了这个（还有很多其他事情）：

photos({"albumId":"1"})

但是错误仍然存​​在。我也尝试定义一个解析器并将其添加到Apollo构造函数中：

const iMCache = new InMemoryCache({
  addTypename: true,cacheRedirects: {
    Query: {
      photo: (_,args,{ getCacheKey }) => {
        getCacheKey({ __typename: 'Photo',id: args.id });
      },},});

没有变化。

我不确定如何调试它，因为无论如何更改解析器或重定向，我都会顽固地收到相同的错误消息。我还尝试运行原始查询以按相册检索照片，该查询首先将这些对象放入缓存。令人惊讶的是，它告诉我找不到查询 Photo: { isSelected: (photo,_,{ cache }) => { const queryResult = cache.readQuery({ query: GET_PHOTO,variables: { photoId: photo.id },}); if (queryResult) { return queryResult.photo; } return false; },。这些文档相对来说比较有用，因为没有针对此特定（但据认为很常见）用例的具体示例。我在这里怎么了？

编辑： 我忘了提到我正在使用Apollo Client v3。在深入研究之后，我认为posts已经过时了，应该走的路是CacheRedirects，但是我仍然没有找到一种方法来完成这项工作。

解决方法

更新鲜的解决方案：https://www.apollographql.com/docs/react/caching/advanced-topics/#cache-redirects-using-field-policy-read-functions

错误指出缺少extend type Query { photo(photoId: ID!): Photo-使用“仅缓存”提取策略...但这是一种不同的域策略方法。