ACF自定义字段通过WP GraphQL在Gatsby中查询突然返回null求助

故障原因 #

• 你在使用wpPage单节点查询时未指定过滤条件，该查询默认返回Gatsby拉取到的所有WordPress页面的第一个节点。你提到的allWpPage返回的第一个节点为空，就是这个无数据的页面（通常是你近期在WordPress后台新增的空白页、草稿页、回收站恢复页，或是WPGraphQL插件更新后默认拉取了之前被过滤的非公开页面），该页面没有填写homePage对应的自定义字段，因此返回全量null。
• 其他可能触发原因：WPGraphQL/WPGraphQL for ACF插件自动更新后调整了自定义字段的访问权限，或是gatsby-source-wordpress依赖小版本更新修改了单节点查询的默认匹配逻辑。

解决方案 #

1. 清理WordPress无效页面
   登录WordPress后台，检查所有页面（包括草稿、待审核、私有、回收站分类下的页面），删除不需要的空白无效页面，之后执行gatsby clean清理缓存重启服务即可。
2. 给单节点查询添加明确过滤条件
   如果需要保留对应空白页面，直接给wpPage查询加过滤规则，避免匹配到无效节点。比如你的首页slug为home，查询可以改成：

query MyQuery {
  wpPage(slug: {eq: "home"}) {
    homePage {
      heroSubtitle
      heroTitle
      heroPlaystoreCtaText
      heroImage {
        localFile {
          childImageSharp {
            gatsbyImageData(width: 614, height: 477, quality: 100, placeholder: BLURRED)
          }
        }
        altText
      }
    }
  }
}

更稳定的方式是按页面ID过滤，不会因为slug修改出现匹配异常。
3. 配置拉取规则过滤无效节点
在gatsby-config.js的gatsby-source-wordpress插件配置中添加页面过滤规则，直接不拉取非发布状态的页面，避免无效节点占用资源：

module.exports = {
  plugins: [
    {
      resolve: `gatsby-source-wordpress`,
      options: {
        url: `你的WordPress GraphQL接口地址`,
        type: {
          Page: {
            where: {
              status: `publish`
            }
          }
        }
      }
    }
  ]
}

配置修改完成后执行gatsby clean清理缓存，再重启开发服务即可。

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