āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā ā š shadcn/directory/clerk/clerk-docs/guides/users/reading ā āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā
āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā
ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā
Clerk provides a set of hooks and helpers that you can use to protect content and read user data in your Next.js application. Here are examples of how to use these helpers in both the client and server-side to get you started.
auth() and currentUser() are App Router-specific helpers that you can use inside of your Route Handlers, Middleware, Server Components, and Server Actions.
auth() helper will return the Auth object of the currently active user.currentUser() helper will return the Backend User object of the currently active user, which includes helpful information like the user's name or email address. It does count towards the Backend API request rate limit so it's recommended to use the useUser() hook on the client side when possible and only use currentUser() when you specifically need user data in a server context. For more information on this helper, see the currentUser() reference.The following example uses the auth() helper to validate an authenticated user and the currentUser() helper to access the Backend User object for the authenticated user.
[!NOTE] Any requests from a Client Component to a Route Handler will read the session from cookies and will not need the token sent as a Bearer token.
<Tabs items={["Server components and actions", "Route Handler"]}> <Tab> ```tsx {{ filename: 'app/page.tsx' }} import { auth, currentUser } from '@clerk/nextjs/server'
export default async function Page() {
// Use `auth()` to access `isAuthenticated` - if false, the user is not signed in
const { isAuthenticated } = await auth()
// Protect the route by checking if the user is signed in
if (!isAuthenticated) {
return <div>Sign in to view this page</div>
}
// Get the Backend API User object when you need access to the user's information
const user = await currentUser()
// Use `user` to render user details or create UI elements
return <div>Welcome, {user.firstName}!</div>
}
```
export async function GET() {
// Use `auth()` to access `isAuthenticated` - if false, the user is not signed in
const { isAuthenticated } = await auth()
// Protect the route by checking if the user is signed in
if (!isAuthenticated) {
return new NextResponse('Unauthorized', { status: 401 })
}
// Use `currentUser()` to get the Backend API User object
const user = await currentUser()
// Add your Route Handler's logic with the returned `user` object
return NextResponse.json({ user: user }, { status: 200 })
}
```
For Next.js applications using the Pages Router, the getAuth() helper will return the Auth object of the currently active user, which contains important information like the current user's session ID, user ID, and organization ID, as well as the isAuthenticated property which can be used to protect your API routes.
In some cases, you may need the full Backend User object of the currently active user. This is helpful if you want to render information, like their first and last name, directly from the server.
The clerkClient() helper returns an instance of the JS Backend SDK, which exposes Clerk's Backend API resources through methods such as the getUser(){{ target: '_blank' }} method. This method returns the full Backend User object.
In the following example, the userId is passed to the Backend SDK's getUser() method to get the user's full Backend User object.
<Tabs items={["API Route", "getServerSideProps"]}> <Tab> <Include src="_partials/nextjs/get-auth" /> </Tab>
<Tab> <Include src="_partials/nextjs/build-clerk-props" /> </Tab> </Tabs>useAuth()useUser()ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā
āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā