TTC
Theo's Typesafe CultHelge

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 a provider from framer-motion. But I also now need request headers on specific pages. How would you do that? Any ideas?
coy1
coy1•352d ago
You could read on the server and then pass it to the client as props
Helge
Helge•352d ago
how would you read it on the server?
hutajoullach
hutajoullach•352d ago
@Helge Are you using Express for the server? If so, you can use "req.get" to access the request header. Alternatively, you can access header in next.js api route with "req.headers". Next.js also allows you to access incoming request headers inside of your components by using "import { headers } from 'next/headers';"
Helge
Helge•352d ago
@hutajoullach thanks for the tip. Importing headers does not work as my page is a client comp and headers from next/headers is required in a server comp @hutajoullach going the api route might be an option I didn’t try yet
hutajoullach
hutajoullach•351d ago
I'm using npm package to access the user's ip address in the req headers in this api route, and then attaching to response. If you can not access certain header objs, you could try to find a module for it. https://github.com/hutajoullach/nextjs-threejs-pin-dropping-app/blob/main/src/pages/api/ip-data.ts
Want results from more Discord servers?
Add your server
More Posts
Can 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 synDrag and drop library recommendation?Whats the community-favorite option right now? I saw that react-beautiful-dnd isn't being maintainedtRPC invalid_type error with ClerkHi, I have this weird issue I've been trying to resolve for a while now. This is the error in browsSave selected option on dropdownHii, I have a dropdown list that is being made from an array and a Save button. When I click the savEnd-to-end testing tools, SuggestionsHey everyone! 😄 I hope you're all doing well. 👋 I have a couple of questions for you, and I'd reN Nested RelationsHi im having trouble dealing with nested includes. I have a Comment and reply structure and replies A question on procedure design.I would like to know if it is best to try combine procedures or keep them separated. I don't want toMigrating to supabase from create-t3-turboHey guys! I'm migrating a create-t3-turbo app to the supabase create-t3-turbo template, and I'm a biSystem dark mode not detected when using darkMode: "media" in tailwind.config.tsHello! I am building a simple starter project using Tailwind and `shadcn-ui` components. I want the What is wrapping a next server action in startTransition doing?This was brought up in another question. I came up with the following explination, however this is jCan I call tRPC procedure inside another procedure?Something like this: ```js export const mainRouter = createTRPCRouter({ create: privateProcedure Anyone know how to go about using Tailwind Animation to animate a linethrough on hover?Or framer motion.