Question about next auth.

Hey all, The stack and full stack development in javascript in general is new for me. I finding my way around while using the documentation. But I was wondering what the best way/ implementation should be to use next auth to call a query from another API. Old API that is still in use for verification. I can make this call with the correct credentials . Afterwards i want to check in the same function for the email and password via a trpc query in a table in my database and return the result (unique user with that email and password) as my user in the session. But i'm kinda stuck on the big picture here i guess. Thanks in advance. And if this is not appropriate to ask in the discord. Feel free to delete this.
V
VIIKKK336d ago
CredentialsProvider({
name: 'Credentials',
credentials: {
username: { label: "email", type: "text", placeholder: "jsmith" },
password: { label: "password", type: "text", }
},
async authorize(credentials, req) {
const res = await fetch("test/login", {
method: 'POST',
body: JSON.stringify(credentials),
headers: { "Content-Type": "application/json" }
});

const response = await res.json();

if (res.ok && response.token) {
// If the API call was successful and the token exists
const user = {
id: response.token, // Provide a unique identifier for the user // Extract relevant user data from the API response
email: credentials.username, // Use the provided email as the user's email
password: credentials.password // Add any other relevant user data from the API response
};
const check = await CompanyEmployeeRouter.Authorize(user);

console.log(check);

}
CredentialsProvider({
name: 'Credentials',
credentials: {
username: { label: "email", type: "text", placeholder: "jsmith" },
password: { label: "password", type: "text", }
},
async authorize(credentials, req) {
const res = await fetch("test/login", {
method: 'POST',
body: JSON.stringify(credentials),
headers: { "Content-Type": "application/json" }
});

const response = await res.json();

if (res.ok && response.token) {
// If the API call was successful and the token exists
const user = {
id: response.token, // Provide a unique identifier for the user // Extract relevant user data from the API response
email: credentials.username, // Use the provided email as the user's email
password: credentials.password // Add any other relevant user data from the API response
};
const check = await CompanyEmployeeRouter.Authorize(user);

console.log(check);

}
` I guess this won't work (pseudocode) ?
S
Sebastian336d ago
The thing you explicitly outlined in the pseudocode would not work. You imported a specific router and tried to access a procedure on it. When tRPC initializes does a lot of things, constructs the context and other configurations ( especially if you have built it using create-t3-app ) which it then uses in the other underlying routers which you then compose in the appRouter. What you want to do is achievable, but you will have to import the appRouter and create a new instance by calling .createCaller({}) on it. It will give you a new tRPC router which you can use to authorize the user. Your code might look something like this:
CredentialsProvider({
name: 'Credentials',
credentials: {
username: { label: "email", type: "text", placeholder: "jsmith" },
password: { label: "password", type: "text", }
},
async authorize(credentials, req) {
const res = await fetch("test/login", {
method: 'POST',
body: JSON.stringify(credentials),
headers: { "Content-Type": "application/json" }
});

const response = await res.json();

if (res.ok && response.token) {
// If the API call was successful and the token exists
const user = {
id: response.token, // Provide a unique identifier for the user // Extract relevant user data from the API response
email: credentials.username, // Use the provided email as the user's email
password: credentials.password // Add any other relevant user data from the API response
};
// initialize the new tRPC router only if the other steps where successfull
const trpcRouter = appRouter.createCaller({});
const check = await trpcRouter.CompanyEmployeeRouter.Authorize(user);

console.log(check);

}
CredentialsProvider({
name: 'Credentials',
credentials: {
username: { label: "email", type: "text", placeholder: "jsmith" },
password: { label: "password", type: "text", }
},
async authorize(credentials, req) {
const res = await fetch("test/login", {
method: 'POST',
body: JSON.stringify(credentials),
headers: { "Content-Type": "application/json" }
});

const response = await res.json();

if (res.ok && response.token) {
// If the API call was successful and the token exists
const user = {
id: response.token, // Provide a unique identifier for the user // Extract relevant user data from the API response
email: credentials.username, // Use the provided email as the user's email
password: credentials.password // Add any other relevant user data from the API response
};
// initialize the new tRPC router only if the other steps where successfull
const trpcRouter = appRouter.createCaller({});
const check = await trpcRouter.CompanyEmployeeRouter.Authorize(user);

console.log(check);

}
S
Sebastian336d ago
you can also reffer to the official documentation for more details: https://trpc.io/docs/server/server-side-calls
Server Side Calls | tRPC
You may need to call your procedure(s) directly from the same server they're hosted in, router.createCaller() can be used to achieve this.
V
VIIKKK331d ago
Hmm. Still stuck on it. But thanks for the info!
S
Sebastian330d ago
what seems to not work
V
VIIKKK330d ago
I think i might be confused on how to interact with the session from there. Should it just work when I return an user? Or what is the next step? If you are willing I would love to share some more details in private in about an hour
S
Sebastian330d ago
sure, feel free to pm me
M
Maj330d ago
yo is credentails provider like a login form? just wondering never used credentials provider only other providers like google , discord etc
V
VIIKKK330d ago
yes
M
Maj330d ago
sick
Want results from more Discord servers?
Add your server
More Posts
Why does `npm create t3-app@latest` use the /pages directory. How can I use the app router?I want to build an application which uses the latest nextjs app router, however the `create t3-app@lnextjs13 do get request with searchbarHi, I am currently building a nextjs 13 project, trying to get in touch with the app router and servHow to sent a mutation procedure from the clientupdateUserStats:protectedProcedure .input(z.object({ id:z.string().nonempty(), pServer Actions high level questions (scale, request library, exposing to other clients)**1) how are you supposed to scale a backend if your business logic is in react components?** if thiupload thing jesthow to i set up testing with jest on components that include uploadthing? [2:40 PM] seems like it keNextJS and Bare MetalWhat all features would break/may not work if I decide to deploy to NEXTjs to bare metal instead of Cloud storage solutions for collaborating on local filesI want to collaborate on .md files (via Obsidian. for developer documentaion) and video recordings wcold startsI’m having an issue with my first queries after the db going idle taking about 11s to 12s which is cAndroid emulator cannot connect to my Expo without tunnelHello, I am building an app with `create-t3-turbo` in windows 11. I keep getting the error connectis this middleware is good for longterm?hello guys, in these code snippet i want to check if user is subs and valid, but i im wondering if tBidrectional Infinite Scrolling ImplementationHi guys have you ever implemented something like this in a chat application? or any application for Is it possible to generate a github action to build a preview of a pull request in nextjs?Im looking for a way to generate preview for my nextjs project but I didnt find a way to do it that File Uploads to Local StorageI'm building a website for my brother's shop. They want an admin panel where they can add new producChange ctx.session.user values to include new ones? Bad idea?Right now when using `ctx.session.user` I get a few default options that come with t3-app. `.id`, `Next13 app-router: How to get request headers on client page comp?All my pages are client components because I want to use page transitions and need to wrap them in aCan i send a file from trcp router?I want to send a xlxs/csv file to FE (expo). Can i do this like expressJs? or do i need to first upluseSession has an empty user object {}When using the useSession hook, session.data contains `{ user: {}, expires: '2023-06-30T20:30:42.181TypeSafe external API ?I am currently communicating with an external API and after falling in love with TRPC, I would like Want to request only half of the audio file but not workingi request an audio file from my server and stream it to the browser .. on the browser i make a requeHow is realtime DB syncing accomplished without Firestore/Supabase?Hi! I've been working with Firestore for a long time now and gotten very used to the realtime db syn