Next.js Discord

Discord Forum

Is there a way to grab the current URL in a nextjs 13 Layout component

Unanswered
Himalayan posted this in #help-forum
Open in Discord
HimalayanOP
Hello. I'm stuck on grabbing the current URL in nextjs 13 Layout component. I want to do it using the nextjs useRouter function, I'll attach my component without useRouter image below

src/app/layout.tsx

I'm not able to use the useRouter function in any of its forms (next/router or next/navigation). It can't be used because the Layout is a server component, if I change it to a client component then the metadata part won't work because of this error:

You are attempting to export "metadata" from a component marked with "use client", which is disallowed. Either remove the export, or the "use client" directive. Read more: https://nextjs.org/docs/getting-started/react-essentials#the-use-client-directive

Is there some workaround to this? I preferably don't want to use the previous version pages

nextjs version: 13.4.7

4 Replies

HimalayanOP
Giant panda
Also from the docs: Reading the current URL from a Server Component is not supported. This design is intentional to support layout state being preserved across page navigations.
If you want the current path add a client component as a child to the layout