Nextjs - Getting the referer as null sometimes when reading from the next headers

[rakeshneelarapu]

Link to the code that reproduces this issue

https://github.com/rakeshneelarapu/nextjs-headers

To Reproduce

1. checkout the project
2. npm install
3. npm run dev
4. open the browser on localhost:3000
5. check the referer is printed on the UI sometimes and upon refreshing the browser, we re getting the value as null consistently

Working Example

Not Working Example

Current vs. Expected behavior

Bug: Referer is coming as null when reading from the next/headers

Expected Behaviour: Referer should be fetched correctly when reading from the next/headers

Verify canary release

• [X] I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: darwin
  Arch: x64
  Version: Darwin Kernel Version 18.7.0: Tue Jun 22 19:37:08 PDT 2021; root:xnu-4903.278.70~1/RELEASE_X86_64
Binaries:
  Node: 20.10.0
  npm: 10.2.3
  Yarn: N/A
  pnpm: N/A
Relevant Packages:
  next: 14.0.3
  eslint-config-next: 14.0.3
  react: 18.2.0
  react-dom: 18.2.0
  typescript: 5.3.2
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

App Router, Routing (next/router, next/navigation, next/link)

Additional context

Sometimes when we hot reload the server or make any changes in the component files, it works fine, but most of the times, we see this issue of null

[AdarshKonchady]

Any updates on this issue?

Edit by maintainers: Comment was automatically minimized because it was considered unhelpful. (If you think this was by mistake, let us know). Please only comment if it adds context to the issue. If you want to express that you have the same problem, use the upvote 👍 on the issue description or subscribe to the issue for updates. Thanks!

[memeteli]

Any updates? I also have the same issue now.

Edit by maintainer bot: Comment was automatically minimized because it was considered unhelpful. (If you think this was by mistake, let us know). Please only comment if it adds context to the issue. If you want to express that you have the same problem, use the upvote 👍 on the issue description or subscribe to the issue for updates. Thanks!

[frankie-ug]

Currently facing the same issue. A workaround might be to use nextjs middleware

import { NextResponse } from 'next/server';

export function middleware(request: Request) {
  const requestHeaders = new Headers(request.headers);
  requestHeaders.set('my-url', request.url);

  return NextResponse.next({
    request: {
      headers: requestHeaders,
    },
  });
}

Then you can do:
const myUrl = headersList.get('my-url');

[desmati]

At times, headers() returns no headers whatsoever. This problem isn't limited to just the referer header; I'm experiencing it with other headers like next-url as well.

Even using middleware hasn't resolved the issue; I'm consistently receiving empty headers in certain instances.

[erkannebil]

Any updates? I also have the same issue.

Edit by maintainer bot: Comment was automatically minimized because it was considered unhelpful. (If you think this was by mistake, let us know). Please only comment if it adds context to the issue. If you want to express that you have the same problem, use the upvote 👍 on the issue description or subscribe to the issue for updates. Thanks!

[TomasSestak]

can confirm this

[carlpaten]

Still experiencing this issue

Edit by maintainer bot: Comment was automatically minimized because it was considered unhelpful. (If you think this was by mistake, let us know). Please only comment if it adds context to the issue. If you want to express that you have the same problem, use the upvote 👍 on the issue description or subscribe to the issue for updates. Thanks!

[SimRunBot]

for me referals from twitter are null in the headers.get("referer") object

however i suspect it is because of twitters handling of outgoing links

[contigen]

Getting the referer header in Next.js layout returns null for subsequent requests/renders, is there a fix? @leerob

[GeekMikle]

I´ve been able to reproduce this issue on my end too. Facing the same error.

[MantasJa]

having the same problem in Nextjs middleware, I get null all the time.

[IsraExe]

Same problem

Edit by maintainer bot: Comment was automatically minimized because it was considered unhelpful. (If you think this was by mistake, let us know). Please only comment if it adds context to the issue. If you want to express that you have the same problem, use the upvote 👍 on the issue description or subscribe to the issue for updates. Thanks!

[voie420]

Is there any fix to this? I'm facing the same issue...

Edit by maintainer bot: Comment was automatically minimized because it was considered unhelpful. (If you think this was by mistake, let us know). Please only comment if it adds context to the issue. If you want to express that you have the same problem, use the upvote 👍 on the issue description or subscribe to the issue for updates. Thanks!

[sid-bplx]

I saw this before using :) Can say, saved some time. Thanks.