Theo's Typesafe Cult•2y ago

❌ tRPC failed on partition.getAll: UNAUTHORIZED

Hello gentle-men/waman, i have been struggling with implementing a custom credential provider the last two days.. haven't slept properly.. and now i must admit i need assistance. I have successfully implemented the "login/nextauth" part of the job, in the client side.. but when i call my queries from client i get ❌ tRPC failed on partition.getAll: UNAUTHORIZED .. I think the solution is that i somehow get my session from useSession() send to TRCP or auth by TRCP, but i dont know... thats what been bugging me the last 48 hours.. please some kind soul.. HELP MEE 🤯 P.S it think has something to do with the way the protected procedure autheticates a user. P.P.S if you need any futher information. Please dont hesitate to ask me. Thanks in advance!!

19 Replies

KarlosOP•2y ago

KarlosOP•2y ago

getAll: protectedProcedure.query(({ ctx }) => {
    console.log(ctx);
    return ctx.prisma.project.findMany({
      where: {
        userId: ctx.session.user.id,
      },
    });
  }),

getAll: protectedProcedure.query(({ ctx }) => {
    console.log(ctx);
    return ctx.prisma.project.findMany({
      where: {
        userId: ctx.session.user.id,
      },
    });
  }),

ja_iy•2y ago

owo7 are you calling the procedure after useSession has finished authenticating on the client side (using enabled in the useQuery call)

KarlosOP•2y ago

const { data: projects, refetch: refetchProjects } =
    api.project.getAll.useQuery(
      undefined, // no input
      {
        enabled: session?.user !== undefined,
        onSuccess: (data) => {
          setSelectedProject(selectedProject ?? data[0] ?? null);
        },
      }
    );

const { data: projects, refetch: refetchProjects } =
    api.project.getAll.useQuery(
      undefined, // no input
      {
        enabled: session?.user !== undefined,
        onSuccess: (data) => {
          setSelectedProject(selectedProject ?? data[0] ?? null);
        },
      }
    );

this is how i do am i doing something wrong?

ja_iy•2y ago

that looks good to me, maybe the shape of the session was changed somehow on the server side then, have you tried console logging the ctx in the protectedProcedure middleware

KarlosOP•2y ago

yeah when i do that i just get null

ja_iy•2y ago

for the entire ctx or just session :3?

KarlosOP•2y ago

ja_iy•2y ago

ah srry was looking inside getSeverAuthSession at ctx xd, not sure whats going wrong then ill try setup cred provider to see

KarlosOP•2y ago

thanks for the help man really appreciate it !! im losing my mind here XD also pretty new to the stack 😛 I am going to sleep its 3 AM here in DK, if you have any input or solution please post it here i will look at it first thing in the morning 👍

ja_iy•2y ago

The trpc api routes seem to be working for me using creds, If your getting the session with the correct shape on the client side then only thing I can think of is missing NEXTAUTH_SECRET env variable, you can set it in the .env file and then in authOptions in 'src/server/auth.ts' https://next-auth.js.org/configuration/options#nextauth_secret Alternatively you could try using the getToken method instead of getServerSession inside of getServerAuthSession to see if the token is valid then could be some problem with getting the session from the token on the server.

export const getServerAuthSession = async (ctx: { req: GetServerSidePropsContext["req"], res: GetServerSidePropsContext["res"] }) => {
    const session = await getServerSession(ctx.req, ctx.res, authOptions)
    const token = await getToken({ req:ctx.req })

    console.log('SESSION:', session, 'TOKEN:', token)
    return session
}

export const getServerAuthSession = async (ctx: { req: GetServerSidePropsContext["req"], res: GetServerSidePropsContext["res"] }) => {
    const session = await getServerSession(ctx.req, ctx.res, authOptions)
    const token = await getToken({ req:ctx.req })

    console.log('SESSION:', session, 'TOKEN:', token)
    return session
}

https://next-auth.js.org/tutorials/securing-pages-and-api-routes#using-gettoken I'm new to stack aswell is pretty cool : D, hope u had good sleep lmk results OwO.

Securing pages and API routes | NextAuth.js

You can easily protect client and server side rendered pages and API routes with NextAuth.js.

Options | NextAuth.js

Environment Variables

KarlosOP•2y ago

i cant seem to get it working, i would love to have a look at your code if its possbile, to see if missed something. Do you have it on github?

ja_iy•2y ago

can put it up sec

ja_iy•2y ago

https://github.com/ja-iy/t3-cred-test

GitHub

GitHub - ja-iy/t3-cred-test

Contribute to ja-iy/t3-cred-test development by creating an account on GitHub.

ja_iy•2y ago

make this .env file

# When adding additional environment variables, the schema in "/src/env.mjs"
# should be updated accordingly.

# Prisma
# https://www.prisma.io/docs/reference/database-reference/connection-urls#env
DATABASE_URL="file:./db.sqlite"

# Next Auth
# You can generate a new secret on the command line with:
# openssl rand -base64 32
# https://next-auth.js.org/configuration/options#secret
NEXTAUTH_SECRET="OwO"
NEXTAUTH_URL="http://localhost:3000"

# Next Auth Discord Provider
DISCORD_CLIENT_ID=""
DISCORD_CLIENT_SECRET=""

# When adding additional environment variables, the schema in "/src/env.mjs"
# should be updated accordingly.

# Prisma
# https://www.prisma.io/docs/reference/database-reference/connection-urls#env
DATABASE_URL="file:./db.sqlite"

# Next Auth
# You can generate a new secret on the command line with:
# openssl rand -base64 32
# https://next-auth.js.org/configuration/options#secret
NEXTAUTH_SECRET="OwO"
NEXTAUTH_URL="http://localhost:3000"

# Next Auth Discord Provider
DISCORD_CLIENT_ID=""
DISCORD_CLIENT_SECRET=""

then run npm install npx prisma migrate dev npm run db-seed the username and passowrd to login are in the seed file '/prisma/seed.ts'

KarlosOP•2y ago

i get this error

  error : Error: ENOENT: no such file or directory, scandir '/Users/karlos/Desktop/Again/Viddoe/migrations'
[Error: ENOENT: no such file or directory, scandir '/Users/karlos/Desktop/Again/Viddoe/migrations'] {
  errno: -2,
  code: 'ENOENT',
  syscall: 'scandir',
  path: '/Users/karlos/Desktop/Again/Viddoe/migrations'
}

  error : Error: ENOENT: no such file or directory, scandir '/Users/karlos/Desktop/Again/Viddoe/migrations'
[Error: ENOENT: no such file or directory, scandir '/Users/karlos/Desktop/Again/Viddoe/migrations'] {
  errno: -2,
  code: 'ENOENT',
  syscall: 'scandir',
  path: '/Users/karlos/Desktop/Again/Viddoe/migrations'
}

` when running prisma migrate dev i am using mongodb as databse

ja_iy•2y ago

ive only used mysql / sqlite so not sure what steps need to setup mongoDB srry if want can get in a call and share screen to try help

KarlosOP•2y ago

Yeah sure, thanks alot! i only have about 20 min, so hopefully can get it done in that time Should i call you?

ja_iy•2y ago

oki

Gaming

Programming

❌ tRPC failed on partition.getAll: UNAUTHORIZED