Kimfucious Posts - Answer Overflow

Kimfucious

•Created by Kimfucious on 9/26/2024 in #questions

headers: heads vs. CreateNextContextOptions

Howdy, I've been following this nifty video on YouTube: https://youtu.be/YkOSUVzOAA4?si=_D4dZp4vBHzIJFXK It may be a bit dated, as the code in the video isn't lining up with the code in the repo link. Right around 1:23, Theo goes into how to use Clerk to effectively prevent access to tRPC procedures, using a private procedure that invokes some enforceAuth middleware. My question is that opts here wouldn't work:

export const createTRPCContext = async (opts: CreateNextContextOptions) => {
  // watch 1:21 at https://youtu.be/YkOSUVzOAA4?si=ZPeiTCVKMH_7tjvd
  // auth doesn't have the user object, only the userId
  const { req } = opts;
  const auth = getAuth(req);
  const currentUserId = auth.userId;
  return {
    db,
    currentUserId,
    ...opts,
  };
};

export const createTRPCContext = async (opts: CreateNextContextOptions) => {
  // watch 1:21 at https://youtu.be/YkOSUVzOAA4?si=ZPeiTCVKMH_7tjvd
  // auth doesn't have the user object, only the userId
  const { req } = opts;
  const auth = getAuth(req);
  const currentUserId = auth.userId;
  return {
    db,
    currentUserId,
    ...opts,
  };
};

The issue is that changing opts from opts:{headers: Headers} to {opts: CreateNextContextOptions} (as what's shown in the video) breaks ~/trpc/server:

const createContext = cache(() => {
  const heads = new Headers(headers());
  heads.set("x-trpc-source", "rsc");

  return createTRPCContext({
    headers: heads,
  });
});

const createContext = cache(() => {
  const heads = new Headers(headers());
  heads.set("x-trpc-source", "rsc");

  return createTRPCContext({
    headers: heads,
  });
});

In the video ~trpc/server.is is never touched, so I'm befuddled.
Any help would be most appreciated.

2 replies

Gaming

Programming