I am wondering if there's a way for me to get the full URL of the current request inside the API route (pages/api/myapi), the only returned response I see that's close to what I need is the req.headers.referer, but I am not sure if this value will always be in the headers. The type for that is string | undefined.

There's also the req.headers.host and req.headers.origin but it's missing the protocol.

The end goal is to get the full URL inside my API handler function.i.e. ";

I am wondering if there's a way for me to get the full URL of the current request inside the API route (pages/api/myapi), the only returned response I see that's close to what I need is the req.headers.referer, but I am not sure if this value will always be in the headers. The type for that is string | undefined.

There's also the req.headers.host and req.headers.origin but it's missing the protocol.

The end goal is to get the full URL inside my API handler function.i.e. "https://example/api/test"

• javascript
• reactjs
• next.js

Share Improve this question Follow edited Feb 28, 2022 at 16:59 Toxnyc asked Feb 28, 2022 at 15:49 ToxnycToxnyc 1,3701212 silver badges2020 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

I see two options here.

Option 1

If the protocol is known (e.g. http or https), then bine

• req.headers.host - returns the hostname with the portnumber, e.g. localhost:3000
• req.url - returns the requested path, e.g. /api/test

Option 2

If the protocol is unknown, then we have to dig deeper to get the full URL. The req object exposes in the Symbol(NextRequestMeta) key the following values

{
  ...
  [Symbol(NextRequestMeta)]: {
    __NEXT_INIT_URL: 'http://localhost:3000/api/test',
    _protocol: 'http',

  }
}

There are several approaches for accessing Symbol's properties in an object. One example to access __NEXT_INIT_URL would be:

const nextRequestMeta = req[Reflect.ownKeys(req).find(
    (s) => String(s) === "Symbol(NextRequestMeta)"
)];
console.log(nextRequestMeta.__NEXT_INIT_URL); // -> http://localhost:3000/api/test