Apollo HTTP Link with DataLoader Batching

Common errors

• TypeError: Cannot read properties of undefined (reading 'request')

  cause Incompatibility with newer versions of Apollo Client's `ApolloLink` interface or `graphql` package's `execute` function due to breaking changes since 2018.
  fix Upgrade Apollo Client and related `apollo-link` packages to a modern, compatible version (v3+), and migrate away from `http-link-dataloader` to a current solution for batching and caching. Alternatively, downgrade Apollo Client and GraphQL dependencies to versions compatible with `http-link-dataloader`'s last release (e.g., Apollo Client 2.x and GraphQL 14).

• Error: GraphQL error: Response not successful: Received status code 400

  cause The GraphQL server does not support the array-based batching format sent by `http-link-dataloader`, leading to a malformed request error.
  fix Configure your GraphQL server to accept and process an array of GraphQL operations. If server-side support is not feasible, switch to an Apollo Link that uses a different batching strategy or disables batching entirely.

• Unexpected data being returned or stale data in subsequent requests

  cause The DataLoader's cache is persisting across multiple client requests in a shared server environment, leading to data from one client being returned to another or old data not being refreshed.
  fix Ensure that a *new* instance of `HTTPLinkDataloader` is created for *each* incoming GraphQL request on the server. For example, if using `graphql-yoga` or `ApolloServer`, instantiate the link within the `context` function.

Warnings

• breaking The package was last updated in 2018 for GraphQL 14 support. It is highly likely to be incompatible with newer versions of Apollo Client (v3+) and GraphQL (v15+) due to significant changes in their ecosystems.
  Fix: Consider using alternative, actively maintained Apollo Link implementations for batching (e.g., `apollo-link-batch-http` or `apollo-link-batch`) or modern `dataloader` patterns within resolvers. If absolutely necessary, pin `apollo-client` and `graphql` dependencies to versions compatible with 2018 releases.
• gotcha DataLoader aggressively caches results within its instance. For server environments, a new instance of `HTTPLinkDataloader` should be created for every incoming HTTP request to prevent caching data across different client requests or authenticated scopes, which could lead to data leakage or stale data.
  Fix: Always instantiate `HTTPLinkDataloader` (or `BatchedHTTPLink` as mentioned in the README) within the context of a single request, ensuring a fresh cache for each client operation. For example, in a `graphql-yoga` context function.
• gotcha The library uses array-based batching, meaning the GraphQL server needs explicit support for receiving and processing an array of GraphQL queries in a single HTTP request. Many modern GraphQL servers do not support this out-of-the-box or have deprecated it in favor of alternative batching strategies.
  Fix: Verify that your GraphQL server explicitly supports array-based batching. If not, consider server-side alias-based batching or alternative client-side batching links.
• deprecated The package appears abandoned, with the last publish over seven years ago (as of April 2026). This means there will be no further updates for bug fixes, security vulnerabilities, or compatibility with newer dependencies and language features.
  Fix: Migrate to a more actively maintained Apollo Link or a custom DataLoader implementation if batching and caching are required. Evaluate potential security risks from unpatched transitive dependencies.

Install

• npm install http-link-dataloader npm
• yarn add http-link-dataloader yarn
• pnpm add http-link-dataloader pnpm

Imports

• HTTPLinkDataloader
  wrong:

  const HTTPLinkDataloader = require('http-link-dataloader')

  correct:

  import { HTTPLinkDataloader } from 'http-link-dataloader'

  The package ships with TypeScript types and is intended for ES module environments.

Quickstart

Demonstrates how to import and instantiate the `HTTPLinkDataloader` with basic and authenticated configurations, and integrate it into an Apollo Client instance for querying.

import { ApolloClient, InMemoryCache } from '@apollo/client';
import { HTTPLinkDataloader } from 'http-link-dataloader';

// Basic instantiation without options
const basicLink = new HTTPLinkDataloader();

// Instantiation with URI and headers
const token = process.env.AUTH_TOKEN ?? ''; // Securely get your auth token
const httpLink = new HTTPLinkDataloader({
  uri: `https://your-graphql-api.com/graphql`,
  headers: { Authorization: `Bearer ${token}` },
});

// Example of setting up an Apollo Client with the dataloader link
// Note: This package might not be compatible with modern Apollo Client versions (v3+).
// This example assumes compatibility or a legacy Apollo Client setup.
const client = new ApolloClient({
  link: httpLink,
  cache: new InMemoryCache(),
});

// Example query using the client (requires your GraphQL schema)
async function fetchData() {
  try {
    const { data } = await client.query({
      query: `
        query GetItems {
          items {
            id
            name
          }
        }
      `,
    });
    console.log('Fetched data:', data);
  } catch (error) {
    console.error('Error fetching data:', error);
  }
}

fetchData();