Node.js（无React）环境下Apollo Client执行Mutation后无法更新GraphQL缓存

嘿，我碰到过类似的情况，咱们一步步来搞定这个问题！你的配置和使用场景里有几个关键点可能导致缓存没自动更新，我来帮你梳理清楚：

1. 先检查addTypename的设置 #

你把addTypename: false关掉了，但Apollo Client的缓存系统默认依赖__typename字段来识别不同类型的数据对象，没有它的话，Apollo没法准确找到要更新的缓存条目。

解决办法： #

• 优先建议把addTypename改回默认的true（直接删掉这个配置项就行）：

  const gqlClient = new ApolloClient({
    // 移除addTypename: false，默认即为true
    ssrMode: false, // 后面会说明这个配置的问题
    cache: new InMemoryCache({ }),
    link: new SchemaLink({ schema }),
  });
  

• 如果你因为特殊原因必须关闭addTypename，那需要手动在所有查询和Mutation里加上__typename字段，比如：

  const GET_USERS = gql`
    query GetUsers {
      users {
        id
        name
        __typename # 手动添加类型标识
      }
    }
  `;
  
  const CREATE_USER = gql`
    mutation CreateUser($input: UserInput!) {
      createUser(input: $input) {
        id
        name
        __typename # 手动添加类型标识
      }
    }
  `;
  

2. 手动用update函数更新缓存 #

因为你用的是SchemaLink（对接本地GraphQL Schema），Apollo Client的自动缓存更新逻辑可能不会触发（自动更新通常依赖服务端返回的变更上下文），这时候就需要在Mutation里手动写update函数来操作缓存。

举个例子，假设你有一个获取用户列表的查询，执行创建用户的Mutation后，要把新用户加到列表缓存里：

gqlClient.mutate({
  mutation: CREATE_USER,
  variables: { input: { name: "New User" } },
  update: (cache, { data: { createUser } }) => {
    // 先读取缓存里已有的用户列表
    const existingUsers = cache.readQuery({ query: GET_USERS });
    // 更新列表，把新用户追加进去
    cache.writeQuery({
      query: GET_USERS,
      data: {
        users: [...existingUsers.users, createUser]
      }
    });
  }
});

如果是更新单个对象，比如修改用户信息，你可以用cache.writeFragment来精准更新缓存里的某条数据：

const UPDATE_USER = gql`
  mutation UpdateUser($id: ID!, $name: String!) {
    updateUser(id: $id, name: $name) {
      id
      name
    }
  }
`;

gqlClient.mutate({
  mutation: UPDATE_USER,
  variables: { id: "123", name: "Updated Name" },
  update: (cache, { data: { updateUser } }) => {
    cache.writeFragment({
      id: `User:${updateUser.id}`, // 缓存对象ID格式为「类型:ID」
      fragment: gql`
        fragment UpdatedUser on User {
          name
        }
      `,
      data: { name: updateUser.name }
    });
  }
});

3. 确认ssrMode的配置 #

你把ssrMode: true打开了，但这个模式是给服务端渲染场景设计的，它会禁用一些客户端的缓存更新逻辑（比如自动监听变更）。如果你的Node.js应用不是在做SSR，只是普通的客户端场景（比如CLI工具、Electron应用等），建议把ssrMode改成false：

const gqlClient = new ApolloClient({
  cache: new InMemoryCache({ }),
  link: new SchemaLink({ schema }),
  ssrMode: false, // 非SSR环境设为false
});

总结一下 #

按照上面的步骤调整后，Mutation执行完缓存应该就能正常更新了。核心就是让Apollo能识别缓存对象的类型，再配合手动更新函数来同步缓存数据。

内容的提问来源于stack exchange，提问作者kree