Burhan
Burhan5mo ago

Public and Private procedures Not working with Clerk and Prisma

I have initialized a create-t3-app. I want to use clerk as my auth provider. I have ran into a problem midway when setting up the middleware and making changes to the prisma client. Now this is what the api calls are returning
5 Replies
Burhan
Burhan5mo ago
No description
Burhan
Burhan5mo ago
/server/api/trpc.ts
import { TRPCError, type inferAsyncReturnType, initTRPC } from "@trpc/server";
import { type CreateNextContextOptions } from "@trpc/server/adapters/next";
import { getAuth, type SignedInAuthObject, type SignedOutAuthObject } from '@clerk/nextjs/server';
import superjson from "superjson";
import { ZodError } from "zod";

import { prisma } from "~/server/prisma";

type CreateContextOptions = Record<string, never>;


interface AuthContext {
auth: SignedInAuthObject | SignedOutAuthObject;
}

export const createContextInner = async ({ auth }: AuthContext ) => {
return {
auth,
}
}


// const createInnerTRPCContext = (_opts: CreateContextOptions) => {
// return {
// prisma,
// };
// };

// export const createTRPCContext = (opts: CreateNextContextOptions) => {
// return {
// ...createInnerTRPCContext({}),
// req: opts.req,
// };
// };

export const createContext = async (opts: CreateNextContextOptions) => {
return await createContextInner({ auth: getAuth(opts.req) })
}


const t = initTRPC.context<Context>().create({
transformer: superjson,
errorFormatter({ shape }) {
return shape
}
})

export const createTRPCRouter = t.router;
export type Context = inferAsyncReturnType<typeof createContext>;

export const publicProcedure = t.procedure;


const isAuthed = t.middleware(({ next, ctx }) => {
if (!ctx.auth.userId) {
throw new TRPCError({ code: 'UNAUTHORIZED' })
}
return next({
ctx: {
auth: ctx.auth,
},
})
})

// export this procedure to be used anywhere in your application
export const protectedProcedure = t.procedure.use(isAuthed)

export const mergeRouters = t.mergeRouters;
import { TRPCError, type inferAsyncReturnType, initTRPC } from "@trpc/server";
import { type CreateNextContextOptions } from "@trpc/server/adapters/next";
import { getAuth, type SignedInAuthObject, type SignedOutAuthObject } from '@clerk/nextjs/server';
import superjson from "superjson";
import { ZodError } from "zod";

import { prisma } from "~/server/prisma";

type CreateContextOptions = Record<string, never>;


interface AuthContext {
auth: SignedInAuthObject | SignedOutAuthObject;
}

export const createContextInner = async ({ auth }: AuthContext ) => {
return {
auth,
}
}


// const createInnerTRPCContext = (_opts: CreateContextOptions) => {
// return {
// prisma,
// };
// };

// export const createTRPCContext = (opts: CreateNextContextOptions) => {
// return {
// ...createInnerTRPCContext({}),
// req: opts.req,
// };
// };

export const createContext = async (opts: CreateNextContextOptions) => {
return await createContextInner({ auth: getAuth(opts.req) })
}


const t = initTRPC.context<Context>().create({
transformer: superjson,
errorFormatter({ shape }) {
return shape
}
})

export const createTRPCRouter = t.router;
export type Context = inferAsyncReturnType<typeof createContext>;

export const publicProcedure = t.procedure;


const isAuthed = t.middleware(({ next, ctx }) => {
if (!ctx.auth.userId) {
throw new TRPCError({ code: 'UNAUTHORIZED' })
}
return next({
ctx: {
auth: ctx.auth,
},
})
})

// export this procedure to be used anywhere in your application
export const protectedProcedure = t.procedure.use(isAuthed)

export const mergeRouters = t.mergeRouters;
/middleware.ts
import { authMiddleware } from "@clerk/nextjs";

export default authMiddleware({
// Routes that can be accessed while signed out
publicRoutes: ['/anyone-can-visit-this-route', '/api/trpc/'],
// Routes that can always be accessed, and have
// no authentication information
ignoredRoutes: ['/no-auth-in-this-route'],
});

export const config = {
// Protects all routes, including api/trpc.
// See https://clerk.com/docs/references/nextjs/auth-middleware
// for more information about configuring your Middleware
// matcher: ["/((?!.+\\.[\\w]+$|_next).*)", "/", "/(api|trpc)(.*)"],
};
import { authMiddleware } from "@clerk/nextjs";

export default authMiddleware({
// Routes that can be accessed while signed out
publicRoutes: ['/anyone-can-visit-this-route', '/api/trpc/'],
// Routes that can always be accessed, and have
// no authentication information
ignoredRoutes: ['/no-auth-in-this-route'],
});

export const config = {
// Protects all routes, including api/trpc.
// See https://clerk.com/docs/references/nextjs/auth-middleware
// for more information about configuring your Middleware
// matcher: ["/((?!.+\\.[\\w]+$|_next).*)", "/", "/(api|trpc)(.*)"],
};
Burhan
Burhan5mo ago
Integrate Clerk into your Next.js Pages Router app with tRPC | Clerk
Learn how to integrate Clerk into your Next.js application using tRPC. tRPC can be used with Clerk, but requires a few tweaks from a traditional Clerk + Next.js setup.
Burhan
Burhan5mo ago
Followed this documentation
BeBoRE
BeBoRE5mo ago
You are either not calling the right endpoint or you haven’t defined your endpoint
More Posts
Properly handle unifying interfaces from tRPC call?I have two types of objects in my database, `quests` and `tasks`, which share several common propertType 'QueryClient' is missing the following properties from type 'QueryClient': queryCache, mutationI'm getting this error: > Type 'QueryClient' is missing the following properties from type 'QueryClHow to properly handle Prima selects/includes with tRPC?Hello, my understanding of optimizing procedures to be the most efficient would be to enable one proonSuccess with createTRPCProxyClientWhat is the best way to setup onSuccess with createTRPCProxyClient?trpcNext from client for testingHi guys, I have created a client that uses a mock database for testing. Can I create a context and tMissing content type header for mutations leads to 405Im migrating my app from Next Pages Router to App Router. I implemented the new trpc wrapper as explIs there any way to temporarily disable mutations?My goal is to move into a read-only mode temporarily. I'm thinking anything could be fine as a shoAfter upgrading to 11.0.0-next-beta.300, every request throws zod errorI didn't do anything but upgrading the trpc, and the error throws: ```json {"issues":[{"code":"invaSetting up tRPC for next.js with edge AND serverless functionstldr: I am trying to build an app that uses both edge AND serverless functions by creating separate Hello i am using trpc open api but there is an issue regarding using z.optional() however in the libHello i am using trpc open api but there is an issue regarding using z.optional() however in the lib