Headers from header function are being returned on initial load but not on data?_routes=<route> loads

[scottdickerson]

I'm using React Router as a...

library

Reproduction

SSR site with two routes, and on each page <Link between them.

Add a headers function to set a cache-control header on the route.

export const loader = ({ request }: LoaderFunctionArgs) => {
  return data(
    {
     myData: 'data'
    },
    {
      headers: {
        'Cache-Control': determineCacheControlHeaderForAuction({ auction }),
      },
    }
  );
};

export const headers: HeadersFunction = ({ loaderHeaders }) => {
  return loaderHeaders;
};

On first load of the document it sends that header correctly.

However, when switching pages with the <Link when it sends the data?_routes XHR request to do the quick transition, the headers always come back no-store

I do have a function in entry.server.tsx to set cache-control in handleDataRequest to no-store.

export const handleDataRequest: HandleDataRequestFunction = response => {
  // Add headers
  response.headers.set('cache-control', 'no-store');
  return response;
};

In most cases this is what I want. However, in this specific case (because the data doesn't change very often and I'd like it to be cached by my CDN), I'm trying to override that header using the headers function for the two routes.

System Info

System:
    OS: macOS 14.6.1
    CPU: (12) arm64 Apple M3 Pro
    Memory: 2.01 GB / 36.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.18.1 - ~/.nvm/versions/node/v20.18.1/bin/node
    Yarn: 1.22.22 - /opt/homebrew/bin/yarn
    npm: 10.9.0 - ~/Documents/GitHub/phillips-public-remix/node_modules/.bin/npm
    pnpm: 9.15.4 - /opt/homebrew/bin/pnpm
    bun: 1.2.4 - ~/.bun/bin/bun
  Browsers:
    Brave Browser: 131.1.73.97
    Chrome: 134.0.6998.89
    Safari: 18.3
  npmPackages:
    @react-router/dev: ^7.0.0 => 7.1.3 
    @react-router/express: ^7.0.0 => 7.1.3 
    @react-router/node: ^7.0.0 => 7.1.3 
    @react-router/remix-routes-option-adapter: ^7.1.3 => 7.1.3 
    react-router: ^7.0.0 => 7.1.3 
    vite: ^5.4.14 => 5.4.14

Used Package Manager

npm

Expected Behavior

I expect the headers function in the route to set the headers on the ?data request just like it does for the initial HTML doc request.

http://localhost:3000/detail/test-artist/123456.data?_routes=routes%2F%28%24lang%29.detail.%28%24maker%29.%28%24seoName%29.%28%24auctionCode%29.%2

Actual Behavior

Only the initial doc load uses the headers function return value.