marmelab/react-admin · error · HttpError
${(error?.networkError as ServerError)?.message}
Error message
${(error?.networkError as ServerError)?.message} What it means
handleError converts ApolloError instances into react-admin HttpErrors. When the error carries a networkError typed as ServerError, its message and statusCode are used; this surfaces network-level failures (non-2xx responses from the GraphQL endpoint) as the thrown error message.
Source
Thrown at packages/ra-data-graphql/src/index.ts:259
if (!introspectionResultsPromise) {
introspectionResultsPromise = resolveIntrospection(
client,
introspection
);
}
return introspectionResultsPromise;
}
},
client,
};
return raDataProvider;
};
const handleError = (error: ApolloError) => {
if (error?.networkError as ServerError) {
throw new HttpError(
(error?.networkError as ServerError)?.message,
(error?.networkError as ServerError)?.statusCode
);
}
throw new HttpError(error.message, 200, error);
};
const getQueryOperation = query => {
if (query && query.definitions && query.definitions.length > 0) {
return query.definitions[0].operation;
}
throw new Error('Unable to determine the query operation');
};
export type GetIntrospection = () => Promise<IntrospectionResult>;
export type GraphqlDataProvider = DataProvider & {View on GitHub (pinned to 051f511bb0)
Solutions
- Inspect the networkError's message/statusCode to identify the underlying HTTP failure.
- Fix the server-side error indicated by the status code (500 = server bug, 401 = auth, 404 = wrong URL).
- Verify the GraphQL endpoint URL and that the server is reachable (test with curl/Postman).
- Check server logs or proxy logs for the actual failure.
Example fix
// before
const client = new ApolloClient({ uri: 'https://api.example.com/gql' }); // 404
// after
const client = new ApolloClient({ uri: 'https://api.example.com/graphql' }); Defensive patterns
Strategy: try-catch
Validate before calling
// Preflight the endpoint before app use:
const res = await fetch(graphqlUrl, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: '{"query":"{ __typename }"}' });
if (!res.ok) throw new Error(`GraphQL endpoint unhealthy: ${res.status}`); Type guard
const isServerError = (e: unknown): e is { message: string; statusCode: number } =>
typeof e === 'object' && e !== null && 'statusCode' in e && typeof (e as any).statusCode === 'number'; Try / catch
try {
return await dataProvider.getList(resource, params);
} catch (e) {
if (e instanceof HttpError && e.body instanceof ApolloError && e.body.networkError) {
const se = e.body.networkError as ServerError;
console.error(`GraphQL network failure ${se.statusCode}: ${se.message}`);
}
throw e;
} Prevention
- Monitor the GraphQL endpoint's health and status codes.
- Centralize error handling (e.g. a query error callback) to log networkError details.
- Check server/proxy logs when 5xx statuses appear.
- Validate apiUrl configuration per environment.
When it happens
Trigger: Any Apollo client request that fails at the network/HTTP level — server returning 4xx/5xx, gateway errors, server down — so ApolloError.networkError is a ServerError whose message becomes the thrown HttpError message.
Common situations: GraphQL server returning 500 with an HTML error page; auth middleware returning 401/403; wrong apiUrl; reverse proxy errors; server crashes.
Related errors
- Empty sparse fields. Specify at least one field or remove th
- Requested sparse fields not found. Ensure sparse fields are
- Unknown resource ${resourceName}. Make sure it has been decl
- No query or mutation matching fetch type ${raFetchType} coul
- Unable to determine the query operation
AI-assisted analysis of marmelab/react-admin@051f511bb0 (2026-08-30).
Data as JSON: /api/errors/49febcac7c65bfa2.
Report an issue: GitHub.