Header missing in Edge runtime

Question

When running this code on the Edge runtime, the headers I set in the middleware response.headers.set('x-foo-bar', 'foo-bar');) are missing. However, when running the same code on the NodeJS runtime, the headers appear correctly.

Is this expected behavior on the Edge runtime? If so, could you explain why this happens? Additionally, is there a fix or workaround to ensure the headers are set properly?

import { headers } from 'next/headers';

export const runtime = 'edge' // or node;

export default async function Page() {
  const nextHeaders = headers();

  return (
    <code>
      <pre>{JSON.stringify(Array.from(nextHeaders.entries()), null, 2)}</pre>
    </code>
  );
};


      {JSON.stringify(Array.from(nextHeaders.entries()), null, 2)}

); };

Brown bear · Answer

Link to example:https://edge-headers-issue-git-main-ryan-georges-projects.vercel.app/debug/edgehttps://edge-headers-issue-git-main-ryan-georges-projects.vercel.app/debug/nodeexport function middleware() {
    const response = NextResponse.next();

response.headers.set('x-test', 'foo-bar');

return response;
}

Header missing in Edge runtime

1 Reply