Skip to Content
Clerk logo

Clerk Docs

Ctrl + K
Go to clerk.com

useAuth()

The useAuth() hook is a convenient way to access the current auth state. This hook provides the minimal information needed for data-loading and helper methods to manage the current active session.

useAuth() returns

NameTypeDescription
isSignedInbooleanA boolean that returns true if the user is signed in.
isLoadedbooleanA boolean that until Clerk loads and initializes, will be set to false. Once Clerk loads, isLoaded will be set to true.
userIdstringThe current user's ID.
sessionIdstringThe current user's session ID.
orgIdstringThe current user's active organization ID.
orgRolestringThe current user's active organization role.
orgSlugstringThe current user's organization slug.
signOut()(options?: SignOutOptions) => Promise<void>A function that signs the user out. See the reference documentation for more information.
getToken()(options?: GetTokenOptions) => Promise\<string | null\>A function that returns a promise that resolves to the current user's session token. Can also be used to retrieve a custom JWT template. See the reference documentation for more information.
has()(isAuthorizedParams: CheckAuthorizationParamsWithCustomPermissions) => booleanA function that returns a boolean based on the permission or role provided as parameter. Can be used for authorization. See the reference documentation(opens in a new tab) for more information.

How to use the useAuth() hook

The following example demonstrates how to use the useAuth() hook to access the current auth state, like whether the user is signed in or not. It also demonstrates a basic example of how you could use the getToken() method to retrieve a session token for fetching data from an external resource.

external-data-page.tsx
import { useAuth } from '@clerk/clerk-react'; export default function ExternalDataPage() { const { getToken, isLoaded, isSignedIn } = useAuth(); if (!isLoaded) { // Handle loading state however you like return <div>Loading...</div>; } if (!isSignedIn) { // Handle signed out state however you like return <div>Sign in to view this page</div>; } const fetchDataFromExternalResource = async () => { const token = await getToken(); // Add logic to fetch your data return data; } return <div>...</div>; }

Last updated on March 1, 2024

What did you think of this content?

Clerk © 2024