Apollo GraphQL 客户端“网络错误：在未定义的对象上找不到字段 XXXX”，disableOffline：false

Posted 2023-03-10

【中文标题】Apollo GraphQL 客户端“网络错误：在未定义的对象上找不到字段 XXXX”，disableOffline：false

【英文标题】：Apollo GraphQL Client 'Network error: Can't find field XXXX on object undefined' with disableOffline: false

【发布时间】：2020-02-08 01:46:00

【问题描述】：

我在使用 apollo-client 版本 2.4.6 查询我的 AWS AppSync 终端节点时遇到问题。 我可以使用 curl 命令成功查询 AWS AppSync 终端节点，但完全相同 在 Apollo 客户端上执行的 GraphQL 正在返回“Can't find field getTickets on object undefined”。

我是 GraphQL 和 Apollo 的新手。我是否在做一些愚蠢的事情来导致该错误？为什么会显示 NetworkError？为什么对象未定义？

编辑：我注意到如果我将构造函数中的disableOffline: true 传递给AWSAppSyncClient，那么它就会开始工作。为什么？为什么disableOffline: false 的默认客户端行为不起作用？

这是我在 AWS 上部署的超级简单 schema.graphql：

schema 
  query: Query


type Query 
  getTickets: [EmmDDavidTickets]
  @aws_api_key


type EmmDDavidTickets @aws_api_key 
  ticketNumber: ID!
  pnrNumber: String

这是用于在 AWS 上查询该端点的 curl 命令。注意有效的响应：

$ curl -X POST -H "x-api-key: --REDACTED--" https://wm3mz6anrjbrfpgbewnyyrio3u.appsync-api.us-east-1.amazonaws.com/graphql -d ' "query": "query list \ngetTickets  ticketNumber\n pnrNumber\n \n"'

"data":"getTickets":["ticketNumber":"12345","pnrNumber":null,"ticketNumber":"0001020202020","pnrNumber":"ABC123"]

这是我使用 Apollo 执行相同查询的 NodeJS 代码：

const apiKey ='--REDACTED--';
const region = 'us-east-1';
const type = 'API_KEY';
const url = 'https://wm3mz6anrjbrfpgbewnyyrio3u.appsync-api.us-east-1.amazonaws.com/graphql';

const gql = require('graphql-tag');
const query = gql(`
query list 
  getTickets 
      ticketNumber
  
`);

// Set up Apollo client
const client = new AWSAppSyncClient(
    url: url,
    region: region,
    auth: 
        type: type,
        apiKey: apiKey,
    ,
    disableOffline: false
);

client.hydrated().then(function (client) 
    //Now run a query
    client.query( query: query )
        .then(function logData(data) 
            console.log('results of query: ', data);
        )
        .catch(console.error);
);

这是来自 Apollo 的错误响应：

ApolloError: Network error: Can't find field getTickets on object undefined.
    at new ApolloError (/Users/dyoung/workspace//appsync_javascript_test/node_modules/apollo-client/bundle.umd.js:85:32)
    at /Users/dyoung/workspace//appsync_javascript_test/node_modules/apollo-client/bundle.umd.js:1039:45
    at /Users/dyoung/workspace//appsync_javascript_test/node_modules/apollo-client/bundle.umd.js:1411:21
    at Array.forEach (<anonymous>)
    at /Users/dyoung/workspace//appsync_javascript_test/node_modules/apollo-client/bundle.umd.js:1410:22
    at Map.forEach (<anonymous>)
    at QueryManager.broadcastQueries (/Users/dyoung/workspace//appsync_javascript_test/node_modules/apollo-client/bundle.umd.js:1405:26)
    at /Users/dyoung/workspace//appsync_javascript_test/node_modules/apollo-client/bundle.umd.js:988:35 
  graphQLErrors: [],
  networkError: Error: Can't find field getTickets on object undefined.
      at /Users/dyoung/workspace//appsync_javascript_test/node_modules/apollo-cache-inmemory/lib/bundle.umd.js:429:27
      at Array.forEach (<anonymous>)
      at StoreReader.diffQueryAgainstStore (/Users/dyoung/workspace//appsync_javascript_test/node_modules/apollo-cache-inmemory/lib/bundle.umd.js:426:36)
      at StoreReader.readQueryFromStore (/Users/dyoung/workspace//appsync_javascript_test/node_modules/apollo-cache-inmemory/lib/bundle.umd.js:401:25)
      at processOfflineQuery (/Users/dyoung/workspace//appsync_javascript_test/node_modules/aws-appsync/lib/link/offline-link.js:154:34)
      at /Users/dyoung/workspace//appsync_javascript_test/node_modules/aws-appsync/lib/link/offline-link.js:110:28
      at new Subscription (/Users/dyoung/workspace//appsync_javascript_test/node_modules/zen-observable/lib/Observable.js:183:34)
      at Observable.subscribe (/Users/dyoung/workspace//appsync_javascript_test/node_modules/zen-observable/lib/Observable.js:262:14)
      at /Users/dyoung/workspace//appsync_javascript_test/node_modules/aws-appsync/lib/client.js:182:67,
  message: "Network error: Can't find field getTickets on object undefined.",
  extraInfo: undefined

【参考方案1】：

据Apollo Docs on local state management：

我们需要在查询运行之前将初始状态写入缓存 以防止它出错。

当我没有初始化 Apollo 的 InMemoryCache 中的状态时，我抛出了几乎相同的错误。

要初始化AWSAppSyncClient的状态，可以参考React-Native + Apollo-Link-State + AWS Appsync : Defaults are not stored in cache和https://github.com/awslabs/aws-mobile-appsync-sdk-js/pull/96

【讨论】：

感谢您的回答。我永远不会猜到这一点。我认为 API 的默认用法需要这样的缓存启动而不会引发不指示您需要做什么的错误，这太疯狂了。

这个问题评论也值得注意github.com/awslabs/aws-mobile-appsync-sdk-js/issues/…，redux-offline会在auth.jwtToken抛出时卡住。