Redirect If Not Authed Pattern

Hi, is there any reason that it's not good to use the following pattern to gate pages?

export async function getServerSideProps(ctx: GetServerSidePropsContext) {
  // Redirect to Landing Page if Not Logged in
  return redirectIfNotAuthed({
    ctx,
    redirectUrl: "/",
  });
}

where we have

export async function redirectIfNotAuthed({
  ctx,
  redirectUrl,
  callback,
}: {
  ctx: GetServerSidePropsContext;
  redirectUrl: string;
  callback?: () => any;
}) {
  const session = await getSession(ctx);

  if (!session) {
    if (callback) {
      callback();
    }

    return {
      redirect: {
        permanent: false,
        destination: redirectUrl,
      },
      props: {},
    };
  } else {
    if (callback) {
      callback();
    }
    return { props: {} };
  }
}

It works fine but was just wondering if there is some reason this scales poorly or somethin

9 Replies

Neto•3y ago

the idea is fine that is something that iron session allow you to do

Neto•3y ago

https://www.npmjs.com/package/iron-session#nextjs-usage

npm

iron-session

Node.js stateless session utility using signed and encrypted cookies to store data. Works with Next.js, Express, NestJs, Fastify, and any Node.js HTTP framework.. Latest version: 6.3.1, last published: a month ago. Start using iron-session in your project by running npm i iron-session. There are 20 other projects in the npm registry using iron...

Neto•3y ago

HoC is better to identify i would argue

alexjyoungOP•3y ago

HoC?

Neto•3y ago

high order component a function that returns a funcion on that instance is called high order function*

alexjyoungOP•3y ago

oh gotcha okay cool so should be fine to do it this way?

Neto•3y ago

either way should be fine if its readable for the person using it, then is fine

rocawear•3y ago

I have done it like this:

import { getServerAuthSession } from "../server/common/get-server-auth-session";

export const getServerSideProps: GetServerSideProps = async (context) => {
  const session = await getServerAuthSession({
    req: context.req,
    res: context.res,
  });

  console.log("session", session);

  if (!session) {
    return {
      redirect: {
        destination: "/",
        permanent: false,
      },
    };
  }

  return { props: {} };
};

export const getServerAuthSession = async (ctx: {
  req: GetServerSidePropsContext["req"];
  res: GetServerSidePropsContext["res"];
}) => {
  return await unstable_getServerSession(ctx.req, ctx.res, authOptions);
};

import { getServerAuthSession } from "../server/common/get-server-auth-session";

export const getServerSideProps: GetServerSideProps = async (context) => {
  const session = await getServerAuthSession({
    req: context.req,
    res: context.res,
  });

  console.log("session", session);

  if (!session) {
    return {
      redirect: {
        destination: "/",
        permanent: false,
      },
    };
  }

  return { props: {} };
};

export const getServerAuthSession = async (ctx: {
  req: GetServerSidePropsContext["req"];
  res: GetServerSidePropsContext["res"];
}) => {
  return await unstable_getServerSession(ctx.req, ctx.res, authOptions);
};

alexjyoungOP•3y ago

ah, this wrapper is in the create-t3-app starter, didnt realize it was supposed to be used like that

Gaming

Programming

Redirect If Not Authed Pattern