Access pathname in getServerSideProps?

[wereHamster]

Is there a way to get the pathname inside getServerSideProps? I see resolvedUrl (and url) but those include the interpolated params. I'd like to have the pathname as provided by next/router, eg blog/[post].

[icyJoseph]

Hi,

Since gSSP runs on the server, why not use path and __filename?

// pages/posts/[...slug].tsx
import path from "path";

const Foo = () => <div>Foo</div>;

export default Foo;

export const getServerSideProps = () => {
  console.log("__filename", path.basename(__filename));
  return { props: {} };
};

• __filename is injected by Node.js, similarly to __dirname, read: https://nodejs.org/api/modules.html#the-module-wrapper
• Notice that it will log [...slug].js, a js extension, and not tsx

Alternatively, to keep the actual extension:

// pages/posts/[...slug].tsx
import path from "path";

const Foo = () => <div>Foo</div>;

export default Foo;

export const getServerSideProps = () => {
  const __filename = new URL("", import.meta.url).pathname;
  console.log("__filename", path.basename(__filename));
  return { props: {} };
};

If you want to see the dirname, use directly __dirname or path.dirname(__filename).

The second approach might be more resilient in an ES modules era though.

You could also derive this info from params, by listing its own properties, which should be something like:

{ slug: [ 'a', 'b', 'c' ] }

But I guess that'd be very complex code, compared to just using the Node.js API.

[icyJoseph]

How were you planning to feed the pathname to wrapGetServerSideProps in the first place? Read it from ctx, right? You could still:

export const getServerSideProps = (ctx) => {
  const __filename = 'something'
  return wrapGetServerSideProps(async (ctx) => {
    // stuff happens
  })(ctx, __filename); // or maybe enhance `ctx` to extend the `GetServerSidePropsContext` type
};

// or

const __filename = "calculate-file-name"; 
const wrapGetServerSideProps = createWrapper(__filename);

export const getServerSideProps = wrapGetServerSideProps(async (ctx) => {
  // stuff happens
});

[wereHamster]

Passing it explicitly to wrapGetServerSideProps is what I'm doing right now, for lack of better options. I was hoping that it would be available via ctx. Passing it explicitly leaves room for mistakes…

[icyJoseph]

Well, if it's not present in the context then yeah, but if you enforce a factory pattern, and execute the factory with the filename as argument, then you'd gain a function which has closure over the filename, which certainly reduces the room for mistakes.

If you are not using TypeScript, you can have a check on the factory function to log a warning or throw an error if the filename was empty.

[robertveloso]

This works for me:

    const pathname =
      props.req[
        Object.getOwnPropertySymbols(props.req || {}).find(
          (s) => s.description === "NextRequestMeta"
        ) || 0
      ]?._nextMatch?.definition?.pathname;

[zargold]

Note that the equivalent code would be to use match?.definition.pathname and that you can use getRequestMeta(ctx.req, 'match')?.definition.pathname;