seven
seven8mo ago

Cookie authentication flow

Hello can i get a bit of a help and explanation please? Im frontend learning backend on trpc, I have monorepo with trpc backend and next 14 frontend, I use wesockets, and my backend context accorgingly to the docs has type CreateHTTPContextOptions | CreateWSSContextFnOptions The problem is that in procedures I can’t use eg setHeader method from CreateHTTPContextOptions unless I type cast it so should I use a type assertion function or is there a way to infer proper type from createcontext so queries and mutation procedures have different context type than subscriptions? And when i log Object.keys(ctx) i get keys that are not available in CreateHTTPContextOptions ['router','createContext','middleware','req','res','path','info'] how can I get full type for that? I want to authorize my users so in registration route i want to set the authorization cookie, to do that to do that i do res.setHeader('Set-Cookie', 'authToken=exampleToken'); and i have this header set in my network tab, but in application tab in cookies section there is no such entry, should it be there? Then the other way round i want to authorize with my server from the frontend to do that in my trpc client in experimental_nextHttpLink i add headers function, here i have two issues one is that when i want to read my cookies from next/headers i get error that one of parents is a client component and indeed i get error from components that uses subscription inside useEffect, so how should i go about this? And the other issue is how can i authenticate in my subscriptions? Could you please give me a bit of explanation how these things should work or perhaps some mental model, i mean should i restructure it to have subscriptions in a separate client? Is it ok to have multiple clients? And how could i authorize in subscriptions? Some guidance would help me tremendously
Solution:
Hi i would like to answer my question, the problem was that i did not pass credentials: include to the fetch options, currenty i use experimental_createTRPCNextAppDirClient with experimental_nextHttpLink, this does not allow to pass options to fetch, would you consider adding this option in future release? thanks
Jump to solution
1 Reply
Solution
seven
seven8mo ago
Hi i would like to answer my question, the problem was that i did not pass credentials: include to the fetch options, currenty i use experimental_createTRPCNextAppDirClient with experimental_nextHttpLink, this does not allow to pass options to fetch, would you consider adding this option in future release? thanks